MANUAL DE CAPACITACIÓN Sistema Joomla WEB CMS 2.5. HogarPara. SusNiños.

Transcripción

1 MANUAL DE CAPACITACIÓN Sistema Joomla WEB CMS 2.5 HogarPara SusNiños

2 Pág. 1 Quito, 13 de Octubre del 2013 Señores HOGAR PARA SUS NIÑOS Presente.- Estimados Es grato para nuestra empresa tener la oportunidad de poner a su disposición la capacitación correspondiente al sistema Joomla Web CMS para el sitio web HOGAR PARA SUS NIÑOS. Los puntos considerados para la elaboración de está capacitación son los siguientes: Accesos al sistema... Pág. 3 Ambiente del Sistema Front End y Back End... Pág. 3 Editar un documento (página web)... Pág. 4 Editar un documento (página web)... Pág. 5 Agregar/insertar una Imagen... Pág. 6 Slides o Fotografías Principales en la página de inicio he Internas... Pág. 7 Manejo de los diferentes Modulos como son LogoTipo, Creditos, Dirección y Tu Aporte Cuenta Esto lo explicamos en las... Pág. 8 Galería de imágenes (Galería de Fotos)... Pág. 9 Galería de Videos... Pág. 10 Ingreso o Edición de la sección de Noticias y Eventos para la página de inicio... Pág. 11 SEO WEBS DESIGN, siempre estará a las ordenes para ayudar al personal de la empresa FUNDACIÓN PARA SUS NIÑOS en cualquier tema de ayuda o aclaración sobre el uso de este sistema gestor de contenidos amigable usado para el desarrollo y manejo de la pagina web publicada bajo el nombre de dominio

3 1. Accesos al sistema Para acceder al sistema implementado para el HOGAR PARA SUS NIÑOS debe tener conexión a internet y colocar en su navegador web el siguiente enlace: Se despliega un cuadro de diálogo con los campos de: Username, Password en los cuales debe ingresar los datos de acceso enviados por el administrador del sistema. El campo restante de Language tiene por defecto el idioma de instalación del sistema que es inglés y español. Click en acceder y usted inmediatamente se encuentra frente a la estructura interna del sistema. 2. Ambiente del Sistema Front End y Back End

4 Si los datos que digitó para acceder eran los correctos Ud. debe ser redireccionado/a al Panel de Administración Principal. Conviene tener abiertas dos ventanas (o pestañas) del navegador, cada vez que administremos el sitio. En la ventana cargaremos la interfaz administrativa: Y en la otra pestaña cargaremos la interfaz pública del sitio De esta manera, podremos ir alternando la visualización en ambas. Cada vez que hacemos un cambio en el administrador, vemos cómo queda en la parte pública, maximizando su respectiva ventana (o seleccionando su pestaña en el navegador). Esto nos permitirá comprender rápidamente cómo funciona el sistema. Recuerde presionar CTRL y/o F5 en la ventana pública del sitio para visualizar los cambios después de grabar o editar en el administrador. 3 Crear un documento Nuevo (página web) Desde el Panel Principal debe hacer clic en Contenido / Gestor de Artículos. Vamos a seleccionar un articulo o pagina existente ya que es la mejor forma de crear y editar un articulo o pagina, para ello vamos a seleccionar en los campos de Filtro en Seleccionar Categoría escogemos Quienes Somos, Marcamos damos clic en el nombre Historia, esperamos a que se abra y luego ponemos en Guardar con Copia.

5 Una ves que se abre el articulo, tenemos las áreas a Editar en su respectivo orden y según la preferencia. 1) Ponemos el título que deseamos 2) Dejamos en blanco o colocamos el mismo nombre en el Alias 3) Seleccionamos la Categoría donde se desplegara el Artículo 4) Siempre debe estar marcado Publicado 5) Guardamos con Copia el nuevo articulo Abajo tenemos las Áreas de Texto y Imágenes donde vamos a editar o colocar el contenido correspondiente al nuevo Articulo. Datos y estado del documento: Title del documento, alias, estado de publicación (publicado o no publicado), sección y categoria a la cual pertenece el documento actual, front page (esto nos indica si el documento está publicado en la página principal o no) Campo de trabajo: el mismo es donde va el cuerpo del documento: el texto, las imágenes, y los enlaces que se pueden editar (todo esto se llama hipertexto). Campo de Herramientas: Aquí están las herramientas que sirven para formatear el cuerpo del documento editado: insertar y editar imágenes, alinear el texto/imagen, establecer jerarquías entre encabezados de textos (títulos y subtítulos entre los diferentes párrafos), insertar tablas, enlaces, utilizar formato para los párrafos de texto: viñetas, negritas, itálicas, etc Al crear un documento nuevo, debe colocarle un título al documento, un alias (usualmente es el mismo que colocamos en el título), y seleccionar una sección y categoría (previamente creadas) donde pertenecerá ese documento. Luego proceda a colocar el contenido del documento en el campo de trabajo, utilizando el editor visual para formatear el contenido. Cuando el documento está listo: Guarde o aplique los cambios.

