Insérer un widget personnalisé

Élément de rendu vs sélecteur de contenu

• Élément de rendu = lieu. Exemples de supports : .gsp_full_player, .gsp_button_player, .gsp_circle_player — ou un nœud de mise en page comme #footer-listen.
• Sélecteur de contenu = ce qu'il faut lire. Une ou plusieurs cibles, séparées par des virgules — par exemple #main or #intro,.product-description,#specs.
• classe_parent — lire le parent du montage (pratique lorsque le montage se trouve à l'intérieur du bloc de contenu).
• auto_classe — lire le même emballage que celui dans lequel se trouve le support.
• Exclure la liste — également séparés par des virgules ; ignorer la navigation, les publicités et les commentaires à l’intérieur du contenu sélectionné (par exemple #comments,.ads,.share-buttons).

Règle de base: Le sélecteur de contenu pointe vers le texte que vous contrôlez ; l’élément de rendu pointe vers le support (ou conteneur) vide où le joueur doit apparaître.

Comment écrire l'identifiant, la classe et les virgules

Vous n'avez pas besoin de connaître le HTML en profondeur — retenez deux préfixes, puis assemblez ou supprimez les espaces inutiles avec des virgules :

• id → # - id="footer-listen" → #footer-listen.
• classe → . - class="gsp_button_player" → .gsp_button_player.
• Étiquette uniquement - article, section, h1 (sans préfixe).
• Rassemblez les pièces — Le sélecteur de contenu peut lister plusieurs conteneurs : #intro,.body,#cta-note.
• Pièces de garniture — La liste d'exclusion utilise la même # / . + virgules. Voir Liste d'exclusion et nospeech et le guide d'appel HTML valeurs HTML .
• Les trouver — Cliquez avec le bouton droit sur le bloc dans la page en direct → Inspecter → Copier id / class dans la console avec le préfixe correct.

La voix, la langue et la plupart des paramètres du lecteur Chrome restent conformes au site web. Paramètres lorsque le champ du widget indique Utiliser Global — Le placement n'impose pas de voix personnalisée. Voir Paramètres globaux et personnalisés.

Comment placer un widget personnalisé

1. Vérifiez que le code de connexion au site (ou l'intégration WordPress / CMS) est actif.
2. Ajoutez une monture vide à l'endroit où le joueur doit apparaître — par exemple <div class="gsp_button_player"></div> Dans le pied de page ou la barre latérale : HTML personnalisé.
3. Dans la console cloud, ouvrez (ou créez) le widget correspondant Plein / Bouton / Cercle et Publier le
4. complet » Élément de rendu à la classe de monture (par exemple .gsp_button_player).
5. complet » Sélecteur de contenu à l'article / au conteneur du produit (ou à plusieurs éléments séparés par des virgules, par exemple #intro,.entry-content). Garder parent_class lorsque le support se trouve à l'intérieur de ce contenu. N'oubliez pas : id → #, class → ..
6. Optionnel: Exclure la liste (séparés par des virgules, identiques) # / . règles) et URL autorisées/bloquées afin que le lecteur n'apparaisse que là où vous le souhaitez.
7. Enregistrez, rechargez la page en direct et vérifiez que le lecteur apparaît bien à l'emplacement personnalisé tout en lisant le contenu approprié.

Dispositions courantes

• bouton d'écoute dans la barre latérale — Élément de rendu .gsp_button_player dans la barre latérale ; Sélecteur de contenu article or .entry-content.
• Bande de pied de page — Montage dans le modèle de pied de page ; le sélecteur de contenu cible toujours l’article principal, donc le chrome du pied de page n’est pas pris en compte.
• Générateur de HTML personnalisé — mêmes points de fixation sur les blocs de code personnalisé/HTML Wix/Shopify/Squarspace ; mapper les classes exactement comme dans le Guide HTML.