Cómo configurar el estilo de borde del Widget
Vamos a explicar cómo configurar el estilo de borde del Widget de TuCalendi desde una plantilla de apariencia. El borde define el contorno visual del widget y permite adaptarlo al diseño de la página donde está insertado.
La configuración del borde se divide en dos secciones dentro del editor: Estilo del borde del widget, que agrupa el ancho, el estilo y el color, y Radio del borde, que controla el redondeo de las esquinas.
- Width (Ancho): Grosor del borde del widget, expresado en píxeles (px).
- Style (Estilo): Tipo de línea del borde: sólido, punteado, discontinuo, entre otros.
- Color: Color del borde del widget.
- Radius (Radio del borde): Redondeo de las esquinas del widget, expresado en píxeles (px).
Haciendo clic en cada uno de estos campos se despliega un menú con las opciones disponibles para seleccionar el valor deseado.
Antes de empezar
Para seguir este tutorial, debes acceder a la sección de "Apariencia del widget" y tener una plantilla de apariencia creada para editarla. El proceso completo de creación y asignación de plantillas se explica en el tutorial general sobre cómo crear y asignar una plantilla de apariencia del Widget.
Paso 1. Acceder a la apariencia del widget
Desde el menú lateral de TuCalendi, accede a la sección "Widgets" y selecciona la opción "Apariencia".
Paso 2. Crear o editar una plantilla de apariencia
Dentro de la sección "Apariencia", crea una nueva plantilla o edita una plantilla existente haciendo clic en "Editar".
Paso 3. Localizar los campos de borde en el editor
Dentro del editor de la plantilla, localiza los campos de borde en la zona inferior del panel de personalización. Encontrarás dos bloques diferenciados:
- Estilo del borde del widget: agrupa el campo Width (ancho), el campo Style (estilo de línea) y el selector de color del borde.
- Radio del borde: contiene el campo Radius, que controla el redondeo de las esquinas del widget.
La siguiente captura muestra la ubicación de ambos bloques dentro del editor, señalados con flechas.
Paso 4. Configurar el estilo del borde
Haz clic en cada campo para desplegar el menú de opciones y seleccionar el valor deseado:
- Width: selecciona el grosor del borde en píxeles. Un valor de 0px elimina el borde completamente.
- Style: elige el tipo de línea del borde entre las opciones disponibles, como sólido (solid), punteado (dotted) o discontinuo (dashed).
- Color: selecciona el color del borde del widget.
Paso 5. Configurar el radio del borde
En el bloque Radio del borde, haz clic en el campo "Radius" y selecciona el valor deseado en píxeles. Un valor mayor produce esquinas más redondeadas, mientras que un valor de 0px da al widget esquinas rectas.
Paso 6. Guardar los cambios
Después de configurar todos los parámetros del borde, haz clic en "Guardar" para aplicar los cambios en la plantilla de apariencia.
Paso 7. Comprobar la asignación de elementos
Una vez guardada la plantilla, comprueba que esté asignada al hub o encuesta con enrutamiento correspondiente. Si la plantilla no está asignada a ningún elemento, los cambios no se verán reflejados en ningún widget.
Versión corta para centro de ayuda
Para configurar el borde del Widget, accede a la "Apariencia del Widgets", crea o edita una plantilla y localiza los campos "Estilo del borde del widget" y "Radio del borde" en la zona inferior del editor. Haz clic en cada campo para desplegar el menú de opciones y ajusta el ancho, el estilo, el color y el radio del borde según tus preferencias. Haz clic en "Guardar" y comprueba que la plantilla esté asignada al hub o encuesta correspondiente.