WordPress : Customizer Obtenir des choix de contrôle lors du changement

Publié par Jean-Michel le

J’ai un customiseur RadioControl avec 3 choix : menu-left, menu-right, menu-top. Je souhaite que le paramètre choisi soit ajouté au corps en tant que classe, tandis que les autres sont supprimés.

Exemple

<body class="class1 menu-left">va devenir<body class="class1 menu-right">

Pour ce faire, je veux lire les choix dynamiquement dans l’aperçu. Pourtant, le wp.customize.controlne fonctionne pas dans un script mis en file d’attente dans customize_preview_init-action.

J’aimerais bien:

const choices = Object.keys(wp.customize( controlKey ).params.choices).join(" ");

Comment puis-je lire les choix disponibles dans les commandes en aperçu ?

Solution n°1 trouvée

Comme il s’agit d’une classe et que vous devez supprimer l’ancienne valeur et ajouter la nouvelle valeur, vous devez envoyer ces informations à l’aperçu. J’ai utilisé un tas de cases à cocher, mais ce serait le même problème pour les entrées radio ou une sélection. Connaître uniquement la nouvelle valeur ne suffit pas.

J’ai écrit du javascript pour mon contrôle pour le volet de contrôle qui a initialisé le contrôle avec un champ contenant toutes les valeurs possibles (envoyées en tant que json en PHP). Ensuite, chaque fois que l’utilisateur choisit, la valeur du paramètre est mise à jour pour contenir les valeurs off, un séparateur et les valeurs on. Comme je faisais ça aussi pour les cours, j’ai juste utilisé une virgule.

Ensuite, dans le script de prévisualisation, la valeur unique est divisée sur le séparateur et les off sont utilisées avec removeClass() et les on sont utilisées avec addClass().

Vous pouvez voir le code complet ici : https://wordpress.org/themes/twenty8teen

Catégories : Wordpress

Jean-Michel

Jean-Michel est en charge de la partie blog du site. Il met en place la stratégie de contenu et répond aux questions fréquentes sur Wordpress.

0 commentaire

Laisser un commentaire

Avatar placeholder

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *