Documentación en Plantilla Institucional

Web institucional

Conceptos generales

Para acceder a la plataforma, se recuerda que el usuario para acceder debe escribirse de la forma: uclm\usuario.

Asimismo, si se desea acceder desde fuera de la UCLM hace falta conectarse a través de una conexión vpn.

Mostramos a continuación una imagen de la interfaz de trabajo, en ella encontraremos tres herramientas que serán las que más utilicemos:

- Content Editor - Gestión de contenidos web.
- Media Library (Mediateca) - Gestión de documentos e imágenes en la librería de medios.
- Icono en la esquina superior izquierda (icono con 9 cuadrados) - Acceso al panel inicial.

Editor de contenidos

Analicemos el menú de "Content Editor"

Menú de Navegación. Se trata del menú situado en la parte superior. En la edición usaremos “Home” y “Publish”.
Cinta de opciones: La cinta de opciones es contextual a la herramienta de menú de navegación que tengamos seleccionado. Algunos opciones de mayor uso son “Guardar” (Save) o “Publicar” (Publish).
Salir.
Idioma. Por defecto la versión en la que trabajemos será la española, sólo accederemos a cambiar el idioma si deseáramos generar una versión en inglés del contenido que estamos editando.
Árbol de contenidos. Contenido de la web.
Página de contenido: Donde se irá introduciendo la información que contendrá el sitio web.

Árbol de contenidos:

Los usuarios responsables de gestionar un determinado sitio web de la UCLM pueden visualizar el árbol completo de contenidos de la web de la UCLM, sólo podrán editar y modificar la rama del árbol que gestionen.

Home: Estructura real de contenidos de la página web.
Global: Encontraremos elementos a los que se podrá hacer referencia desde distintos puntos de la estructura de contenidos.

Todo item en el árbol de contenidos debe tener un nombre, este nombre se utiliza para la gestión interna del CMS (Content Management System).

Este nombre formará parte de la URL (dirección web específica) del propio elemento.
Se recomienda usar un nombre que identifique el elemento.
No está permitido el uso de espacios en blanco ni caracteres especiales. Se pueden usar guiones en lugar de espacios en blanco.
Se debe evitar el uso de tildes y eñes.

Los atributos de un item

El atributo “Nombre”de un ítem no es lo mismo que el nombre del ítem de CMS. Es importante cumplimentarlo y se recomienda que sea igual o similar al nombre del ítem.

El atributo “Título” tiene un uso directo en Sitecore, aparecerá:

En la descripción de la entrada de menús de navegación en la parte izquierda.
En la miga de pan (rastro de páginas desde la página inicial a la actual),
En la etiqueta sobre la imagen de cabecera.

El atributo "Titulo" sí puede contener caracteres especiales.

Sí puede contener caracteres especiales.

Editando un ítem

Para iniciar la edición de un ítem debemos bloquearlo antes. De esta forma evitamos la edición por parte de otro editor. Para bloquear y editar un elemento pulsaremos sobre el mensaje con fondo amarillo: “Lock and Edit” en la parte superior de la ficha del item.

Cuando salvemos y antes de abandonar la edición podemos desbloquear los elementos que hemos utilizado. Cuando desbloqueemos un elemento otro editor podrá acceder a él si fuera necesario. Para volver a dejar el elemento desbloqueado y a disposición de otros editores de contenido usaremos el comando “My items” del menú “Review”.

Se pueden desbloquear todos los elementos con los que hayamos trabajado con esta opción (Unlock all).

En la sección Elementos de Contenido se explica cómo se pueden ir añadiendo elementos a nuestras páginas web.

Mediateca

La Mediateca (Media Library)

La gestión de los recursos tales como imágenes y documentos se realiza desde la mediateca. Podrás organizar todos estos recursos con una estructura en árbol similar al árbol de contenidos.

Para vídeos es recomendable el uso de plataformas como youtube cuando se quiere una amplia difusión, o bien stream si se quiere que la difusión sea dentro de UCLM.

Cargar ficheros (documentos o imágenes) en Media Library:

Para subir un fichero, pulsaremos el botón derecho sobre la carpeta elegida “Insert” >“Upload file”. Podrás subir varios ficheros a la vez con la opción "Upload files"

La opción "New Folder" sirve para crear nuevas carpetas.

Las imágenes deberán ajustarse a los estándares establecidos. Véase tabla de resoluciones.

Eliminar ficheros:

Es importante conocer el proceso de eliminación de los elementos de la librería de medios porque si seguimos unos pasos muy sencillos nos puede resultar muy práctico, no sólo eliminar una imagen o PDF, por ejemplo, sino sustituir los enlaces que haya en la web por otros elementos que vayan a permanecer en la librería.

Al eliminar una imagen que tenemos en la librería de medios con botón derecho - Delete, Sitecore nos informa sobre las 3 posibles opciones entre las que tenemos que elegir:

Remove links - Eliminar los enlaces a la imagen.
Link to another item - Enlazar con otro ítem, para sustituir ese enlace por otro. Realiza la sustitución de las referencias que queden rotas.
Leave Links - the links will appear in the Broken Links report - Dejar los enlaces, que aparecerán en el Informe de Enlaces Rotos.

Si vamos a realizar una sustitución general pulsamos sobre “Continue”, si no, tendremos que editar de forma individual los links que queramos particularizar usando el botón “Edit Links”.

Metadatos

El término metadatos podríamos definirlo como datos que describen otros datos. Los metadatos ayudan a buscar y ubicar datos. En cuanto a lo que nos ocupa, se trata de aquella información que incorporamos en nuestra página web para que los motores de búsqueda puedan incluirla en sus resultados. Los metadatos no forman parte estrictamente de la información que se muestra al usuario en el navegador cuando está viendo la página.

