Lo que necesitas
Un tema o subtema propio con acceso a los archivos y permiso para vaciar todas las cachés. No modifiques directamente un tema del núcleo ni un tema contribuido. En Accessonaut, crea primero un proyecto con el dominio real de tu web y abre en el proyecto la página de instalación.
Paso a paso
- Abre el archivo
THEMENAME.libraries.ymlde tu propio tema o subtema. Un subtema se conserva cuando se actualiza el tema base. - Crea una biblioteca, por ejemplo
accessonaut, e indica enjsla dirección pública de widget.js contype: external. - En
attributes, copia los atributos de tu código de inserción:defer: truey los atributos de datos comodata-project-idcon los valores de tu proyecto. - Incluye la biblioteca de forma global en
THEMENAME.info.yml, enlibraries:. Drupal carga JavaScript en el pie de página de forma predeterminada. - Vacía todas las cachés en Configuración → Desarrollo → Rendimiento o con
drush cr. Revisa la web pública con el tema activo.
Así es la inserción
Usa el código listo de tu proyecto. El ejemplo necesita tu ID de proyecto real y la dirección del servicio accesible públicamente.
<script src="https://accessonaut.com/widget.js"
data-project-id="TU_ID_DE_PROYECTO"
data-language="es" defer></script>Adapta el diseño a tu web
En tu proyecto de Accessonaut, abre «Widget de ayudas de lectura». Cinco plantillas y una vista previa en directo te ayudan con el diseño: colores, tipografías, ancho del menú, esquinas, sombras, icono o botón de apertura con texto y textos propios. La posición y los márgenes se ajustan por separado para escritorio y smartphone. Al guardar, tu código de inserción actual adopta automáticamente el diseño del proyecto; la configuración pública se guarda en caché hasta un minuto.
En el plugin de WordPress puedes elegir ajustes locales en su lugar. Estos tienen prioridad sobre el diseño del proyecto. El diseño está disponible en todos los planes. En el plan Free, el aviso de Accessonaut sigue visible. Los ajustes de lectura personales de tus visitantes tienen prioridad sobre las indicaciones de diseño.
Ten en cuenta
La biblioteca solo se aplica a los temas que la incluyen. Si usas otros temas de frontend, inclúyela también allí. No pegues el código en bloques con editor de texto: los formatos de texto y el editor pueden eliminar las etiquetas script. También debes vaciar las cachés de páginas, los proxies inversos y las CDN.
Preguntas frecuentes sobre Drupal
¿Tengo que desactivar la agregación de JavaScript?
No. Drupal no combina las bibliotecas externas con otros archivos. La opción «Aggregate JavaScript files» en Configuración → Desarrollo → Rendimiento puede seguir activada.
¿Puedo incluir la biblioteca en una plantilla?
Sí. En lugar de incluirla de forma global en THEMENAME.info.yml, puedes cargarla en una plantilla Twig con {{ attach_library('THEMENAME/accessonaut') }}. Para un widget en todas las páginas, usa una plantilla que utilicen todas ellas. Incluye la biblioteca solo de una de las dos formas.
¿Necesito una inserción aparte para varios idiomas?
No, siempre que todos los idiomas usen el mismo tema. Con data-language="auto", el widget sigue el atributo lang de la página. Habla alemán, inglés y español.
¿Cómo vuelvo a quitar el widget?
Quita la biblioteca de THEMENAME.info.yml y de las plantillas con attach_library. Borra la entrada de THEMENAME.libraries.yml y vacía todas las cachés, por ejemplo con drush cr.
Si algo no funciona
El script no aparece en el código fuente.
Causa: Drupal aún no ha vuelto a leer los archivos YAML modificados, o el nombre en libraries: no coincide con la biblioteca.
Solución: Vacía todas las cachés. Comprueba que la entrada sea exactamente THEMENAME/accessonaut y que la sangría de los archivos YAML sea correcta.
El script se carga, pero sin data-project-id.
Causa: Los atributos no están bajo la entrada del archivo con la dirección de widget.js.
Solución: Coloca attributes justo debajo de la dirección, junto a type: external. Drupal solo traslada al elemento script los valores indicados ahí.
El widget muestra el diseño estándar con el aviso de Accessonaut.
Causa: La web funciona con un dominio distinto del registrado en el proyecto, por ejemplo un entorno de desarrollo.
Solución: Revisa el diseño en el dominio en producción. Para un segundo dominio permanente, crea un proyecto aparte.
Comprueba la instalación
- Abre la web pública en una ventana privada. El widget se muestra exactamente una vez.
- Llega al botón con el teclado. Abre el panel, cambia el tamaño del texto y vuelve a cerrarlo.
- Revisa la página de inicio, una subpágina, un formulario y la vista móvil. El widget no debe tapar ningún control importante.
- En la pestaña Red, comprueba que widget.js y la configuración del proyecto se cargan desde la dirección de tu servicio. Si hay errores, revisa el dominio, el ID del proyecto y la CSP.
- En los proyectos Free, el aviso visible de Accessonaut sigue formando parte del widget. Los permisos dependen de tu proyecto.
Privacidad y límites
Al cargarse, el navegador del visitante obtiene el script y la configuración del proyecto del servicio de Accessonaut. Con ello se tratan la dirección IP, los datos de la solicitud del navegador y el nombre de host de la web. Las preferencias de visualización se guardan localmente en el navegador. Ten en cuenta la integración en tu política de privacidad y revisa tu configuración concreta.
Las ayudas de lectura no garantizan la conformidad. Revisa además las barreras en el código fuente y los recorridos completos de los usuarios, de forma automática y manual.