MANUAL DE USO SISTEMA DE GESTIÓN DEL DE CONTENIDO CMS WORDPRESS TIPOLOGÍA EMPRESA PÚBLICA

Transcripción

1 DEL MANUAL DE USO SISTEMA DE GESTIÓN DE CONTENIDO CMS WORDPRESS PARA EL SITIO WEB 3.0 TIPOLOGÍA EMPRESA PÚBLICA

2

3 DEL MANUAL DE USO SISTEMA DE GESTIÓN DE CONTENIDO CMS WORDPRESS PARA EL SITIO WEB 3.0 TIPOLOGÍA EMPRESA PÚBLICA

4

5 1. Presentación 7 2. Ingreso al sistema 9 3. Barra de herramientas Inicio Logo cabecera Dirección footer Imágenes cabeceras Banner Rotativo Menú Servicios Menú Enlaces Banners Lite Creación y Edición de Contenido Creación Edición Edición Hoja de Vida / Directorio Edición de páginas Indicadores Tablas Descargas Añadir / Editar Categorías Cargar archivos Cargar archivos con visualización Administración de Menús Añadir / Editar Menús Módulo Disqus Ingreso Créditos 38

6

7 1. Presentación El manual de uso del sistema de gestión de contenido CMS WordPress para los Sitios Web 3.0 en las Entidades Gubernamentales, es una guía procedimental sencilla que resuelve las necesidades de quienes administran este recurso. Este manual se constituirá en la herramienta primaria para auxilio en la administración de contenido. En él se listan uno a uno los casos y procedimientos específicos para dar mantenimiento al sitio web. Consideraciones Generales Para una correcta administración del contenido del sitio web gubernametal, es necesario seguir en orden las instrucciones listadas y además se deben considerar las reglas que se especifican a continuación: 1. Las imágenes a subir deben tener la medida mínima exacta en pixeles o proporcón especificadas. Se sugiere usar un tamaño mayor, bajo las mismas proporciones para optimizar la visualización. 7

8 2. Ninguna imagen debe tener un tamaño superior a 200 Kb 3. Ninguna imagen puede utilizar formato gif animado o jpg. únicamente usar formato png. 4. Las imágenes utilizadas en Banner Rotativo, Publicidad, y todas las entradas de Banner Institución deben tener enlace o URL. 5. Los archivos cargados en el sitio deben etiquetarse con nombres descriptivos que los definan. Las palabras no deben poseer mayúsculas o caracteres especiales y deben estar separadas por guiones bajos. Ejemplo: ministerio_educación_ministro_hoja_vida.pdf 6. De ser necesario, únicamente se deben aplicar los estilos y recursos html que se listan en este manual. 7. No se deberá manipular las entradas no especificadas en el contenido de este manual. 8. El administrador de contenidos CMS mantendrá los mismos componentes de la versión 2.0. Sin embargo, las opciones que no constan en este manual están deshabilitadas para la versión

9 2. Ingreso al sistema Para acceder al administrador de contenidos WordPress, ingresar en la barra de dirección del navegador la siguiente URL: o URL: Se despliega la siguiente pantalla: A continuación, digitar el nombre de usuario y contraseña correspondientes y dar clic en Acceder. Pantalla de Acceso al CMS 9

10 3. Barra de herramientas Una vez en el sistema se tendrá acceso al menú de navegación, donde se encuentran las opciones para administración y creación de contenidos. El menú consta de las siguientes secciones: Edición de Contenido - Entradas: Esta sección entradas con las que se cuenta actualmente son: Noticias, Eventos, Audio y Vídeo Programas / Servicios El Ministerio o Secretaría, Valores / Misión / Visión, Objetivos, Ejes Estratégicos, o Secretario Nacional, Hoja de Vida Ministro o Secretario Nacional, Entidades Adscritas, Intranet Medios: Sección que contiene una Galería de Imágenes cargadas en el sitio web. Enlaces: URLs de redes sociales Comentarios: Sección de módulo Disqus, permite valorar los comentarios emitidos por los ciudadanos en las entradas del sitio web Apariencia: Sección que permite administrar los menús: Principal, Servicios y Temas Importantes (Home), La Institución y Programas / Servicios Banner Rotativo imágenes rotativas del banner principal de la página Home Descargas: La sección permite administrar categorías y subir archivos a las secciones que contienen documentos descargables, los cuales son: Transparencia, Boletín de Prensa, Biblioteca y documentos con URL como enlaces en las entradas Banners Lite: La sección permite administrar los banners: Banners Entérate y Banner Central Modificación de ubicación: Permite modificar la dirección y teléfono institucional que se encuentra en el footer. Menú de Navegación 10