Los Items de Sitecore, páginas publicables, incluyen el apartado llamado Metadata, los campos más relevantesde esta sección son:

Etiqueta de título (<title>): Es importante que todas las páginas cuenten con título y que éste sea único.
Meta description: Información que resume la información de la página. Es opcional pero recomendable en la mayoría de los casos. También debe ser única.

Por defecto, cuando se crea una nueva página, el campo <Title> en la sección de los Metadata se rellena automáticamente con el atributo nombre de la página.

Título (Title)

Los títulos de las páginas son útiles en mejorar el ranking de los resultados que muestren de los motores de búsqueda y deben de animar al usuario a pulsar sobre nuestro enlace.

Algunas recomendaciones para mejorarlos:

Deben de estar formados por hasta 12 palabras y tener un máximo de 64 caracteres incluyendo espacios.
Las palabras más significativas deben estar al comienzo del título. Las primeras 7 u 8 palabras son las que realmente se cuentan como título, el resto se considera contenido normal de la página.
Tratar de usar barras verticales para separar frases y evitar guiones, asteriscos y subrayados.
Las frases importantes deben ser cortas y sencillas.
No es suficiente un buen título de página para mantener bien situada una página con poco contenido o intrancendente.

Descripción (description):

Al igual que el título influye en las visitas ya que también forma parte de la información que se muestra en las páginas de los resultados de búsqueda de los motores de búsqueda como Google. También las redes sociales usan esta información al compartir páginas.

Los aspectos clave para redactar descripciones eficaces:

Ponerse en el lugar del visitante, deben dar a entender que se conoce su problema y se tiene la solución. Es importante que estén orientadas a emociones.
Deben estar alineados con el mensaje institucional y la información de otros medios.
Deben “sonar” bien y encajar con el tono de la institución.
No debe usarse como una lista de palabras clave ya que los buscadores lo identifican como spam y pueden penalizarla.
Debe encajar en 156 caracteres que es el espacio que dejan los buscadores para incorporar la descripción en sus páginas de resultados.

Ejemplos de buenas descripciones:

Ejemplos de malas descripciones:

Errores comunes en los metadatos:

No crear título para una página.
Repetir palabras a modo de spam. Los motores de búsqueda penalizan esta estrategia.
Redactar títulos muy largos. Los óptimos son entre 50 y 60 caracteres.
Escribir el nombre de la organización en todas las páginas.
Mantener nombres que no estén vinculados al contenido.

Posicionamiento

Claves para mejorar el posicionamiento en buscadores:

Consistencia de la información:

Aunque pueda parecer trivial, el contenido de la web debe contener palabras clave relevantes para hacer atractivo el contenido de nuestros potenciales visitantes. Es conveniente usar las mismas palabras para los mismos conceptos y que éstas tengan una carga de contenido especialmente reconocible para nuestros clientes.

Los robots de los buscadores analizan la consistencia entre los títulos y los contenidos con lo que este concepto debe estar presente de manera constante en la confección de la información.

No es conveniente incorporar todas las palabras clave como contenido de un elemento. Este tipo de iniciativas son detectadas como “poco naturales” y pueden conllevar que la página no sea indexada por los buscadores.

Una buena estrategia es colocar alguna o algunas palabras clave en el primer párrafo. Además los robots también prestan especial atención a palabras escritas en negrita o itálica. Si incorporamos palabras claves destacadas pueden tener un efecto positivo en el posicionamiento.

Para mejorar la experiencia de usuario es conveniente que las páginas traten con un tema claro y único que pueda suscitar el interés de quien realmente lo tiene. Si se incluyen varios temas en la misma página corremos el riesgo de que muchos usuarios no la encuentren relevante.

Los buscadores valoran aquellas páginas que se actualizan de manera frecuente.

Los Metadatos:

Es importante cumplimentarlos debidamente, puedes consultar la sección de metadatos.

Las URL:

Las URL tienen su importancia y en Sitecore se conforman básicamente con los nombres de los ítem.

Es importante que no contengan caracteres especiales para que la lectura sea más agradable y más fácil de recordar. Es conveniente que no contengan espacios en blanco.

Estructura:

Es recomendable mantener una estructura lo más plana posible. Cuantos más niveles tenga nuestra estructura, más difícil es para los buscadores encontrar el contenido relevante. Nuestros clientes o potenciales clientes deben poder llegar a la información con el menor número de clics posibles.

Es un valor positivo que el contenido dentro nuestras páginas sea propio.

Enlaces Internos y Externos

Una de las cuestiones más valoradas por los buscadores son los enlaces que se hagan desde fuera a nuestro sitio web. Se valoran los enlaces a la página principal pero se incrementa mucho la valoración si además hay enlaces internos (Deep linking). Se debe crear una serie de enlaces internos a unas cuantas páginas clave que nos interese mantener mejor posicionadas. En esta línea se deben evitar textos en los enlaces del tipo “haga click aquí” y usar palabras clave en el texto del enlace.

Publicación

Publicar contenido en Sitecore

Para salvar los cambios que realicemos en nuestros items utilizaremos el comando “Save” de la cinta de opciones en el menú “Home”. Cuando nos situamos en otro punto del árbol de contenidos sin haber guardado previamente , el sistema nos consultará si deseamos almacenar los cambios. Con el fin que estos cambios se reflejen en nuestra web debemos además publicarlos, pulsaremos “Publicar” (Publish) en el menú “Publish”.

Otras opciones de publicación:

Podemos marcar un ítem como “no publicables” para ello debemos eliminar la marca de la casilla "Publishable". Teniendo el ítem seleccionado > “Publish”>Change”.

Se puede incorporar un rango de fechas entre las cuales un ítem se va a publicar.

