Configurar el dock de contacto flotante
El dock de contacto presenta opciones de contacto persistentes en una interfaz flotante. Úsalo cuando los visitantes necesiten acceso inmediato a un conjunto reducido de acciones claras; usa el contenido de página ordinario para la información de contacto detallada.
Configurar el texto del dock
Abre Settings → POM Theme → Site layout → Floating contact dock → Contact floating dock.
Define el texto que requiere la presentación elegida:
- Toggle floating badge text
- Enable prewindow message
- Prewindow text
- Prewindow button label
- Header title
- Header subtitle
- Under header text
- After options text
Mantén breve el texto de apertura. El visitante debe entender qué ocurre antes de seleccionar una opción.
Añadir opciones de contacto
En Contact options, añade una entrada por cada ruta. Una entrada puede incluir una imagen de perfil, el nombre del agente, el cargo y un icono.
Elige On click según el destino:
| Acción | Destino requerido |
|---|---|
| Open link | Un enlace, con relación y destino donde sea necesario |
| Open link in AJAX window | Un enlace para abrir en la ventana proporcionada |
| Open modal | Un Modal window ID introducido sin # |
| Open reusable block | Un bloque reutilizable seleccionado |
| Custom HTML | El marcado personalizado admitido |
Usa Available? para controlar si se ofrece la entrada y Custom CSS class (optional) solo cuando el estilo admitido del sitio lo requiera.
Traducir el dock con Polylang
Guarda el texto del dock en el idioma de origen y abre Languages → Translations. POM registra el texto guardado de la insignia, la preventana y la cabecera, el texto alrededor de las opciones, el nombre y el cargo de cada opción, y su HTML personalizado. El HTML de créditos del pie existente también está disponible allí. El registro tiene lugar en la administración; no es necesario visitar la página pública.
Introduce las traducciones y selecciona Save Changes. Conserva los enlaces y la estructura HTML al traducir HTML. Si una etiqueta cambia más adelante, traduce también su nuevo texto de origen. Las páginas enlazadas y los bloques reutilizables tienen sus propias versiones de idioma y se editan por separado.
Abre el frontend de cada idioma y verifica la insignia cerrada, el panel abierto, cada etiqueta de opción y los créditos del pie. Una traducción que falte recurre al texto de origen como alternativa.
Estilizar la interfaz
Selecciona el Contact widget toggle icon y configura las paletas de la insignia, el icono, la cabecera y el texto. Comprueba el contraste tanto en la insignia cerrada como en el panel abierto; aparecen sobre fondos de página diferentes.
Verificar cada ruta
- Abre el dock en escritorio y en móvil.
- Confirma el comportamiento de la preventana y todo el texto visible.
- Activa cada opción disponible.
- Verifica los enlaces, destinos, ventanas AJAX, IDs de modal, bloques reutilizables o contenido personalizado según corresponda.
- Confirma que las entradas no disponibles no se ofrecen.
- Prueba el funcionamiento con teclado y el foco visible.
- Revisa el dock junto con los iconos flotantes de subir arriba y secundarios del pie.
Si un modal no se abre, confirma que el ID está introducido sin el # inicial. Si un bloque reutilizable está vacío, edita el bloque seleccionado en lugar de la opción del dock.