Todas las colecciones
Soy administrador
Campus
General
Galería de plantillas de Certificados y Portadas para cursos
Galería de plantillas de Certificados y Portadas para cursos
Actualizado hace más de una semana

Se terminaron las marcas blancas realizadas por nuestros equipos. TODO el proceso pasa a las manos de los administrados. Estos cambios introducimos en la Configuración General del Campus:

  1. Ver aplicados en todos sus templates los colores elegidos en la administración general.

  2. Elegir sus templates a partir de una galería ofrecida por Wormhole para customizar el layout de cada uno como desee.

  3. Editar sus templates default y custom por curso a nivel contenido con editor html sencillo y amigable al uso.

Nuevo: Galería de plantillas

Esta galería con templates HTML, que el usuario puede seleccionar, editar y aplicar. Se ofrecerá esta funcionalidad para Certificados y Portadas de cursos. La misma se encontrará como una nueva sección dentro de la Configuración general del Campus.

Estas plantillas prediseñadas resuelven el layout HTML, ya que es la parte más compleja de HTML y evitamos que los administradores necesiten conocimientos en lenguaje HTML para poder gestionar certificados y portadas, quedando sólo de su lado ajustar el contenido según sus necesidades. Los archivos que se utilizan en estas plantillas son hosteadas por nosotros (imágenes de fondo, logos, firmas) y no ocupan lugar en el almacenamiento de la suscripción.

Aclaración: En una primera versión no hay distinción de esta funcionalidad por tipo de cuenta, siendo válida para todas.

Qué contiene?

Cada sección cuenta con una breve descripción y un carrusel para ver todos los templates. Cada template tiene un nombre genérico, por ejemplo Plantilla 01 el cual podrá ser editado.

Al posicionarse sobre cada template se visualiza un layer negro con un botón que diga Editar. Al clickearlo se abre un popup fullscreen con el template seleccionado, allí se realiza la personalización y edición del mismo.

Allí encuentran una columna al lado izquierdo sobre el cual están todas las opciones disponibles para ese template. Y sobre el lado derecho, el editor html con el template seleccionado. Allí se puede ir previsualizando los cambios de idioma e imágenes y también editar el contenido.

Dentro de está personalización también existe un botón de Edición avanzada, el cual muestra el template en código HTML. También desde allí se puede editar el nombre de la plantilla. Y cuenta con un switch que por defecto estará apagado en todas excepto en uno para seleccionar cuál será el certificado por defecto de la suscripción.

La columna de la izquierda cuenta con distintas opciones según el tipo de template:

  • Certificado : selección de idioma. (Con todos los idiomas disponibles en la suscripción), subir imágenes (con opción de imagen de fondo, firmas y logos. ) y variables de reemplazo.

  • Portada: variables de reemplazo (nuevo feature, ver descripción en el detalle de Portadas).

Este popup tiene 3 botones disponibles:

  1. Cancelar: cancela la acción de elección y edición del template. Sin realizar ningún cambio sobre el template vigente.

  2. Vista previa (Sólo visible si el template elegido es de certificado): Una vez ajustado el template el administrador pueda visualizar como el certificado se ve tal cual como lo recibirán los participantes, es decir en formato pdf.

  3. Aplicar: Al clickear este botón se levanta un popup preventivo que advierte que si se confirma este cambio el mismo impactará en todos los cursos y programas de la suscripción, excepto en aquellos en donde el template haya sido editado desde la configuración propia del mismo.

mceclip2.png

Certificados

Certificado por defecto de la suscripción

Este certificado se aplicará automáticamente en todos los cursos y programas que se creen. Al realizar cualquier cambio en este template el cambio impactará en todos los cursos excepto en aquellos en donde el certificado fuera editado desde la configuración de un curso (es decir, al igual que funciona hoy cuando se hace por backend).

Dentro de las opciones disponibles en la columna de la izquierda un certificado tendrá las siguientes opciones disponibles:

Selector de idioma del certificado

El selector de idioma muestra las opciones de los idiomas disponibles de la suscripción, habiendo un máximo de cinco idiomas (español, francés, italiano, portugués y inglés). Al tener seleccionado un idioma se editará el certificado solo para ese idioma.

Para ser consistentes, este cambio también se agrega en la personalización de Certificados dentro de la configuración de un curso.

Al cambiar de idioma, o cerrar el popup, si previamente había sido editado el certificado, te avisa que tenes datos sin guardar y que si salís sin guardar se van a perder los mismos.

Personalizar las imágenes de la plantillas

En esta sección el administrador podrá subir directo desde su computadora las imágenes que son posibles personalizar en esta plantilla, junto al botón de Editar se verá una breve descripción de la imagen junto con las recomendaciones de medidas y formato.

mceclip3.png

Al clickear el botón Editar de cada ítem se levanta un pequeño popup con los espacios para subir la cantidad de imágenes correspondientes. En el caso del logo sólo 2, y en el caso de firmas hasta 4. En el caso de imagen de fondo sólo se permite una por template.

Las extensiones de las imágenes permitidas son: .png , .jpg o .gif. Las imágenes son válidas sólo para el idioma seleccionado. Se deben subir por cada idioma que se desee editar.

Tener en cuenta que estas imágenes que se suban estarían atadas al idioma en el cual se está modificando.

Al subir las imágenes se reemplazarán automáticamente en el editor html. Las mismas se insertarán en el lugar indicado del template según una clase existente en el template.