11 4. Inicio 4.1 Logo cabecera Debido a las especificaciones del estándar de accesibilidad web W3C el logotipo de la versión 3.0 debe ser cargado como una fuente y no como una imagen. Por este motivo la administración de este elemento no se la controla desde el backend cms, sino que se lo debe configurar desde la carpeta de archivos del sitio web realizando los siguientes pasos: 1. Entrar a la página e ir al botón IcoMoon App 2. Dar click en Import Icons, seleccionar el logo de la institución en formato SVG 3. Seleccionar el logo en la página 4. Luego en la parte inferior dar click en Generate Font, cambiar el nombre de la imagen a logo 11

12 5. Dar click en Preferences en el menú superior y cambiar el Font Name a logo y luego volver a la interface anterior 6. Dar click en Download Font 7. Descomprimir el archivo descargado (logo.zip), abrir el archivo style.css y copiar su contenido 8. Ingresar al directorio del sitio web usando una herramienta ftp, ssh, cpanel o similares. Editar el archivo css que se encuentra en la siguiente ruta: wp-content/themes/sitio-31/css/logo.css y pegar el contenido del archivo style.css copiado anteriormente (corregir la ruta de los archivos para la carpeta fonts) 9. Copiar los archivos logo.eot, logo.svg, logo.tff, logo. woff de la carpeta fonts que se encuentra en la carpeta descargada (logo.zip) a wp-content/theme/sitios-31/ fonts/ 4.2 Dirección footer 1. Ingresar a Administrador de logos 2. En la parte inferior podemos modificar la dirección del footer 12

13 4.3 Imágenes cabeceras La plantilla 3.0 presenta un componente para destaque de imágenes en la cabecera de cada sección. El objetivo es dar al sitio un impacto visual y a la vez promocionar al Ecuador, a través de fotografías. Estas imágenes serán centralizadas desde un módulo externo, sin embargo en el caso de no existir una centralización serán leídas desde cada servidor local. Para asignar cabeceras desde el módulo local se deben seguir los siguientes pasos. 1. Ingresar a Centralización > Imagen Header 2. Para agregar una nueva imagen, Seleccionar archivo, escoger la foto desde el ordenador. La imágen deberá tener una medida mínima de 1800 x 600 px 3. Ingresar el texto de la leyenda con el siguiente formato: Descripción de la imagen, Provincia (ej: Isla Isabela, Galápagos) 4. Seleccionar la plantilla a la que se desea asignar la imagen 5. Dar click en el botón Agregar 6. Se podrá asignar varias imágenes a la misma plantilla. En este caso las cabeceras cambiarán de manera aleatoria. 13

14 4.4 Banner Rotativo Para modificar esta sección se debe: 1. Ingresar a Banner Rotativo 2. Seleccionar imagen que se desea cambiar dando click en el botón Editar Baner 3. Insertar una frase que acompañe a la imagen del banner 4. Ingresar el enlace de la imagen. Ej: 5. Subir una imagen con tamaño mínimo exácto de 620 x 287 px (para una mejor visualización usar un tamaño mayor con las mismas proporciones ej: 800 x 370 px) dando click en el botón Cambiar imagen. Considerar alto del pie del Banner para que la imagen no contenga información importante en este sector. 6. Dar click en el botón Actualizar Acceso al módulo Banner Rotativo Edición de Banner Rotativo 14

15 4.5 Menú Servicios Este menú se encuentra localizado en el Home del sitio debajo del header. El número de elementos que puede tener este menú es infinito, pero se recomienda un máximo de 10. Para modificar este menú se debe: 1. Ingresar a Apariencia > Menús 2. En la pestaña superior Editar Menús, eligir el menú serviciosv30 3. Para configurar la estructura del menú seguir los pasos del apartado 7 15

16 4.6 Menú Enlaces Este menú se encuentra localizado en el Home contiene enlaces a proyectos públicos, empresas públicas y otros. El número de elementos que debe tener este menú es 4. Para modificar esta sección se debe: 1. Ingresar a Apariencia > Menús 2. En la pestaña superior Editar Menús, eligir el menú menu imagenes 1. Abrir Apariencia > Menús 2. En la sección superior Elige el menú que quieras, elegir el menú que se desee editar según corresponda 3. Seleccionar Enlaces personalizados. 4. Añadir la URL de enlace, ejemplo: gob.ec 5. Añadir al Menú 6. Por defecto el nuevo elemento se ubicará al final de la estructura del menú. Es posible reubicarlo arrastrándolo con el mouse. 7. Se pueden editar las configuraciones del nuevo elemento dando click en la flecha que se encuentra al lado derecho del elemento. De entre las opciones que se despliegan se podrá editar las siguientes: Etiqueta de Navegación: para editar el nombre del elemento. Checkbox Abrir enlace en una nueva ventana/ pestaña: activar esta opción se deseamos que el enlace se abra en una nueva pestaña. Menu Image: Imagen/logo gris que se mostrará en el home. Dar click en Set image y seleccionar la imagen del logo. La imagen debe ser formato png con transparencia. 16

