Bienvenido a este artículo donde descubriremos cómo puede personalizarse su plataforma Nudgis para reflejar su identidad visual.

Nudgis cuenta con funciones de personalización que le permiten, entre otras cosas, aplicar la carta gráfica de su empresa. La primera parte le mostrará cómo ajustar la página de inicio del sitio, luego echaremos un vistazo a los ajustes globales de personalización y, finalmente, veremos cómo puede personalizar la apariencia del reproductor de vídeo.

Para acceder a estos ajustes, su cuenta de usuario debe tener el permiso global "Puede editar la apariencia del sitio".

Tabla de contenidos

1/ NOTAS SOBRE EL PASO A LA VERSIÓN 12.2.0

2/ PÁGINA DE INICIO

2A/ LOS DIFERENTES TIPOS DE WIDGET

3/ PERSONALIZACIÓN GRÁFICA

3A/ COLORES

3B/ LOGOTIPO

3C/ FUENTES

3D/ AVANZADO (CSS)

COLORES DEL REPRODUCTOR UBICAST

Notas sobre el paso a la versión 12.2.0

Nudgis 12.2.0 trae varios cambios, incluida la personalización de la nueva interfaz de usuario (actualmente en fase beta).

Hasta que se publique la versión final de la renovación de la interfaz, tendrá control sobre sus ajustes de apariencia para facilitar la transición.

Una vez que haya actualizado a la versión 12.2.0, ya no podrá cambiar la apariencia de la interfaz antigua. Sin embargo, seguirá estando disponible.

La elección de usar la nueva interfaz queda a criterio del usuario. Para activar la opción, vaya a su página de perfil, marque "Usar la nueva interfaz de usuario (beta)" y guarde.

También puede forzar la nueva interfaz para todos los usuarios yendo a los ajustes globales (se requiere el permiso "Puede editar los ajustes del sitio"). El ajuste se llama "Forzar nueva interfaz de usuario para todos". Si activa esta opción, ya no se dará a los usuarios la posibilidad de elegir si desean utilizar la nueva interfaz.

Ahora veamos cómo funciona la personalización gráfica de su Nudgis, empezando por su página principal.

Página de inicio

Desde la versión 13.2.0, la nueva página de inicio de Nudgis está disponible en fase beta. Para descubrirla, consulte nuestro artículo dedicado.

Cuando accede por primera vez, la página de inicio de Nudgis está prácticamente vacía y podrá añadir diferentes tipos de widgets para enriquecer el diseño de la página según sus necesidades. Los widgets son bloques que contienen elementos y que se pueden mover por una cuadrícula.

Para activar el modo de edición y empezar a personalizar la cuadrícula de widgets, haga clic en el botón "Personalizar página de inicio" en la parte inferior de la ventana:

Una vez activado el modo de edición, puede añadir widgets, moverlos libremente por la cuadrícula de widgets usando este icono y cambiar su tamaño desde la esquina inferior derecha.

Hacer clic en "Guardar" creará inmediatamente el widget en la página de inicio. El botón "Ver cambios aplicados" solo se utiliza para salir del modo de edición.

Los diferentes tipos de widget

En el cuadro "Añadir un widget", encontrará varios tipos de elementos que puede seleccionar y luego añadir uno por uno a la página de inicio:

• Lista de canales

Este widget muestra una lista de los canales principales de su Nudgis y le permite desplegar su estructura de árbol.

• Personalizado

Este widget le permite integrar contenido personalizado utilizando un editor de texto.

El editor de texto enriquecido facilita el formato:

• Elemento

El widget de Elemento le permite añadir un ítem al que se puede acceder directamente desde la página de inicio (vídeo, canal, en directo, etc.).

Mostrar en directo dentro: Muestra una lista de enlaces que apuntan a retransmisiones en directo en curso. Esta lista será el único elemento mostrado en el widget.

Miniatura grande: Esto le permite usar la miniatura con la resolución más alta disponible. Esta opción solo debe usarse si la miniatura estándar es demasiado pequeña.