Si el elemento que dejamos de publicar es un elemento intermedio, todos los ítems que dependan de él también dejan de publicarse. Cuando se requiera volver a publicar se debe usar “Publicar site” y no “Publicar ítem” para que vuelvan a aparecer todos los ítems dependientes.

Si nuestra página ya está lista para publicar, pero todavía no queremos que sea accesible por motores de búsqueda como Google, marcaremos al final de la misma como "no profundizable" y "no indexable".

Los siguientes elementos de contenido: "Calendarios internos a Sitecore", "Parrilla de novedades" o "Parrilla de destacados", como, en ocasiones, en necesario publicar en tres sitios diferentes, es conveniente hacerlo en orden:

Accesibilidad

A continuación, se detallan diferentes medidas que se deben tener en cuenta para mejorar la Usabilidad/Accesibilidad (facilidad de uso y acceso):

(La web de la UCLM debe cumplir con el Real Decreto 1112/2018 de 7 de septiembre sobre accesibilidad de los sitios web y aplicaciones para dispositivos móviles del sector público).

Texto alternativo de las imágenes (campo Alt) obligatorio:
Cualquier imagen con la que se trabaje en el gestor de contenidos, desde que se suben a media library, debe tener cumplimentado el campo “Alt”: siendo este campo una descripción del contenido de la imagen. Es lo que un invidente escucharía a través de su lector de pantalla y que un navegador genérico no visualiza.

Ejemplo: Niño juega con una raqueta.

El campo texto alternativo tiene una longitud máxima de 150 caracteres; si el texto fuese mayor se seguiría escribiendo en el campo Longdesc.

Si una imagen contiene un texto. El campo alt deberá contener todo ese texto.

Si la imagen sirve de enlace (link) a otro contenido, el texto alternativo debe informar al lector sobre el destino de la imagen.

Ejemplo: Ir a juego de niños.
Utilizar una herramienta para limpiar código html (Como Notepad):
Si en “show editor” se va a pegar un contenido de una página web, previamente se debe usar una herramienta para limpiar ese código html.

Una sencilla herramienta de limpieza de código html es simplemente usar el blog de notas (Notepad) como paso intermedio en el proceso de copia y pega de ese contenido.

Esto evitará, por ejemplo: incongruencias en los encabezados, encabezados vacíos, etiquetas <br>. Todo ello dificultaría en gran medida la accesibilidad.
Texto descriptivo de los enlaces:

Todo enlace debe tener un texto descriptivo de dónde se va a enlazar. Deben evitarse los textos no descriptivos como: “pinche aquí”, “haga clic aquí”, o similares.

No se debe poner la URL como texto del enlace.

El texto del enlace no debe ocupar más de 150 caracteres.

No se deben repetir enlaces en la misma página. Provocan que el lector oiga una y otra vez el mismo enlace y el usuario abandone aburrido esa página.

Si el enlace se abre en una ventana independiente del navegador hay que advertirlo al usuario en el texto del enlace. De lo contrario el usuario puede desorientarse.
Por último, se recuerda que se debe evitar escribir texto con las url (direcciones web) completas. La forma recomendable es escribir un texto y a este asociarle el hipervínculo correspondiente (con los botones al efecto de "Show Editor").
Uso del color:
No se debe usar el color para transmitir información.

Es obvio que no se debe usar contenido que pueda desencadenar un ataque epiléptico. Según la literatura científica, la epilepsia fotosensible (que afecta entre un 3 y un 5% de las personas con esta condición neurológica) se origina principalmente con luces intermitente rojas, pero también se puede desencadenar con ciertas imágenes fijas. Más información sobre este problema si abre este enlace.
Resoluciones de imágenes:
Como norma general las imágenes utilizadas deben tener unas dimensiones proporcionales de 16x9 no obstante sugerir que revisen las dimensiones descritas en la tabla Resumen de Resoluciones.

Para una correcta visualización en dispositivos móviles, cuando se inserta una imagen no se deben especificar sus dimensiones en pixeles (px), sino en porcentajes (%). El ancho (width) de la imagen nunca debe ser mayor que 100% y el alto (length) se cambiará automáticamente.

Se debe priorizar el uso del tipo de archivo jpg, evitando el uso de imágenes png.
Recomendaciones para Tablas:
Para una mayor homogeneidad de la web se debe usar el tipo de tabla “uclmtable”.

Se hace de la siguiente forma: En "Show Editor" en la barra con todos los botones hay un botón representado por un icono con forma de tabla llamado "Insert table". Se debe usar el asistente en la opción "Table wizard". En la pestaña “Table properties” recomendamos seleccionar en la parte derecha en el desplegable de "CSS Class Layout" la opción de “uclmtable” para homogeneizar los estilos de todas las tablas que aparezcan en la web.

Si se trabaja en HTML la anchura (width) no debe especificarse en píxeles, a lo sumo en porcentajes, para que la tabla se pueda visualizar mejor, principalmente en dispositivos móviles.
Archivos en nuestra web:
Los archivos ofimáticos deberán ser accesibles, debiendo seguir las mismas pautas que se detallan en esta página.

En el siguiente enlace viene descrito cómo hacer accesibles documentos de Word.

Los documentos pdf, si se crearon originalmente con Word, se puede hacer accesibles siguiendo ese método.

Además, los documentos pdf se pueden hacer accesibles siguiendo este documento sobre accesibilidad. (Solo en Adobe Acrobat Pro).

En estos dos documentos anteriormente citados, entre otras cosas, se explica que tanto Adobe Acrobat Pro como Microsoft Word tienen un botón para comprobar la accesibilidad de un documento.
Vídeos en nuestra web:
No deben iniciarse solos (deben ir sin autodisplay), pues el usuario que se guie por lo que el lector le dicta oirá primero la música y no sabrá cómo pararla.