17 Image on hover: Imagen/logo a color que se mostrará al pasar con el mouse sobre el logo gris. Dar click en Set image y seleccionar la imagen del logo. La imagen debe ser formato png con transparencia. 8. Guardar Menú 17

18 4.7 Banners Lite Para modificar esta sección se debe: 1. Ingresar a Banners Lite > Banners 2. Para actualizar el banner correspondiente dar click en el botón Edit banner details 3. Subir imagen para Banner Central con tamaño exacto mínimo de 520 x 330 px (para una mejor visualización usar un tamaño mayor con las mismas proporciones ej: 1400 x 660 px) 4. Subir imagen para Banner Entérate 1 con tamaño exacto mínimo de 520 x 330 px (para una mejor visualización usar un tamaño mayor con las mismas proporciones ej: 1400 x 660 px) 5. Subir imagen para Banner Entérate 2 con tamaño exacto mínimo de 520 x 330 px (para una mejor visualización usar un tamaño mayor con las mismas proporciones ej: 1400 x 660 px) 6. Ingresar el enlace de la imagen. Ejemplo: 7. Dar Clic en el botón Submit Datails NOTA: Los videos Tu Gobierno Informa y Banner Entérate serán centralizados por el Gobierno central. Acceso al Módulo Banners Lite 18

19 Manual de uso Módulo Edit banner details Módulo Edit banner details Módulo Edit banner details 19

20 5. Creación y Edición de Contenido 5.1 Creación Para crear nuevo contenido: 1. Ingresar a Entradas > Añadir nueva 2. Introducir Título de la entrada 3. Añadir contenido. La información puede ser levantada de manera visual con el editor de texto o como texto html enriquecido. Para activar estas opciones se debe dar click en la pestaña correspondiente. Se puede colocar imágenes como parte del contenido para lo cual se debe dar click en el botón Añadir objeto, seleccionar la imagen o subirla desde el ordenador y dar click en botón Insertar en la entrada 20

21 4. Asignar la categoría de la entrada dando click en el check box correspondiente del módulo Categorías. Para crear una Noticia Destacada, se deberán activar los check boxes de Noticias y Noticias Destacadas si se desea que este contenido se visualice en módulo Noticias Destacadas de la página Noticias. 5. Se deben llenar los campos frase y hash del módulo Campos Personalizados. Para esto se debe elegir Nombre: frase o hash. En el caso de no existir ninguna de estas opciones se la debe agregar dando click en el enlace Nuevo para luego añadir el campo personalizado. frase: Insertar extracto destacado de la entrada. hash: Ingresar el hashtag de sugerencia para ser compartido en redes sociales 6. Seleccionar imagen desde el módulo Imagen destacada 7. Insertar Título y Leyenda de la imagen destacada 8. Asignar imagen destacada 9. Insertar [[SUBTITULO]] dentro del contenido donde quiera que aparezca la frase destacada. 10. Publicar entrada dando click en el botón Publicar Módulo Categorías Nota: El tamaño de la imagen debe ser px o proporción 16:9 Módulo Noticias Destacadas Módulo para campos personalizados 21

22 Manual de uso Imagen destacada Título entrada Imagen destacada Hash Leyenda Frase Contenido 22

23 Manual de uso Según las necesidades de cada contenido (Entrada), la plantilla puede tener dos alternativas: con imagen destacada y sin imagen destacada. La plantilla se acopla automáticamente si el módulo Imagen destacada tiene o no contenido. A continuación se muestran los dos casos: Entrada con Imagen destacada Entrada sin Imagen destacada Nota: Se puede prescindir de cierta información en las entradas según las necesidades, sin embargo se recomienda que las noticias siempre contengan todos los campos antes mencionados. 23

