Personalizaciones web

Son las distintas personalizaciones del diseño web que puede adoptar el campus. Estas personalizaciones se asignan a una entidad asociada, de forma que cuando un usuario se identifica, el campus adopta la personalización de la entidad asociada asignada al usuario.

Para configurar el diseño de la personalización  tiene las siguientes opciones:

El Administrador, desde esta pantalla, puede crear una Nueva personalización o Borrar alguna existente. Al hacer clic en el enlace Editar se pueden ver o modificar los datos de la personalización, es decir, se pueden establecer las secciones a las que podrán acceder los usuarios:

• ID: Número que identifica al registro en la tabla.
• Nombre: Es el nombre de la personalización web.
• Nombre abreviado: Nombre utilizado para nombrar las carpetas y archivos involucrados en el diseño de la personalización.
• Idioma: Es el idioma asociado a la personalización. El campus adopta ese idioma cuando un usuario entra a través de esa personalización.
• Orden: Número para ordenar la lista de personalizaciones web del campus.
• Observaciones: Podemos insertar un texto solo visible a nivel interno.
• Tipo de página de inicio:
• Portal: muestra el menú superior a los usuarios no conectados salvo las página que se hayan configurado accesibles solo para usuarios registrados. Además del eslogan, las áreas y noticias destacadas.

• Dividido: los usuarios que no han iniciado sesión solo ven la página de inicio con el formulario para iniciar sesión, la imagen eslogan y otros recursos como banners o noticias.

• Tarjeta: los usuarios que no han iniciado sesión solo ven la página de inicio con el formulario para iniciar sesión, más los textos incluidos en el apartado 'Texto a pie de página' (menú Panel de control>Textos legales)

• Básico:Solamente muestra el formulario de identificación.

• Personalizado: Para los campus que quieran contratar una plantilla personalizada para la página de Inicio.

• Posición del formulario de inicio de sesión: En función del tipo de página de Inicio que hayamos seleccionado podemos configurar la alineación del formulario de inicio de sesión a la izquierda o a la derecha. En el tipo Básico no funciona ya que la posición del formulario es central.
  
• Mostrar las áreas temáticas principales del Catálogo de cursos en la página de inicio:

• Secretaría: Indica las opciones de la 'Secretaría' visibles en la personalización.
  
• Catálogo de cursos: Indica si el 'Catálogo de cursos' está visible en la personalización.
• Biblioteca: Indica si la 'Biblioteca' está visible en la personalización.
• Cafetería: Indica las opciones de la 'Cafetería' visibles en la personalización.
  
• Secciones accesibles sólo para usuarios registrados: Indican qué secciones públicas son accesibles sólo para usuarios identificados previamente en el campus como usuarios registrados.
• Síguenos en: Se pueden indicar los hipervínculos a las distintas redes sociales de la organización.

IMÁGENES

Deste esta opción tendremos que subir las diferentes imágenes que formarán el diseño de nuestro campus.

• Icono favicon: Es el icono o símbolo que acompañará a la URL de la plataforma en los navegadores. Debe ser una pequeña imagen cuadrada con formato ICO o PNG y se recomienda un tamaño de 16x16 píxeles.

• Logotipo para el formulario de iniciar sesión: Esta imagen se muestra encima del formulario de iniciar sesión en la página de inicio. Se recomienda una imagen de menos de 300 píxeles de ancho.

• Logotipo para el menú de navegación principal: Esta imagen aparece en la esquina izquierda del menú principal. Se recomienda una imagen con formato PNG transparente que no supere los 40 píxeles de alto.

• Icono para los dispositivos móviles: Debe ser una imagen cuadrada con formato PNG y un tamaño recomendado de 180x180 píxeles.

• Imágenes para los emails:
• Imagen para el encabezado: Permite añadir una imagen que se mostrará en la parte superior de nuestros emails.
• Imagen para el pie: Permite incluir una imagen al pie del email,en el ejemplo se ha incluido una franja de color.

• Cabecera de las páginas: Permite configurar una cabecera para las páginas de la plataforma. Además de la imagen y color de fondo, puede subir otras imágenes o logotipos más pequeños que se pueden ubicar en diferentes partes de la cabecera.
  