Además, los vídeos se deben subtitular:

Se puede encontrar más información de cómo subtitular un vídeo en "Guía sobre como subtitular vídeos".

Con Windows Media Player también se pueden subtitular los vídeos.

Si desea conocer información sobre como hacer accesible nuestros videos, pulse accesibilidad en Redes Sociales.
Guía de accesibilidad en Sedes Electrónicas.
Guía de ayuda para gestionar la accesibilidad de los trámites electrónicos en las Sedes Electrónicas de las Administraciones Públicas.

Información suplementaria más avanzada:

Utilizar correctamente los encabezados. Desde H1 hasta H6. No se deben generar saltos (pasando por ejemplo de H2 a H4. Y no poner encabezados vacíos).
- H1 – título del libro (es el título de la página). No se deben poner más.
- H2 – Capítulo del libro
- H3 – Sección de un capítulo
- H4 – subsección de una sección
- H5 – Apartado de una subsección
- H6 – División de un apartado
Mantener la estructura de párrafos. Usar etiquetas <p> y </p>. Evitar la etiqueta <br> ya que inhabilita al lector de pantalla la posibilidad de reconocer el párrafo.
Los marcos (iframes) siempre deben llevar un título (title). En caso contrario el lector de pantalla no podrá describir su contenido.
Los textos tampoco deberían tener textos menores de 16 puntos (16px).
Herramienta de validación web: Hay extensiones para los navegadores Chrome y Firefox de Wave Evaluation Tool.

Los elementos de contenido pueden ser:

Diferentes elementos que se pueden insertar

Un ejemplo de "Página Publicable" se puede ver en el menú de la izquierda.

Cuando se inserta un "Enlace Externo" éste pasa a formar parte de la estructura y se inserta en el menú de la izquierda. En enlace puede apuntar a otra página dentro de sitecore, a un elemento de la mediateca de Sitecore o a una web externa. Además, se puede apuntar a una dirección de correo electrónico, o insertar un elemento de Javascript.

Esto es un ejemplo de un Bloque de texto de una columna

Este bloque de contenido se corresponde con un bloque de texto a una columna dentro de la página publicable de la que dependa. El atributo Título aparece como encabezado del bloque de contenido seguido del Contenido principal.

Esto es un ejemplo de un Bloque de texto a dos columnas

Similar al anterior pero el contenido que se añade está dividido en dos columnas de texto.

El texto queda dividido en dos mitades del mismo ancho y longitud de forma automática, salvo en el caso que el número de renglones resultantes sea impar por lo cual la columna derecha tendrá un renglón más.

Si se quisiera que las dos columnas se especificasen de manera estática, es decir, que la información de una columna nunca pasara a la segunda y viceversa se debería hacer con el complemento Contenido HTML a dos columnas. Con este otro complemento evitamos, por ejemplo, que haya texto de encabezado al final de la primera columna y el contenido empiece en la segunda.

Esto es un ejemplo de un Bloque de texto con Imagen Flotante

Este complemento permitirá incorporar un texto con una imagen relacionada.

La imagen se mostrará en la esquina superior derecha.

Aquí se muestra un ejemplo:

Contenido HTML y Dos columnas HTML

Con estos bloques de contenidos podemos incorporar código HTML (a una columna o dos) de manera libre por si los complementos de contenido no nos dan la suficiente flexibilidad para visualizar el contenido que queremos incorporar.

No obstante, una virtud de este gestor de contenidos es el poder prescindir de conocimientos HTML. En base a ello y debido al hecho que el uso de código HTML podría desembocar en una falta de heterogeneidad del sitio web se desaconseja el uso de estos dos complementos.

Únicamente se recomienda su uso en el caso de que se quieran tener 2 columnas de distinta longitud para que un encabezado no quede al final de una columna.

Cuando se necesite insertar un complemento HTML, como son los widget, no es necesario utilizar este elemento, basta con insertar un bloque de texto normal, editarlo con el botón "Show Editor" y seleccionando la pestaña HTML (situada en la esquina inferior izquierda) insertar el código HTML necesario.

Un ejemplo de Widget muy útil que se puede añadir es el de la web de Eventos de la uclm, como por ejemplo uno personalizado para la Facultad de Letras de Ciudad Real.

Eventos de la Facultad de Letras de Ciudad Real

Calendario Público

Se puede insertar un calendario de dos formas posibles:

Como una dirección embebida, por medio de una URL que nos proporcionasen, para insertar un calendario público externo (al Gestor de Contenidos).

Por ejemplo, puede ser un calendario de office365. Para ello en el campo URLembebida se copiaría la dirección que nos facilitasen:

Y quedaría así:
Seleccionando un calendario público interno (al Gestor de Contenidos) de los disponibles por un determinado promotor.

Ejemplo de Calendario interno (a Sitecore): Calendario de Transparencia

Antes

Después

Otro ejemplo de Calendario Interno (Ver mes de marzo de 2022):

Antes

Después

Grupo de Enlaces y enlaces individuales o múltiples

En realidad, se trata de tres componentes distintos:

Grupo de enlaces: Es el componente más simple de los tres y se va a comportar como la cabecera de los enlaces individuales o múltiples que creemos dentro
Enlace individual: Consta de una descripción y una URL destino.
Enlace múltiple: Consta de una descripción y hasta cuatro URL destino que, en caso de que se indique, en el campo "Identificador", una extensión de fichero conocida esta se sustituye por el icono correspondiente.

Es muy importante fijarse en que hay distintos comandos en rojo para incorporar los distintos tipos de destino. Los más habituales serán:

Insert link: Para ir a otro punto de la estructura de www.uclm.es
Insert media link: Para enlazar con un elemento de la mediateca
Insert external link: Para enlazar con una página externa

Ejemplo de Grupo De Enlaces