24 5.2 Edición Para editar contenido se deberá configurar las entradas ya creadas siguiendo las mismas instrucciones descritas en el apartado Edición Hoja de Vida / Directorio Para cargar archivos se debe: 1. Ingresar a Descargas, seleccionar el submenú Añadir Nueva 2. En los campos de Título (requerido) y Descripción escribimos el nombre del archivo tal como se verá en el sitio web 3. Seleccionar el archivo.pdf a subir dando clic en el botón Browse 4. El archivo no debe superar los 8 mb 5. Seleccionar la categoría a la que pertenece el archivo 6. Hacer clic en el botón Subir y guardar al pie de la página 7. Volver a listado de Descargas 8. En el Buscador, buscar el archivo que se acabo de subir 9. Editar descarga y copiar la URL del enlace Para añadir una descarga en un Menú Abrir Apariencia > Menús 1. Elegir el menú que se desea editar 2. Añadir un Enlace personalizado con la URL del archivo que se acabó de subir Para enlazar las descargas a nuevos botones en el Menú Seguir los pasos del apartado 7 24

25 Módulo Añadir una nueva descarga Módulo menú 25

26 5.4 Edición de páginas En la plantilla 3.0 las páginas secundarias: La Institución (La Secretaría o El Ministerio), Transparencia y Biblioteca, contienen campos personalizados que deberán ser configurados de la siguiente manera: 1. Ingresar a Páginas > Todas las páginas 2. Ubicar la página correspondiente y dar click en el enlace Editar 3. La Institución: esta página contiene en el encabezado un destaque con el nombre de la institución y un slogan. Para editar esta información se deben llenar los campos titulo-secretaria y leyenda del módulo Campos Personalizados. Para esto se debe elegir Nombre: titulosecretaria y leyenda. En el caso de no existir ninguna de estas opciones se la debe agregar dando click en el enlace Nuevo para luego añadir el campo personalizado. titulo-secretaria: Insertar el nombre completo de la institución. leyenda: Ingresar una frase alusiva a la labor de la institución. Modulo Campos Personalizados 26

27 titulo-secretaria leyenda Destaque encabezado página La Institución 4. Transparencia y Biblioteca: estas dos páginas contienen una información descriptiva en la columna izquierda del contenido. Para cambiar esta información se debe editar el cuerpo del texto de la página. 5. Dar click en el botón Actualizar Editor de texto para contenido de información descriptiva 27

28 información descriptiva Información descriptiva información descriptiva Información descriptiva 28

29 5.5 Indicadores En la plantilla 3.0 existe la página Indicadores, en esta sección se muestran datos estadísticos generales de la institución, además indicadores centralizados del Ministerio Coordinador al cual pertenece dicha Institución. La información estadística específica ha sido categorizada en dos grupos: noticias estadísticas y dos datos duros. noticias estadísticas indicadores centralizados del Ministerio Coordinador Página Indicadores Indicadores de la Institución La personalización de los datos en indicadores de la Institución se deberá realizar de la siguiente manera: indicadores datos duros 1. Ingresar a Páginas > Todas las páginas 2. Ubicar la página Indicadores y dar click en el enlace Editar 3. Editar el campo de texto siguiendo los siguientes parámetros: nombre de la estadística mes año numeración barra vertical pipe 29

30 5.5.2 Indicadores Centralizados Para ingresar los datos estadísticos centralizados se debe seguir los suientes pasos: 1. Ingresar a Páginas > Todas las páginas 2. Ubicar la página Indicadores y dar click en el enlace Editar 3. Para editar esta información se deben llenar los campos Nombre y valor del módulo Campos Personalizados. Para esto se debe elegir Nombre: coordinador y valor: En el caso de no existir ninguna de estas opciones se la debe agregar dando click en el enlace Nuevo para luego añadir el campo personalizado. 30

31 5.6 Tablas En el caso de que se requiera diagramar datos, es necesario generar una tabla con las siguientes características: <table border= 0 border= 0 cellpadding= 4 > Siempre la primera fila será la unión de todas las celdas, aquí irá el título centrado con letras blancas y el fondo azul. <tr> <td colspan= # align= center bgcolor= #173b6d ><span style= color: #ffffff; ><strong>título de contenido</strong></ span></td> </tr> Cada celda tendrá el color determinado. Hay que insertar el código en cada fila para que se distingan las separaciones. <tr bgcolor= #dddddd > <td></td> </tr> 31

32 6. Descargas 6.1 Añadir / Editar Categorías Para administrar esta información se debe: 1. Ingresar a Descargas, seleccionar el submenú Categorías. Se visualizará un árbol con las categorías y subcategorías correspondientes a los módulos que se muestran en el sitio web. Al final de la página existen dos entradas visuales para añadir o editar las categorías Módulo para añadir o editar categorías 2. Escribir el nombre y elegir la categoría superior. Dar clic en el botón Añadir. En el caso que se trate de una categoría matriz, el campo Superior será por defecto Ninguna 3. Para editar una categoría existente, escribir el nuevo nombre, seleccionar la categoría a ser editada y dar click en el botón Editar 32

