Tematización en el editor y las aplicaciones de WalkMe
Breve descripción general
La tematización lleva la configuración de diseño de la consola a WalkMe Editor y las aplicaciones de WalkMe. Puedes ver y ajustar cómo se aplica el tema a cada elemento, separar elementos individuales cuando sea necesario y diseñar aplicaciones de WalkMe como Encuestas y la barra de acciones directamente desde la aplicación Tematización.
Cómo funciona
Tematización en WalkMe Editor
La tematización se aplica a todo el contenido del editor. Ve a Personalizar estilo de contenido para ver cómo afecta a los globos y SmartTips.
Globos
En la pestaña Globo, puedes ver el tema activo aplicado a los globos.
Puedes cambiar el color del resaltador para que sea cualquiera de los colores del tema.
También puedes desvincular el tema si deseas que el contenido no se vea afectado por el tema.
Por ejemplo, si separas el color del resaltador del tema, seguirá siendo este color (en este caso: rosa Primario, Principal) incluso si cambias el tema en la consola.
Haz clic en Cambiar plantilla para ver todas las plantillas disponibles.
Para comprender mejor cómo los diferentes tipos de texto y colores del tema se conectan a diferentes plantillas, consulta la sección Mapeo: relación Tema-Plantilla a continuación.
Si deseas realizar cambios en una plantilla específica del tema, haz clic en el icono Editar.
Se abrirá la consola de CSS. Aquí puedes ajustar cualquiera de las propiedades del globo.
Puedes reemplazar el color primario con el secundario o cambiarlo completamente, por ejemplo, a blanco o negro.
Puedes encontrar las variables CSS que provienen del tema en el artículo CSS en Tematización.
Puedes guardar la plantilla editada como nueva y aparecerá en la pestaña de Plantillas de usuario.
En la pantalla de pasos de Smart Walk-Thru, puedes seleccionar el color de las partes de texto de los colores del tema. El estilo de tipografía no se puede cambiar a partir de aquí, ya que se ha heredado del tema.
También puedes cambiar una plantilla diferente.
SmartTips
En la pestaña SmartTip, puedes ver el tema activo aplicado a tus SmartTips.
Haz clic en Cambiar icono para seleccionar el icono que deseas que tenga el SmartTip.
Haz clic en Editar icono si deseas cambiar el color y el tamaño del icono. Puedes seleccionar cualquier color del tema.
También puedes cambiar el color de la punta en sí.
También puedes separar cualquiera de los valores del tema si desea que este elemento de diseño no se vea afectado por el tema.
Iniciadores
Al crear un iniciador, puedes elegir entre todas las plantillas disponibles en este tema.
En el menú desplegable Diseño, puedes definir los colores preferidos del tema.
También puedes desvincular el tema y definir un color que no esté relacionado con él.
Cuando separas el color del tema, verás un icono dedicado que lo ilustra.
Siempre se puede volver a conectar con el tema.
Después de crear el iniciador, puedes cambiar la plantilla en la pantalla Opciones del iniciador.
Puedes cambiar el texto de un iniciador local en la pestaña Interacción del iniciador. Para ello, marca la casilla que dice "Utiliza texto personalizado en lugar del texto de la plantilla predeterminada". Ahora puedes editar el texto que aparece a continuación.
Haz clic en Editar diseño para cambiar el estilo tipográfico o seleccionar diferentes colores del tema.
Encuestas
- Las encuestas están conectadas a temas por defecto
- Solo hay una plantilla disponible para las encuestas
Cambios en el editor
Antes
- Puedes seleccionar colores en el editor, editar el CSS de la plantilla y ver el CSS, guardar el diseño CSS como plantilla
Después
- La edición de color y tipografía se realiza en el tema.
- Se proporcionarán al usuario nuevas plantillas conectadas al tema.
- Puedes editar la plantilla CSS de globo general.
Antes
- Puedes seleccionar colores para el texto, el fondo y el borde
Después
- Los colores provienen del tema y puedes cambiar el mapeo y desconectarte del tema
Antes
- Los iconos son imágenes: el color no se puede cambiar (el usuario solo puede seleccionar una imagen diferente)
- Los colores no se pueden cambiar con CSS
Después
- Los iconos son HTML.
- Los iconos están vinculados al tema y se ven afectados cuando se cambian los colores del tema.
- Puedes cambiar el mapeo y el tamaño del icono.
Antes
- No puedes cambiar la familia de fuentes
Después
- Puedes ver la tipografía aplicada al título y al cuerpo.
- El diseño está vinculado al tema.
Antes
- No se puede cambiar el texto del iniciador.
- Solo se puede crear una plantilla nueva con texto diferente.
Después
- Puedes cambiar el texto del iniciador local marcando la casilla "Usar texto personalizado"
- La galería se actualizó y ahora ofrece nuevas plantillas conectadas a temas
Tematización en Visual Designer
Nuevas plantillas
Cuando creas un nuevo ShoutOut, verás las nuevas plantillas, todas ellas presentadas en el tema que has establecido como activo.
Si pasas el cursor sobre el icono Tematización situado junto al color, puedes ver qué tema se está utilizando actualmente.
Puedes elegir entre los colores del tema y los estilos tipográficos, o bien separarte del tema y definir un color o unas propiedades de fuente propias.
Botones
Puedes decidir a qué propiedades del botón deseas que se conecten o se desconecten del tema. Por ejemplo, puedes separar la fuente y elegir una propia y mantener el color del texto y el color de relleno asociados al tema.
Tematización para la barra de acciones
Para diseñar la barra de acciones desde la aplicación Tematización:
- Abre Tematización
- En el menú desplegable de sistemas, selecciona Sistemas globales → Lanzadores globales de IA
- Verás un tema predeterminado de WalkMe(X) y la vista previa de la barra de acciones en el lado derecho de la pantalla
Puedes utilizar cualquiera de los temas de WalkMe o personalizados para la barra de acciones.
Puedes diseñar el icono de la barra de acciones utilizando la función de color degradado.
Tematización para encuestas
Las encuestas emergentes heredarán el tema del sistema. Las encuestas de página completa se pueden diseñar individualmente desde la aplicación de Tematización.
Para diseñar la encuesta de página completa:
-
Abre Tematización
-
En el menú desplegable de sistemas, selecciona Global → Encuestas globales
-
Verás un tema predeterminado y la vista previa de la encuesta de página completa en el lado derecho de la pantalla
-
Puedes establecer colores, tipografía y estilo de botones