Posición de la miniatura: Elija si la miniatura del elemento seleccionado se mostrará a la izquierda, a la derecha o en el centro del widget.

Mostrar título: Muestra el título del elemento seleccionado en el widget, debajo de la miniatura. Tenga en cuenta que si mantiene la visualización del encabezado, el título se mostrará dos veces.

Mostrar información: Muestra información sobre el elemento seleccionado (canal principal, ponente, fecha de creación, etc.).

Mostrar descripción: Muestra el contenido del campo de descripción del elemento seleccionado en el widget.

Elemento a mostrar: Le permite determinar qué elemento se mostrará en el widget. Podría ser el vídeo o canal más visto (en toda la plataforma o solo en el último mes), el canal o vídeo añadido más recientemente, o un elemento específico que desee en la página de inicio.

• Transmisiones en directo

Este tipo de elemento muestra una lista de las retransmisiones en directo actuales en la plataforma, si hay alguna en curso. Es redundante con la opción "Ver lista de directos dentro" en el widget de Elemento.

• Imagen

Con el tipo de widget "Imagen" puede, como su nombre indica, importar una imagen desde su ordenador a su página de inicio. El campo "Texto alternativo" del widget le permite añadir una breve descripción de la imagen que será vista por los lectores de pantalla (utilizados principalmente por usuarios con discapacidad visual) o motores de búsqueda.

• Título

Este widget puede utilizarse para añadir una barra de título para separar los diferentes bloques de la página y hacerlos más fáciles de leer.

• Lista de vídeos

Este widget muestra listas de vídeos divididas en varias pestañas. Puede elegir qué pestañas se muestran. Las opciones son: últimos vídeos añadidos, vídeos más vistos (desde siempre o el último mes), vídeos más comentados (desde siempre o el último mes), o la nube de etiquetas (generada a partir de palabras clave extraídas de los vídeos de la plataforma mediante OCR).

El botón Mostrar más vídeos en la pestaña Últimos vídeos redirige a la página de Últimos medios.

Todos estos tipos de elementos tienen opciones comunes que pueden ajustarse bloque por bloque.
Puede acceder a los ajustes de un widget haciendo clic en este icono , en la esquina superior derecha del elemento:
Aparecen los ajustes del widget, revelando opciones comunes a todos los tipos de bloques:

Widget transparente: Hace que el widget sea transparente (hace visible el fondo a través del widget).

Sin encabezado de widget: Para un widget sin título.

Visible para: Le permite elegir qué tipos de usuario podrán ver este widget (autenticado, no autenticado o ambos).

Modo de visualización: Le permite determinar para qué idiomas se mostrará este widget.

Título*: Determina el título de su widget, mostrado en la parte superior del elemento.

Enlace*: Contiene un enlace que se abrirá al hacer clic en el título. (Con la siguiente opción, puede definir si el enlace debe abrirse o no).

*Estas dos últimas opciones no funcionarán si el encabezado del widget está desactivado.

Ahora que sabe cómo configurar su página de inicio, echemos un vistazo a cómo funcionan los ajustes de apariencia del sitio.

Personalización gráfica

Los ajustes globales de personalización gráfica se pueden encontrar en Menú > Administración > Ajustes del sitio > Personalizar apariencia.

La primera pestaña le permite establecer los colores de la plataforma. Notará un recuadro en el lado derecho de la página. Esto muestra los cambios que realiza en tiempo real:

Los cambios también son visibles en el resto de la página de configuración de la apariencia, pero solo se aplicarán cuando guarde sus cambios.

Colores

Primero veremos cómo funcionan los botones de color. Son idénticos para todos los parámetros de modificación de color.

Cada parámetro se compone de dos bloques: el color activo (1) y el valor predeterminado (2).

Para modificar el color activo, puede introducir un código en el campo de texto o hacer clic en el bloque correspondiente y seleccionar un tono de entre las opciones ofrecidas.