Este es un enlace individual a la RAE
Estos son enlaces Múltiples NASA. Biblioteca Virtual Miguel de Cervantes. Centro de Estudios de Castilla La Manha.

Grupo De Pestañas y pestaña de contenido

En este complemento configuramos distintos apartados de texto en pestañas. De la misma manera que en el grupo de enlaces, en este caso también tenemos básicamente Nombre y Título en el grupo de pestañas y el detalle de contenido de cada pestaña en “Pestaña contenido”.

Con este componente tenemos la opción de analizarlo en la web como si fuera un componente tipo acordeón. En este sentido simplemente hay que marcar la casilla “comportamiento acordeón”.

Con este control activado provocamos que las pestañas de contenido se conviertan en bloques de texto con posibilidad de expandir o contraer clicando en las flechas de la parte derecha. Cada vez que pulsamos en un bloque de contenido distinto se colapsa el bloque estuviera desplegado y se despliega el bloque pulsado.

Para hacer referencia a otra pestaña desde el contenido de una de ellas tendremos que incorporar el siguiente texto en html en el editor correspondiente:

<a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-itemgrupopestañas" href="#itempestaña" aria-expanded="false">texto-enlace</a>

Donde

-nombre-item es el nombre del ítem en el árbol de contenidos de sitecore correspondiente al destino del enlace.
Texto-enlace es el texto que en la pestaña de origen va a referenciar al ítem destino correspondiente.

Grupo de Pestañas sin acordeón

Este es el contenido principal de la primera pestaña.

Este es el contenido principal de la segunda pestaña.

Este es el contenido principal de la tercera pestaña.

Grupo de Pestañas con acordeón

Pestaña 1

Este es el contenido de la pestaña 1.

Pestaña 2

Este es el contenido de la pestaña 2.

Pestaña 3

Este es el contenido de la pestaña 3.

Desde aquí se puede enlazar a la pestaña 2.

Enlaces visuales 3x3

Con este complemento podremos incorporar una serie de hasta 9 enlaces con formato imagen que se comportan de manera responsiva. El atributo del título es el que se incorpora en la parte superior en la banda roja, si no hubiera título, la banda roja tampoco aparece.

La información necesaria para configurar cada uno de los enlaces sería:

Imagen de referencia.
Texto que aparece en la parte inferior de la imagen.
URL de destino de la imagen.

La última versión de este componente también incorpora la posibilidad de incluir un icono del tipo de letra “Awesome”. Es una fuente estándar que mantiene actualizados iconos de referencia a nivel mundial. Utilizar estas referencias gráficas nos asegura que si cambia, por ejemplo, el icono de Facebook, cualquier componente en el que hayamos incorporado la letra en lugar de la imagen se mantendrá actualizado de forma automática.

En el campo FAIcono se debe escribir "fa-" seguido del icono que queramos de los vistos en la web citada, por ejemplo: fa-home si se quiere poner el icono de una casa.

Si incorporamos iconos, la estética cambia; el icono aparece en el centro, la banda gris desaparece y el texto cambia de posición y de fuente.

Ejemplo de Enlaces Visuales 3x3 - Resumiendo los Elementos de Contenido

Grupos de Enlaces y de Pestañas

Grupo de Enlaces Visuales 3x3

Elementos de G. Investigación y Asignaturas/Plan de Estudios

Parrillas de Novedades y de Convocatorias

Galerías

Ejemplo de Enlaces Visuales 3x3 con Iconos FA - Resumen de Sitecore

Interfaz

Elementos de contenido

Metadatos

Mediateca

Versiones e idiomas

Posicionamiento en buscadores

Elemento de contenido: Grupo de Investigación (Ya en desuso)

Cuando se agrega un contenido de este tipo sólo es necesario indicar el código del grupo de investigación que queremos añadir.

Este elemento ya está en desuso, a favor del componente Página de Grupo de Investigación.

Aquí vemos un ejemplo:

Ejemplo de Grupo de Investigación (Elemento en desuso)

Acrónimo: SMILE
Año de formación: 2005
Dirección: PASEO DE LA UNIVERSIDAD 4
Teléfono: 96605
Fax: 926295354
Email de contacto: JOSEANGEL.OLIVAS@UCLM.ES
Página web: http://smile.esi.uclm.es/
Campus: CIUDAD REAL

Personal

Nombre: José Ángel Olivas Varela
PROFESOR/A TITULAR DE UNIVERSIDAD

Nombre: Francisco Pascual Romero Chicharro
PROFESOR/A TITULAR DE UNIVERSIDAD

Nombre: Jesús Serrano Guerrero
PROFESOR/A TITULAR DE UNIVERSIDAD

Nombre: Arturo Peralta Martín-Palomino
PROFESOR/A ASOCIADO/A

Nombre: Rubén Rodríguez Cardos
PROFESOR/A ASOCIADO/A

Nombre: Bashar Alshouha -
DOCTORANDO (2022-23)

Nombre: Mo'tsem Al-Taamneh Adnan
DOCTORANDO (2022-23)

Nombre: Daniel Carrasco Pardo
DOCTORANDO (2022-23)

Nombre: Mohammad Fakhri Bani Doumi
DOCTORANDO (2022-23)

Nombre: Jared David Tadeo Guerrero Sosa
Alumno doctorado

Nombre: Andres Montoro Montarroso
DOCTORANDO (2022-23)

Nombre: Eduardo Sánchez López
DOCTORANDO (2022-23)

Nombre: Antonio Lorenzo Sánchez
Coordinador del Departamento de Business Intelligence

Nombre: Javier, de la Mata Mora
JEFE DE SERVICIO DE ADMINISTRACIÓN DIGITAL

Mas información

Elemento de contenido: Página de Grupo de Investigación