6 4 Subir una Imágen o fotografia a nuestro nuveo artículo. 6) vamos a subir una imagen a nuestro nuevo articulo. Damos clic sobre el botón de imagen (6) Ver grafico anterior y se abre la siguiente ventana.. 1) Vamos a seleccionar la Carpeta en el caso de ya tener cargada la imagen o buscamos la imagen y la cargamos desde nuestra PC directamente a la carpeta existente o nueva que creemos con los iconos que tenemos a continuación: 2) Marcamos la imagen que vamos a colocar en nuestro articulo 3) Manejamos los parámetros y medidas de la imagen nueva.

7 5 Imagenes de cabecera Slider Para cambiar o aumentar las imágenes de la cabecera en la pagina principal he internas vamos a primero usar un Editor de imágenes como PS ( Adobe Photoshop ) La medida de la imagen es de 925px por 257px y usando el gráfico de imágenes las vamos a subir en la siguiente carpeta dentro del sistema. Nombre de la carpeta donde alojaremos las imágenes de la cabecera principal. images/slider-home/ Por el momento y para el fácil nombramiento de las imágenes hemos subido con los siguientes nombres 1, 2, 3, 4, 5. Vamos a ingresar en el Menú proncipal en Extensiones al Gestor de Módulos y seleccionamos el Modulo con ID 133 llamado Slider Principal Home En este modulo dentro de Opciones Básicas vamos a poder aumentar y disminuir la cantidad de imagenes que aparecen en la cabecera del sitio para lo cual encontraremos los campos con los siguientes links a los que vamos a editar o aumentar. images/slider-home/1.jpg

8 6 Detalles y explicación de los diferentes módulos o gráfico que aparecen tanto en la pagina principal como en las paginas internas LogoPrincipal se marca con la ID 132 ( Dentro de este modulo podremos reemplazar o editar el logotipo de la institución así como también ponerle un link interno o externo. Créditos se marca con la ID 145 donde podremos editar el año del Copyright, el que se encuentra al pie de la pagina y los datos del Diseñador del sitio web Dirección se marca con ID 146 donde podremos editar todos los datos de contacto como números de teléfonos y dirección de la fundación Tu Aporte CUENTA, en este caso tenemos duplicada esta opción ya que el uno podremos ver marcado como Izquierda y el otro como Derecha ya que pertenecen a la pagina Interna y Home respectivamente. Para la home tenemos marcado DERECHA con la ID 136 Para la interna tenemos marcado IZQUIERDA con la ID 147

9 7 Edición de Galerías Esta opción la podemos encontrar en el menú superior en Componentes, ahí seleccionamos Poca Gallery y se nos desplegara el gestor completo. En el cuadro de Imágenes podremos Editar y subir todas las imágenes que deseamos y ordenarlas en las correspondientes paginas, tanto de Quito como de Latacunga para lo cual vamos a trabajar con las opciones que tenemos a la derecha superior como son Nuevo, Añadir Múltiples y Editar También vamos a utilizar la barra de herramientas del Panel de control para ver las opciones como las categorías etc.. Recomendamos antes de subir esta imágenes en las respectiva carpetas, Editarlas con Adobe Photoshop a una medida de 800px por 600px

10 8 Edición de Videos Esta opción la podemos encontrar en el menú superior en Componentes, ahí seleccionamos Youtube Gallery y se nos desplegara el gestor completo. En el cuadro de vídeos podremos Editar y subir nuevos videos tomados directamente desde su canal de YouTube los cuales vamos a pegar el link únicamente como le mostramos en el siguiente gráfico. Por ejemplo para aumentar un vídeo en las paginas o articulo interno dentro de Publicaciones / Videos Recientes, seleccionamos en el link Vídeos y desplegamos la siguiente pagina para agregar un link nuevo y en este caso tendremos 3, 4 o mas vídeos visibles en ese articulo.

11 8 Noticias Para agregar noticias a nuestro sitio debemos seleccionar en la categoría Noticias y aumentar un articulo nuevo con el nombre de la Noticia que vamos a publicar. 9 Eventos Para agregar eventos a nuestro sitio debemos seleccionar en la categoría Eventos y aumentar un articulo nuevo con el nombre del evento que vamos a publicar.