Formation « Développer des blocs Gutenberg sur mesure avec React »

Utiliser l’Interactivity API de WordPress afin d’abandonner jQuery

Lecture : 11 minutes • 4 premium

L’interactivity API est un script JS créé par WordPress qui permet d’écrire du JavaScript plus moderne et plus facile à maintenir qu’avec jQuery et qui ne nécessite pas de compilation, contrairement à React. Il propose une manière originale de gérer le DOM et l’interactivité de vos pages.

verrouillé Cours Premium

Ce cours est hyper intéressant !
Mais il est réservé aux détenteurs d’une offre premium.

Envie de nous rejoindre ?

Choisissez votre formule

4

Questions, réponses et commentaires

  1. Sonia Margollé

    Le 20 novembre 2025

    Bonjour, merci d’abord pour ces cours très détaillés.

    Par contre attention, en voulant réduire (ne pas mettre de bouton à l’intérieur du li ), ce n’est pas du tout ok niveau accessibilité !

    Ajouter « role=’button' » ce n’est qu’une indication, comme un autocollant, ça ne rend pas la balise li interactive. Elle ne peut pas recevoir le focus (pour cela il faudrait ajouter un tabindex= »0″) et elle n’est pas activable autrement qu’avec la souris. Même avec le tabindex, ça ne serait pas activable non plus, il faudrait ajouter des écouteurs pour déclencher l’action via la touche entrée et espace (avec des subtilités en plus).

    Utiliser un vrai bouton à l’intérieur de l’élément de liste et là ça sera accessible (car activer un bouton avec le clavier, déclenche l’évènement « click » que l’on peut du coup écouter en JS)

    Si une balise html existe pour un rôle précis, il vaut mieux toujours l’utiliser, au risque sinon de créer des problèmes d’accessibilité.

    🙂

    1. Maxime BJ

      Le 20 novembre 2025

      Le problème des boutons c’est qu’ils ont parfois des styles résiduels sur les mobiles, mais tu as parfaitement raison sur le principe de l’accessibilité. J’ai usé un peu de flemme pour cet exemple je t’avoue.

      1. Sonia Margollé

        Le 21 novembre 2025

        Mieux vaut quelques styles résiduels à corriger avec 2/3 !important qu’un élément pas utilisable du tout ^^.

        Il faudrait aussi ajouter un attribut aria-pressed= »true » au bouton sélectionné, sinon les utilisateurs de lecteurs d’écrans ne savent pas quel filtre est activé.

        1. Maxime BJ

          Le 21 novembre 2025

          C’est clair ! tu as tout à fait raison. Je prendrai un moment pour refaire cet exemple bien propre ! C’est pas à cause que c’est pas le sujet qu’il faut lésiner sur l’accessibilité.

Seuls les utilisateurs premium peuvent commenter.

Choisissez votre formule !