Para volver al valor predeterminado, simplemente haga clic en el bloque de color correspondiente.

Recuerde guardar sus cambios para que puedan aplicarse.

Echemos un vistazo al significado de cada elemento.

• Tema: Puede elegir entre un tema oscuro o claro para iniciar sus ajustes, lo que solo era posible en versiones anteriores (< 12.1) utilizando CSS personalizado. El tema del sitio se aplica a todos los usuarios.
• Color primario: Cambia el color de los botones principales de Nudgis, una muestra de los cuales se muestra a continuación (en azul).
• Color de contraste principal: Cambia el color del texto en los botones principales, mostrado a continuación en blanco.

• Color de texto primario: Cambia el color de los enlaces e iconos (aquí en azul).

• Color secundario: Cambia el color de los mensajes de información, el botón de guardar y el indicador de almacenamiento utilizado por el usuario (en verde a continuación).
• Color de contraste secundario: Cambia el color del texto en los elementos de la sección anterior (aquí en negro).

• Color de texto secundario: Cambia el color del botón de restauración de medios en la papelera de reciclaje.

• Color de error: Cambia el color de los errores, en particular la barra de progreso de transcodificación cuando la transcodificación falla (en rojo a continuación).

• Color de contraste de error: Cambia el color del texto de error cuando se resaltan con el color de error (en negro a continuación).

• Color de texto de error: Color del texto de error o advertencia cuando no hay resaltado. Puede encontrarse en el botón Eliminar en el menú de acciones de medios al navegar por el catálogo, por ejemplo.

Logotipo

Esta pestaña le permite modificar el logotipo del sitio y el favicon sustituyendo los existentes. Importe su imagen (el formato recomendado es PNG), que no debe superar los 300 píxeles de ancho y 55 píxeles de alto.

Una vez que haya añadido su archivo de imagen, la vista previa no funcionará inmediatamente. Deberá guardar los cambios para que se muestre el nuevo logotipo.

Para volver al logotipo predeterminado, marque la casilla "Eliminar imagen actual" y guarde.

También puede cambiar el tamaño del logotipo (de entre tres opciones: pequeño, estándar y grande), lo que también afectará al tamaño del encabezado de la página.

Fuentes

Puede utilizar diferentes tipos de fuentes, eligiendo de la biblioteca de fuentes de su navegador web. Las fuentes predeterminadas son Lato, Arial y Sans-Serif.

Avanzado (CSS)

En esta pestaña puede añadir archivos como imágenes o fuentes que puede utilizar en su CSS personalizado.

En la sección Estilo de anulación, puede añadir código CSS personalizado que le permitirá ajustar elementos que no están disponibles en los menús vistos anteriormente.

Colores del reproductor UbiCast

La última pestaña de la página de ajustes de apariencia se refiere al reproductor Nudgis. Veremos los diferentes elementos que se pueden modificar a continuación.

Para visualizar mejor los cambios, usaremos el color naranja para las capturas de pantalla de esta sección.

• Color de fondo del reproductor: este es el fondo de su vídeo, el que será visible entre las fuentes en el modo Dynamic RichMedia.

• Color de fondo de los controles: Este ajuste cambia el color de la barra de control (en la parte inferior del reproductor) y el botón de reproducción.

• Color al pasar el ratón sobre los controles: Este es el color de los botones de control de reproducción cuando se pasa el cursor del ratón por encima.

• Color de fuente de los controles: este es el color de los iconos de control y el indicador de tiempo.

• Color de la barra de desplazamiento: Esta es la barra de progreso de reproducción ubicada en los controles del reproductor.

También es posible aplicar estos ajustes a canales o medios individuales. Esto no afectará a la apariencia del resto del sitio.

Gracias por seguir este artículo, ya puede modificar la apariencia de Nudgis como desee. No dude en consultar la sección de Nudgis de nuestra documentación para aprender más sobre nuestra solución.

Para continuar : "Cómo navegar en Nudgis".