Skip to main content
Tutoriales
Cómo añadir un widget de accesibilidad a cualquier web
Publicado
November 4, 2026
tiempo de lectura

Cómo añadir un widget de accesibilidad a cualquier web

¿Está su sitio web en riesgo?

Escaneo exitoso
¡Uy! Algo salió mal al enviar el formulario.
Al hacer clic en Escanear ahora, confirmas que estás de acuerdo con nuestra Condiciones de servicio.

Para añadir el widget de accesibilidad de Wawsome a cualquier web, pega una línea de código en el head de cada página. La mayoría de plataformas tienen un sitio para esto, como un campo de código propio o un archivo de diseño compartido. También puedes añadirlo con Google Tag Manager.

‍

Antes de empezar

‍

Copia tu código del panel de Wawsome: entra en Websites, elige tu web, haz clic en Install Widget y luego en Copy code en la ventana Connect Widget. Se ve así, con tu propia clave:

‍

<script src="https://loader.wawsome.com" data-api-key="YOUR_API_KEY" defer></script>

‍

Panel de Wawsome, ventana Connect Widget con el código de instalación y el botón Copy code

‍

Dónde pegar el código

‍

El código tiene que cargarse en cada página. Elige la opción que encaja con tu web:

‍

  • Tu plataforma tiene un ajuste para código propio. Busca nombres como Custom code, Inserción de código, Head code o Scripts. Si hay un campo para el head, pégalo ahí.
  • Editas tú el HTML. Pega el código dentro de <head> en la plantilla o el archivo de diseño que comparten todas las páginas. En una web estática, añádelo a cada página.
  • Usas Google Tag Manager. Añádelo como etiqueta de HTML personalizado con el activador All Pages. Mira nuestra guía de Google Tag Manager.
  • Tu plataforma solo acepta JavaScript. Usa esta versión y cambia YOUR_API_KEY por tu clave:

‍

(function () {
  var s = document.createElement('script');
  s.src = 'https://loader.wawsome.com';
  s.setAttribute('data-api-key', 'YOUR_API_KEY');
  s.defer = true;
  document.body.appendChild(s);
})();

‍

Guías paso a paso para las plataformas más usadas: WordPress, Shopify, Wix, Squarespace, Webflow, Joomla, Drupal, PrestaShop, Magento.

‍

Comprueba que funciona

‍

Publica o guarda los cambios y vacía las cachés. Abre tu web en una ventana privada y busca el botón de Wawsome. Ábrelo y prueba un ajuste.

‍

Si el widget no aparece

‍

  • Caché. Vacía la caché de tu web y de tu CDN, y recarga.
  • El código se borró. Algunos editores borran las etiquetas script de los campos de contenido. Usa mejor un ajuste de código o un archivo de plantilla.
  • Content Security Policy. Si tu web tiene una CSP, permite https://*.wawsome.com en script-src y connect-src.
  • Clave o dominio incorrectos. Revisa que la clave coincida con la web que añadiste en el panel.

‍

Qué corrige el widget y qué no

‍

  • Tus visitantes adaptan el texto, los colores, el espaciado y la navegación, y usan herramientas de lectura.
  • La IA añade texto alternativo a las imágenes que no lo tienen, y puedes editar cada descripción.
  • Algunos problemas se corrigen en tu código o tu contenido. Un escaneo los encuentra, y nuestros expertos pueden probar tu web a mano.

‍

Más información: Haz un escaneo gratis · Auditoría de accesibilidad · Widget de accesibilidad

‍

Preguntas frecuentes (FAQ)

‍

¿Dónde pego exactamente el código?

‍

En el head de cada página, como indica el panel de Wawsome. Si tu plataforma solo tiene un campo para el pie de página, también funciona.

‍

¿Funciona con CMS headless y aplicaciones de una sola página?

‍

Sí. Wawsome funciona con contenido cargado por API y con frameworks modernos. Añade el código al archivo HTML principal o al diseño que usan todas las rutas.

‍

Mi plataforma no está en la lista. ¿Puedo usar Wawsome?

‍

Sí. Si tu plataforma te deja añadir código propio en cada página, puedes añadir Wawsome. Sigue los pasos de arriba, o escríbenos y te ayudamos.

‍

Empieza con Wawsome

‍

Haz que tu web sea más fácil de usar para todos tus visitantes. Empieza tu prueba gratis, o reserva una demo y te enseñamos cómo funciona Wawsome.

‍

Empieza tu prueba gratis o reserva una demo (se abre en una pestaña nueva).