Pour ajouter le widget d’accessibilité Wawsome à n’importe quel site, collez une ligne de code dans le head de chaque page. La plupart des plateformes ont un endroit prévu pour ça, comme un champ de code personnalisé ou un fichier de mise en page commun. Vous pouvez aussi l’ajouter avec Google Tag Manager.
Avant de commencer
Récupérez votre code dans le tableau de bord Wawsome : ouvrez Websites, choisissez votre site, cliquez sur Install Widget, puis sur Copy code dans la fenêtre Connect Widget. Il ressemble à ceci, avec votre propre clé :
<script src="https://loader.wawsome.com" data-api-key="YOUR_API_KEY" defer></script>
Où coller le code
Le code doit se charger sur chaque page. Choisissez l’option qui correspond à votre site :
- Votre plateforme a un réglage pour du code personnalisé. Cherchez des noms comme Custom code, Injection de code, Head code ou Scripts. S’il existe un champ pour le head, collez-y le code.
- Vous modifiez le HTML vous-même. Collez le code dans
<head>, dans le template ou le fichier de mise en page commun à toutes les pages. Sur un site statique, ajoutez-le à chaque page. - Vous utilisez Google Tag Manager. Ajoutez-le comme balise HTML personnalisé avec le déclencheur All Pages. Consultez notre guide Google Tag Manager.
- Votre plateforme n’accepte que du JavaScript. Utilisez cette version et remplacez YOUR_API_KEY par votre clé :
(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);
})();
Guides pas à pas pour les plateformes populaires : WordPress, Shopify, Wix, Squarespace, Webflow, Joomla, Drupal, PrestaShop, Magento.
Vérifier que tout fonctionne
Publiez ou enregistrez vos modifications et videz les caches. Ouvrez votre site dans une fenêtre de navigation privée et cherchez le bouton Wawsome. Ouvrez-le et testez un réglage.
Si le widget n’apparaît pas
- Cache. Videz le cache de votre site et de votre CDN, puis rechargez.
- Le code a été supprimé. Certains éditeurs suppriment les balises script des champs de contenu. Utilisez plutôt un réglage de code ou un fichier de template.
- Content Security Policy. Si votre site a une CSP, autorisez
https://*.wawsome.comdans script-src et connect-src. - Mauvaise clé ou mauvais domaine. Vérifiez que la clé correspond au site ajouté dans le tableau de bord.
Ce que le widget corrige, et ce qu’il ne corrige pas
- Vos visiteurs adaptent le texte, les couleurs, l’espacement et la navigation, et utilisent des outils de lecture.
- L’IA ajoute un texte alternatif aux images qui n’en ont pas, et vous pouvez modifier chaque description.
- Certains problèmes se corrigent dans votre code ou vos contenus. Un scan les trouve, et nos experts peuvent tester votre site à la main.
En savoir plus : Lancer un scan gratuit · Audit d’accessibilité · Widget d’accessibilité
FAQ
Où exactement dois-je coller le code ?
Dans le head de chaque page, comme l’indique le tableau de bord Wawsome. Si votre plateforme n’a qu’un champ pour le pied de page, cela fonctionne aussi.
Est-ce que ça marche avec les CMS headless et les applications monopage ?
Oui. Wawsome fonctionne avec les contenus chargés par API et les frameworks modernes. Ajoutez le code au fichier HTML principal ou à la mise en page utilisée par toutes les routes.
Ma plateforme n’est pas dans la liste. Puis-je utiliser Wawsome ?
Oui. Si votre plateforme permet d’ajouter du code sur chaque page, vous pouvez ajouter Wawsome. Suivez les étapes ci-dessus, ou écrivez-nous et nous vous aiderons.
Lancez-vous avec Wawsome
Rendez votre site plus simple à utiliser pour tous vos visiteurs. Commencez votre essai gratuit, ou réservez une démo et nous vous montrons comment Wawsome fonctionne.
Commencer l’essai gratuit ou réserver une démo (s’ouvre dans un nouvel onglet).