Actualización del elemento anterior. Solo es necesario indicar el código del grupo de investigación que queremos añadir para que en esta página se muestre la información proviniente del Portal de Investigación..

El ejemplo pasa a insertarse en el menú de la izquierda.

Elemento de contenido: Asignaturas de Plan de Estudios

En este complemento con solo insertar el código de un plan de estudios y el curso académico que se requiera, se visualizan todas las asignaturas de ese plan de estudios de ese curso académico.

Ejemplo de Asignaturas de Plan de Estudios 407 del curso 2021-2022 - Plan de estudios de Informática (407)

Sin información acerca del plan de estudios.

Elemento de contenido: Plan de Centro

En este complemento se debe seleccionar un plan de estudios de un determinado centro. Se insertará una página web en el menú de la izquierda con toda la información de ese plan de estudios. Se podrán hacer más visibles algunos "botones" de esa página web con sólo marcar las casillas de verificación correspondientes.

En el menú de la izquierda se puede ver un ejemplo de un Plan de un Centro. En este caso, el grado de Ingeniería Mecánica de Ciudad Real.

Elemento de contenido: Parrilla de Destacados (Para las Novedades)

Con este complemento conseguiremos incorporar noticias o elementos destacados dentro de nuestro entorno de gestión de contenidos web.

Se trata de una aproximación similar a la de Actualidad que gestiona el gabinete del Rector para la página principal.

Para publicar las novedades se necesitan dos componentes:

Novedad: Cada novedad se publica en un único punto fuera de la estructura de la web (home), en la rama Promotores (La ruta sería: /Content/Global/Promotores). En cada promotor habrá una carpeta denominada “Novedades” donde se irán incorporando una a una.
Parrilla de destacados: Es un complemento de agrupación que habrá que colocarlo en la estructura de la web (Content/Home) que corresponda con el punto donde se quieran publicar esas novedades. Al insertar la parrilla de destacados habrá que seleccionar la carpeta de novedades, o las novedades específicas del promotor creadas anteriormente.

De manera similar al resto de la estructura web, cada usuario tendrá permiso de escritura en la carpeta de novedades correspondiente a su promotor. El acceso al resto de novedades será en modo lectura únicamente; por esta razón la configuración de la parrilla de destacados se puede realizar mezclando los conceptos de promotor y novedad individual de otro promotor.

Los atributos específicos de las Novedades serían:

En el ítem "Base Detalles" los atributos: Nombre y Título.
En el ítem "Contenido Detalles" los atributos: Entradilla, Imagen Principal y Contenido Principal.
En el ítem "Noticia Detalles" los atributos: Fecha y Antetítulo.
Actualmente el atributo activo no se está tomando en consideración. Por defecto están todas las novedades activas.

En la publicación vemos cómo se corresponden los atributos, tanto en modo resumen como en el detalle de cada una de las novedades una vez que pulsamos.

En modo resumen, aparecen por orden: Título, antetítulo y fecha.

En modo extenso, aparece por orden: Imagen principal, a la derecha de la imagen el antetítulo, título y fecha. Por debajo de la imagen veremos la entradilla y el contenido principal.

Si se marca la casilla de verificación llamada ModoSlider: los destacados pasan a verse en modo carrusel (los destacados van cambiando de forma automática en un mismo marco), en lugar de modo secuencial (un destacado detrás de otro)

No hay que olvidarse que tanto en la ruta home, como en global-promotores hay que dar al botón "Save" y "Publish Item".

Ejemplo de Parrilla De Destacados para Novedades

Plaza del Mercado - Foto antigua del Cen

Este es el título de la Noticia 1

Este es el antetítulo de la Noticia 1

06/03/2018

Este el el Título de la Noticia 2

Este es el antetítulo de la Noticia 2

06/03/2018

Ejemplo de Parrilla De Destacados para Novedades en modo Carrusel

Plaza del Mercado - Foto antigua del Centro de Estudios de Castilla La Mancha

Este es el título de la Noticia 1

Este es el antetítulo de la Noticia 1

Este el el Título de la Noticia 2

Este es el antetítulo de la Noticia 2

Elemento de contenido: Parrilla de Destacados (Para las Convocatorias)

La parrilla de destacados que se usa para las novedades también se usa para las convocatorias.

Hay dos diferencias básicas entre las convocatorias y las novedades:

Por la naturaleza de ambas, se deben rellenar campos de datos diferentes. Asimismo, las novedades se crean en carpetas de novedades y las convocatorias se crean en carpetas de convocatorias.
Toda convocatoria que se publique en el gestor de contenidos automáticamente se podrá ver en la web de las convocatorias. Por ello no es conveniente publicar ninguna convocatoria de prueba, ya que automáticamente se vería en dicha web.

En la ruta de la web institucional donde se quieran visualizar las convocatorias:

Con el botón derecho - Insert - Item ParrillaDeDestacados.

Rellenar los campos que sean necesarios:

     - Destacados Seleccionados (Para seleccionar convocatorias específicas)

   - Carpetas De Destacados (Es la opción más recomendable. Se mostrarán todas las convocatorias que estén en una carpeta determinada).

   - Promotores (Se mostrarán todas las convocatorias del promotor que se seleccione).

Si hay que crear una convocatoria se debe hacer en:

"Global - Promotores".

En el Promotor correspondiente, se ha de crear (con el botón derecho e Insert) de no estarlo, una carpeta de Convocatorias.

Dentro de la carpeta de Convocatorias - Con el botón derecho - Se pueden ir creando convocatorias (con la opción Insert - Item convocatoria).

Cuando se inserta una convocatoria:

- Se le da un nombre, un título, se le puede poner una entradilla, una imagen, un texto en contenido principal.

- No hay que cumplimentar: Items Relacionados, Adjuntos y Formulario relacionados.