33 6.2 Cargar archivos Para cargar archivos se debe: 1. Ingresar a Descargas, seleccionar el submenú Añadir Nueva 2. En los campos de Título (requerido) y Descripción escribimos el nombre del archivo tal como se verá en el sitio web 3. Seleccionar el archivo a subir dando click en el botón Browse 4. Seleccionar la categoría a la que pertenece el archivo 5. Hacer click en el botón Subir y guardar al pie de la página Como un proceso estandarizado del CMS, la carga de archivos se visualiza en orden cronológico; el más antiguo se ubica al inicio y los subsiguientes se cargan al final del listado. Añadir Documento Descargable 33

34 6.3 Cargar archivos con visualización Existen casos en los que un archivo descargable se puede visualizar en el sitio web (ej:hoja de Vida y Directorio) Para este tipo de contenido se debe: 1. Cargar el archivo.pdf, según la explicación previa (ver apartado 6.2 Cargar archivos) 2. Copiar la URL del archivo que se muestra inmediatamente después de cargalo, o ingresar a Descargas, seleccionar el submenú Editar, encontrar el archivo, entrar en él y copiar la URL 3. Ingresar a Edición de Contenidos, seleccionar el submenú Añadir nueva 4. Escribir el título del contenido 5. Pegar la URL del archivo en el campo de texto 6. Seleccionar el checkbox Directorio u Hoja de Vida según corresponda 7. Seleccionar opción Predeterminada en el módulo Seleccionar Single Post Template 8. Dar clic en el botón Publicar del módulo Publicar 34

35 7. Administración de Menús 7.1 Añadir / Editar Menús El sitio web contiene menús en las siguientes secciones: Home (menú Servicios y menú Temas Importantes), Institución (La secretaría o El Ministerio según el caso), y Programas y Servicios. Para editar estos menús se deben seguir los siguientes pasos: 1. Abrir Apariencia > Menús 2. En la sección superior Elige el menú que quieras, elegir el menú que se desee editar según corresponda 3. Los elementos del menú pueden ser añadidos desde la barra laterar izquierda que se presenta en esta interface. Se debe escoger de entre las siguientes opciones según la necesidad: Páginas Entradas: si deseamos que un contenido específico sea parte del menú (Noticia, Información institucional, etc.) Categorías: si deseamos anclar una sección del sitio web como elemento del menú Enlaces personalizados: únicamente para links externos (ej: Es una mala práctica usar un enlace personalizado para agregar un elemento de menú que corresponda a una página, entrada o categoría. Además, esta opción será utilizada para crear un contenedor sin link en las secciones Institución y Programas y Servicios. 4. Añadir al Menú 5. Por defecto el nuevo elemento se ubicará al final de la estructura del menú. Es posible reubicarlo arrastrándolo con el mouse. 6. Se pueden editar las configuraciones del nuevo elemento dando click en la flecha que se encuentra al lado derecho del elemento. De entre las opciones que se despliegan se podrá editar las siguientes: 35

36 Etiqueta de Navegación: para editar el nombre del elemento. En el caso del uso de siglas para el nombre del elemento es obligatorio colocar el atributo <abbr title= Nombre Completo >SIGLAS</abbr> (ej: <abbr title= Banco del Instituto Ecuatoriano de Seguridad Social >BIESS</abbr>) Checkbox Abrir enlace en una nueva ventana/pestaña: activar esta opción se deseamos que el enlace se abra en una nueva pestaña. Icon: esta opción se deberá configurar únicamente para los elementos del menú Servicios de la Home. Para lo cual se debe dar click en el enlace Select para escoger el ícono deseado. 7. Guardar Menú 36

37 8. Módulo Disqus 8.1 Ingreso Para administrar los comentarios emitidos por los ciudadanos en las entradas del sitio web se debe: 1. Dar click en Comentarios > Disqus 2. Ingresar con el nombre de usuario y contraseña entregados por la Secretaria Nacional de la Administración Pública Comentarios / Disqus 37

38 9. Créditos Secretaría Nacional de la Administración Pública Av. 10 de Agosto OE1-14 y Ramírez Dávalos Código Postal: / Quito - Ecuador Teléfono: (593 2) Derechos Reservados Secretaría Nacional de la Administración Pública Edición: Octubre