Al clickear el botón Aplicar, aparecerá un popup preventivo que pida confirmar la acción.

Cuando ocurre un error por falta de una clase para insertar la img, se abre un banner con un link de Más información que lleva a un artículo del centro de ayuda donde explica el funcionamiento de las clases en los templates.

Certificado personalizado por curso

En sintonía con la funcionalidad para personalizar los certificados default, dentro de la configuración propia de un curso, en la sección Certificados también se visualizarán las siguientes funcionalidades:

  • Dropdown de selección de idiomas.

  • Botón para elegir template de certificado.

  • Variables de reemplazo (dentro del desplegable).

  • Edición avanzada (para mostrar el template en código html).

El template que se elija y los cambios que se apliquen sobre el mismo sólo afectará al curso o programa en cuestión. Al clickear el botón Utilizar selector de plantilla, se abrirá un popup con los templates de certificados disponibles (los mismos que se visualizan en la galería de la administración general).

Allí se podrá elegir uno y al clickear el botón Aplicar el mismo reemplazará al anterior en el editor HTML. Allí el administrador podrá editar a través del editor el resto de la información o estilos que necesite utilizando el nuevo template. Se agregá también el botón de Edición avanzada para mostrar el template en código html.

Al igual que hoy tendrá debajo el botón Guardar para guardar el certificado con todo lo editado y al lado tendrá también el botón Vista previa para generar el pdf del certificado de prueba.

Portadas

Portada por defecto de la suscripción

Como parte del proceso de Marca Blanca otro de los templates que se diseña es la portada de cursos/programas. Antes no existía la posibilidad de guardar una portada por defecto desde la administración general. Se agrega al igual que con los certificados, una sección para generar una portada por default para la suscripción.

La misma se aplicará a todos los cursos y programas. En caso de que el curso tenga habilitada la opción de Mostrar en la Tienda, también se aplicará este template como Descripción Completa.

Los templates disponibles se ofrecerán desde la sección ya mencionada en la administración general de Galería de plantillas.

Al clickear el botón Editar se abre el popup fullscreen con el template seleccionado, el botón de Edición avanzada y la columna de personalización del mismo. En dicha columna tendremos disponibles el dropdown de selección de idiomas, para poder configurar un template diferente para cada uno.

Además tendremos disponibles la sección de variables de reemplazo. Actualmente no existen variables de reemplazo para las portadas, agregamos algunas con los siguientes datos del curso/programa para que se reemplacen de manera dinámica al igual que sucede hoy con los certificados.

  • Título del curso o del programa // {Nombre_Evento} (Misma certificado)

  • Descripción corta // {DescripcionCorta_Evento} (Misma certificado)

  • Fechas de inicio // {Fecha_Inicio_Evento}

  • Fechas de fin // {Fecha_Final_Evento}

  • Duración // {Event_Duration}

  • Nombres de instructores a cargo // {Nombre_Completo_Instructores}

Al clickear el botón Aplicar se levanta un popup preventivo (similar al de certificados) que advierta que el nuevo template se aplicará a todos los cursos y programas de la suscripción, excepto en aquellos donde la portada haya sido editada desde la sección Datos del curso.

Portada personalizada por curso

Agregamos en la UI de Datos del curso donde se customiza la portada, el botón de Utilizar selector de plantilla. Para que el administrador pueda elegir y customizar un template diferente si lo desea para un curso o programa y los cambios impacten sólo ahí.

Al clickear el botón Utilizar selector de plantilla se abre el popup con la galería de templates disponibles de la suscripción (los mismos que en la administración general), mostrando los templates sólo de portadas.

Allí se podrá elegir uno y al clickear el botón Aplicar el mismo reemplazará al anterior en el editor HTML. Allí el administrador podrá editar a través del editor el resto de la información o estilos que necesite utilizando el nuevo template. Se agregá también el botón de Edición avanzada para mostrar el template en código html.

Nuevo editor HTML

Reemplazamos el editor ckeditor por summernote en una primera instancia sólo en las nuevas secciones, es decir, para certificados y portadas. Es necesario que todos los textos del editor deben ser multi-idioma con los idiomas disponibles en campus, para que se vea en el idioma con el que esté el usuario.

¿Qué pasaba con el editor de HTML?

Antes teníamos diferentes funcionalidades que hacían uso de HTML y estas tienen requerimientos diferentes:

  1. Certificados: El usuario final, en la mayoría de los casos, solamente necesita cambiar las firmas, logos y la imagen de fondo. La información se cambia automáticamente con las variables de reemplazo. Contar con templates de certificados, soluciona prácticamente todos los problemas respecto al certificado.

  2. Portadas / Descripción completa: En este caso la necesidad es diferente, porque si es necesario cambiar el contenido, no sólo el layout. Entonces, contar con plantillas de portadas, solamente soluciona la parte del layout, pero el contenido todavía debe ser cargado por el usuario final, ya que no es inserta por variables de reemplazo. Las plantillas de portada se utilizarán solamente en el contexto del campus, y ya no incluida en el email de bienvenida a curso. El uso de la misma por email será descontinuado, por lo tanto no es necesario que las nuevas funcionalidades de customización apliquen en un template de portada enviado por email, si a los templates que se utilicen en el contexto de campus.

  3. Plantillas de notificaciones: Similar a certificados.

¿Ha quedado contestada tu pregunta?