En "Detalle convocatoria" cumplimentar:

- Antetítulo

- El o los promotores.

- El Tipo de la convocatoria (Becas, Convocatorias y Premios y Concursos)

- El o los colectivos a quien va dirigida la convocatoria (Estudiantes, PDI, PAS, Titulados u Otros).

- Fechas inicio y fin de solicitudes y fecha resolución.

- Seleccionar de la mediateca: La carpeta con los archivos Base

La carpeta con los archivos Anexos

La carpeta con los archivos resolución

Los tipos de archivos de estas carpetas pueden ser de los tipos: PDF, DOC, DOCX, XLS, XLSX, PPT, PPTX, CSV, ODT, ODS y TXT.

No hay que olvidarse de tanto en la ruta home, como en media library como en global-promotores de dar al botón "Save" y "Publish Item".

Ejemplo de Parrilla de Destacados para las Convocatorias

Becas-colaboración en servicios de la Universidad de Castilla-La Mancha. 2025

Tipo de convocatoria: Convocatoria

Colectivo de destino: Estudiante

Fecha de inicio: 03/10/2024

Ayudas para estudiantes de la UCLM en situaciones especiales. Curso 2024-2025

Tipo de convocatoria: Convocatoria

Colectivo de destino: Estudiante

Fecha de inicio: 18/09/2024

Convocatoria de ayudas Santander movilidad nacional SICUE 2024-2025

Tipo de convocatoria: Beca

Colectivo de destino: Estudiante

Fecha de inicio: 17/09/2024

Becas Santander / Ayuda Económica. Curso 2024/2025

Tipo de convocatoria: Beca

Colectivo de destino: Estudiante

Fecha de inicio: 30/04/2024

Becas-colaboración en Servicios de la Universidad de Castilla-La Mancha. 2024

Tipo de convocatoria: Convocatoria

Colectivo de destino: Estudiante

Fecha de inicio: 04/10/2023

Ayudas para estudiantes de la UCLM en situaciones especiales. Curso 2023-2024

Tipo de convocatoria: Beca

Colectivo de destino: Estudiante

Fecha de inicio: 18/09/2023

Convocatoria de ayudas para la organización de Olimpiadas. Curso 2023-2024

Tipo de convocatoria: Convocatoria

Colectivo de destino: PDI

Fecha de inicio: 17/11/2023

Convocatoria de Ayudas para estudiantes de la Universidad de Castilla-La Mancha en situaciones especiales. Curso 2022/23

Tipo de convocatoria: Beca

Colectivo de destino: Estudiante

Fecha de inicio: 07/09/2022

Convocatoria de ayudas para la organizacion de olimpiadas 2024- 2025

Colectivo de destino: PDI

Fecha de inicio: 18/11/2024

Elemento de contenido: Galería de Elementos

Se muestran, de manera reducida, una colección de elementos (documentos o imágenes) correspondientes a una determinada carpeta de la mediateca.

En el campo "Carpeta" se debe seleccionar una carpeta de la media library.
En "TipoArchivos" se debe elegir el tipo de archivos entre: "documentos" o "imágenes".

Los formatos soportados para imágenes son: JPG, JPEG, GIF y TIFF y para documentos: PDF, DOC y DOCX.

Ejemplo - Galería de Elementos - Imágenes - Fotos de salas de videconferencia de Ciudad Real

Sala-JuanBautistaDeAvalleArce-Aulario-CR

Ejemplo - Galería de Elementos - Documentos - Pdf

Elemento Usuarios de Directorio

Con este elemento se pueden visualizar los datos, que figuran en el directorio de la UCLM, de los usuarios que se especifiquen.

Los usuarios se deben introducir separados por comas.

La foto de un usuario solo se muestra si ese usuario dio permiso en la Gestión de Credenciales. Si se modifican esos permisos, esos cambios no tienen efecto hasta el día siguiente.

La opción "Mostrar en listado", en la que se muestra la información de los usuarios en modo lista sin incluir la foto no está disponible en esta plantilla original. Solo está disponible en la plantilla Academics.

Ejemplo de Elemento "UsuariosDirectorio"

ANDRÉS JAVIER PRADO DOMÍNGUEZ

andres.prado@uclm.es

Ext.: 926051966

DIRECCIÓN - DIRECTOR DE ÁREA

TECNOLOGÍA Y COMUNICACIONES - RECTORADO DE LA U.C.L.M.

SOLEDAD ENCARNACIÓN MOYA MONTERO

encarnacion.moya@uclm.es

Ext.: 967599232

GESTIÓN TECNOLOGÍA Y COMUNIC. CAMPUS AB - SUBDIRECTOR

TECNOLOGÍA Y COMUNICACIONES - VICERRECTORADO DE ALBACETE

JOSÉ ANTONIO IGLESIAS DONAIRE

joseantonio.iglesias@uclm.es

Ext.: 926052332

GESTIÓN DE SERVICIOS - DIRECTOR EJECUTIVO

TECNOLOGÍA Y COMUNICACIONES - RECTORADO DE LA U.C.L.M.

JOSÉ FERNANDO LÓPEZ PASTOR

fernando.lpastor@uclm.es

Ext.: 926053792

GESTIÓN TECNOLOGÍA Y COMUNIC. CAMPUS CU - SUBDIRECTOR

TECNOLOGÍA Y COMUNICACIONES - VICERRECTORADO DE CUENCA

JESÚS LAVÍN LÓPEZ

jesus.lavin@uclm.es

Ext.: 926051599

GESTIÓN TECNOLOGÍA Y COMUNIC. CAMPUS TO - SUBDIRECTOR

TECNOLOGÍA Y COMUNICACIONES - VICERRECTORADO DE TOLEDO

MANUEL PALENCIA MERINO