• Altura de la cabecera (en píxeles): Se indica el alto que tendrá la cabecera de las páginas. Se recomienda una altura de unos 90 píxeles.

• Color de fondo: Se puede seleccionar un color para que aparezca en el fondo de la cabecera.
• Imagen de fondo: Se puede subir una imagen para que aparezca en el fondo de la cabecera.
• Repetir imagen de fondo: Esta opción indica que la imagen de fondo seleccionada se repetirá a lo largo de toda la cabecera.
• Imagen o logotipo de la izquierda: Se puede seleccionar una imagen o logotipo para que aparezca en la parte izquierda de la cabecera.
• Color de fondo de la izquierda: Se puede seleccionar un color de fondo diferente para que aparezca en la parte izquierda de la cabecera.
• Imagen o logotipo del centro: Se puede seleccionar una imagen o logotipo para que aparezca en el centro de la cabecera.
• Imagen o logotipo de la derecha: Se puede seleccionar una imagen o logotipo para que aparezca en la parte derecha de la cabecera.

• Logotipo pie de las páginas: Permite subir una imagen que se muestra en el pie de las páginas. Se recomienda una imagen con formato PNG transparente. Optionalmente esta imagen puede ser un hipervínculo a una web externa.
• Texto alternativo: Texto que ayuda a las personas dIscapacitadas a entender la imagen:
• Hipervínculo: Permite incluir un enlace en el logotipo.

• Imagen del lateral de la página de inicio: Dependiendo del tipo de página de inicio configurado, puede mostrarse una imagen en el lateral que hay junto al formulario de iniciar sesión. Sobre esta imagen se mostrará el eslogan introducido en los textos del idioma.
• Tamaño: Se puede configurar la imagen para que cubra todo el espacio disponible o un porcentaje inferior al 100%.
• Alineación: Se puede configurar cómo debe alinearse la imagen en el espacio disponible para ella (para los casos en los que el tamaño sea inferior al 100%).
• Color de fondo: Se puede configurar un color de fondo que aparecerá, o solo sustituyendo al color principal (si no configuramos ninguna imagen) o detrás de la imagen que configuremos (para los casos en los que el tamaño sea inferior al 100%).

IMPORTANTE: La imagen/color que va al lado del formulario de inicio de sesión se puede configurar de dos formas:

• En Personalización web, configurar una imagen o un color. El texto que aparecerá encima será el configurado en Idiomas-Textos-Título del eslogan / Descripción del eslogan.
• Con un Banner de tipo Eslogan se puede configurar una imagen y un texto diferente. En este caso, el texto que aparecerá sobre la imagen será el configurado en el banner. El texto configurado desde Idiomas-Textos aparecerá en un bloque justo debajo del formulario de inicio de sesión y el banner.

COLORES

Permite indicar los colores que configuran el aspecto gráfico de la plataforma. Para cumplir el nivel de accesibilidad WCAG AA, es necesario que exista suficiente contraste entre el color de fondo y el color del texto. Por ello, puede ser útil el uso de la herramienta https://webaim.org/resources/contrastchecker para poder verificar este contraste en los colores configurados.

El botón RESTAURAR COLORES PREDETERMINADOS permite volver a los colores que tenía el campus por defecto.

Es importante que los colores sean suficientemente oscuros para que tengan el contraste necesario con el texto de color blanco. Para el color de fondo con el cursor encima se recomienda utilizar un color parecido al color de fondo pero un poco más oscuro o más claro.

• Color principal: Es el color que se muestre por defecto en la pantalla de inicio junto al formulario de inicio de sesión, en los campos activos del formulario de inicio de sesión y en elementos como el marcador que indica el número de registros en un listado de registros, textos destacados en la ficha de un curso en el catálogo de cursos…

• Color secundario: Es el color que se muestre en botones secundarios.

• Pie de las páginas:
• Color de fondo: Es el color de fondo del pie de página.
• Color de texto: Es el color de los textos que aparezcan en el pie de página.