manuel.merino@uclm.es

Ext.: 926295230

GESTIÓN TECNOLOGÍA Y COMUNIC. CAMPUS CR - SUBDIRECTOR

TECNOLOGÍA Y COMUNICACIONES - SERVICIOS GENERALES CIUDAD REAL

Editor De Textos en los ítem de Sitecore

Los atributos de los ítems en Sitecore pueden ser de muchos tipos. Uno de los atributos más comunes es el de “contenido principal”. Este atributo es el contenedor de la información más descriptiva del ítem. En los ítems de tipo páginas publicables incorporamos en este atributo la información principal del contenido de la propia página.

Si pulsamos sobre el control “Show editor” del contenido principal nos moveremos a un entorno básico de edición de texto en el que podremos realizar algunas operaciones básicas.

Por orden vemos los comandos de negrita, itálica, insertar enlace a un elemento de sitecore, insertar imagen, borrar enlace, gestor de enlace, inserción de símbolo, incluir lista ordenada (con números), incluir lista desordenada (con puntos), inserción de tabla, selección de estilos predefinidos, deshacer acción, rehacer acción y buscar.

Merece especial atención el comando de tablas que para mantener un estilo homogéneo en toda la web pasamos a explicar a continuación.

Recomendamos el uso del asistente en la opción de “Table wizard”. En el siguiente interfaz disponemos de distintas herramientas para configurar la tabla. En la primera pestaña de configuración podemos elegir número de filas y columnas así como seleccionar celdas y realizar las uniones (span) que consideremos necesarias.

En la pestaña “Table properties” recomendamos seleccionar en la parte derecha en el desplegable de CSS la opción de “uclmtable” para homogeneizar los estilos de todas las tablas que aparezcan en la web. Un ejemplo lo podemos ver en el punto siguiente.

Menús Personalizados para un Promotor

Se deben crear en la ruta del promotor correspondiente, en la parte del árbol de contenidos: /Global/promotores/

Se pueden personalizar tanto un menú superior como un menú inferior:

Barras de menús - superior e inferior

En las carpetas de estos menús se pueden insertar ítems llamados “Item MenuMega”. Estos menús-mega pueden tener una dirección URL de enlace, más opciones de menú (que se crean insertando ítems “Item Menu”, y las opciones con ítems “Item MenuOpcion”), más un botón del que hay que definir su texto (rellenando el campo “TextoBoton” con una dirección donde redirija el botón (rellenando el campo “UrlBoton)”.

En el siguiente ejemplo:

Opciones de menús

“Grado” es un ítem “MenuMega”, “Información del Grado” es un ítem “Menu”, “Justificación” es un ítem “MenuOpcion” y “Ver más” es un botón.

En las opciones de menú también se pueden insertar imágenes como se muestra en el siguiente ejemplo:

Menú con imágenes

Una vez creados los menús, en la web del centro o departamento, en la ruta /home correspondiente en la sección "Item PaginaHome Menús" hay que seleccionar los menús creados anteriormente.

Información sobre Idiomas y Versiones

En el menú Versions hay un botón en la cinta de opciones donde podemos seleccionar Spanish o English. Así se pude ir generando una versión inglesa por cada uno de los ítems que tengamos. La primera vez que se selecciona English informa que se añade una nueva versión.

Con el botón Translate se pueden ir viendo las dos versiones para, por ejemplo, comprobar que no nos quede ningún contenido sin traducir. En la columna izquierda se verá el idioma activo y en la columna derecha se puede ver el otro idioma, que se debe seleccionar en el recuadro "Language".

En la esquina superior derecha de cada ítem se puede seleccionar el idioma con el que queremos trabajar.

Para cada item se podrían crear diferentes versiones, pero como norma general es preferible trabajar solo en una versión.

Idiomas

Componente para la web de Eventos

Con este componente se pueden añadir los eventos, de la web de Eventos de la uclm, de un determinado centro. Sin la necesidad de insertar un widget.
Se puede seleccionar por Tipo de Evento (Conferencia, Congreso, Curso, Curso de Verano, Jornadas o Seminario), aunque normalmente este campo se deja en blanco para que se muestren todos los tipos de evento.
En el campo "EventoDirectorio" se puede seleccionar el campus concreto (Albacete, Almadén, Ciudad Real, Cuenca, Talavera de la Reina o Toledo) o se puede seleccionar "UCLM", en el caso que no sea de un campus concreto.
En el campo "EventoUbicacion" se puede seleccionar un Centro/Facultad/Promotor en concreto. Si se deja en blanco se mostrarán todos.

Ejemplo del componente para Eventos UCLM

Jue.21NOV 2024

12:00 a 13:00Hoy hablamos de… REDES SOCIALES UCLM, Calle Altagracia, Ciudad Real, España

Mar.26NOV 2024

12:00 a 13:00Hoy hablamos de… EMPLEO PÚBLICO EN LA SEGURIDAD SOCIAL UCLM, Calle Altagracia, Ciudad Real, España

Jue.28NOV 2024

12:00 a 13:00Hoy hablamos de… EMPRENDIMIENTO UCLM, Calle Altagracia, Ciudad Real, España

Resumen de Resoluciones y Calidades en la librería de medios (Mediateca)

En esta tabla se especifica la lista de imágenes con sus respectivas resoluciones que deben estar disponibles en la librería de medios:

Tipo	Tipo de Imagen	Resolución	Proporción
A	Slider (Imágenes que rotan en la cabecera de la página principal – carrusel)	1110x420	37/14
B	Cabecera de página interior	1280x480	8/3
C	Complemento de enlaces visuales 3x3	480x378	5/4
D	Noticias	854x480	16/9
	Banner	854x480	16/9
E	Opciones de menús (de las barras de menús)	250x140	16/9