Cette fonctionnalité est disponible sur tous les forfaits Goodshuffle Pro.
Aperçu
Vous pouvez renommer les titres Accessoires et Articles alternatifs sur votre galerie Goodshuffle Pro avec le texte de votre choix, comme « Tailles disponibles » ou « S’accorde bien avec ». Il suffit d’ajouter un court script à votre site Squarespace, ce qui prend environ cinq minutes.
C’est utile lorsque les libellés par défaut ne correspondent pas à l’utilisation que vous faites de ces sections. Par exemple, si vous liez différentes tailles d’un linge comme articles alternatifs, « Tailles disponibles » indique clairement à vos clients ce qu’ils regardent.
Avant de commencer
Vérifiez votre forfait Squarespace. L’ajout de scripts nécessite le forfait Core ou supérieur. Si vous êtes sur le forfait Personnel, l’option d’injection de code ne sera pas disponible.
Décidez du texte de chaque titre. Le nouveau libellé s’applique à chaque article de votre galerie, pas seulement à un seul. Si certains articles utilisent Accessoires pour de vrais accessoires (serviettes, chemins de table, assiettes de présentation) et d’autres pour des tailles, choisissez un texte qui convient aux deux, ou laissez le titre tel quel.
Évitez les titres en double. Si un article a à la fois Accessoires et Articles alternatifs, donnez à chacun un libellé différent pour que les clients ne voient pas deux sections avec le même nom.
Note concernant l’assistance : Il s’agit d’une modification de code personnalisée sur votre site Squarespace, donc cela sort du cadre de l’assistance de l’équipe Goodshuffle Pro. Si quelque chose ne va pas, il suffit de retirer le script pour que vos titres reviennent immédiatement aux valeurs par défaut.
Étape 1 : Copier et personnaliser le script
Copiez le script ci-dessous. Ensuite, modifiez le texte à droite de chaque ligne par le libellé souhaité. Gardez les guillemets et la virgule à la fin de la première ligne.
<script>(function () { const LABELS = { 'Accessories': 'Tailles disponibles', 'Alternate Items': 'Autres tailles' }; function relabel() { document.querySelectorAll('.gspro-c-item-detail__related h3').forEach(function (h) { const text = h.textContent.trim(); if (LABELS[text]) h.textContent = LABELS[text]; }); } new MutationObserver(relabel).observe(document.body, { childList: true, subtree: true }); relabel();})();</script>
Vous souhaitez ne changer qu’un seul titre ? Supprimez la ligne de l’autre, et retirez la virgule de la ligne restante. Par exemple :
const LABELS = { 'Alternate Items': 'Tailles disponibles'};
Le texte à gauche doit correspondre exactement au titre actuel, y compris la casse : Accessories ou Alternate Items.
Étape 2 : Ajouter le script à Squarespace
Connectez-vous à Squarespace et ouvrez votre site.
Cliquez sur Site web dans le menu de gauche, faites défiler jusqu’en bas et cliquez sur Outils du site web, puis sur Code personnalisé.
Sur certaines anciennes mises en page, cela se trouve sous Paramètres > Avancé.
Cliquez sur Injection de code.
Collez le script complet, y compris les lignes
<script>et</script>, dans la case Pied de page.Cliquez sur Enregistrer.
Si vous avez déjà d’autres codes dans la case Pied de page, collez le script en dessous. Ne remplacez pas ce qui s’y trouve déjà.
Vous souhaitez appliquer le changement à une seule page ? Au lieu des étapes ci-dessus, allez dans Pages, survolez la page de la galerie, cliquez sur l’icône d’engrenage, ouvrez Avancé et collez le script dans Injection de code d’en-tête de page.
Étape 3 : Vérifiez votre site en ligne
Ouvrez votre site web en ligne dans un nouvel onglet de navigateur. Vous devrez peut-être vous déconnecter de Squarespace ou utiliser une fenêtre privée pour voir ce que voient vos clients.
Actualisez la page et allez dans votre galerie.
Cliquez sur un article qui a des accessoires ou des articles alternatifs et vérifiez que le titre affiche bien votre nouveau texte.
Cliquez sur quelques articles de différentes catégories pour vous assurer que le nouveau libellé est cohérent partout où il apparaît.
Optionnel : Réduire la taille du titre
Si le titre vous semble trop grand, ajoutez ceci dans Site web > Outils du site web > Code personnalisé > CSS personnalisé (ou Design > CSS personnalisé sur les anciennes mises en page) :
gspro-item-detail .gspro-c-item-detail__related h3 { font-size: 1.5rem !important; line-height: 1.2 !important; margin-bottom: 1rem !important;}
Augmentez ou diminuez la valeur 1.5rem jusqu’à ce que le rendu vous convienne. 1rem correspond à environ 16 pixels, donc 1.5rem fait environ 24 pixels. Cela n’affecte que les titres de la section des articles associés, pas les autres titres de votre site.
Dépannage
Le titre n’a pas changé.
Assurez-vous que le texte à gauche de la ligne du libellé correspond exactement au titre actuel, y compris les majuscules.
Vérifiez que vous avez bien collé tout le script, y compris les balises
<script>d’ouverture et de fermeture</script>.Assurez-vous d’avoir cliqué sur Enregistrer dans l’injection de code, puis actualisez votre site en ligne. L’injection de code ne s’affiche pas toujours dans l’aperçu de l’éditeur Squarespace.
Je ne vois pas l’option Injection de code.
Votre site est probablement sur le forfait Personnel de Squarespace, qui n’autorise pas les scripts personnalisés. Vous devrez passer au forfait Core ou supérieur pour utiliser cette fonctionnalité.
Deux sections portent maintenant le même nom.
Donnez des libellés différents à Accessoires et Articles alternatifs dans le script, par exemple « Tailles disponibles » et « Autres tailles ».
Comment annuler cette modification ?
Supprimez le script de l’injection de code et cliquez sur Enregistrer. Vos titres reviendront immédiatement aux valeurs par défaut.
Besoin d’aide supplémentaire ? Cliquez sur la bulle de chat bleue en bas à droite de votre écran pour envoyer un message à notre équipe d’assistance — nous sommes là pour vous aider !
Clause de non-responsabilité : Cet article a été traduit à l’aide de l’IA. Pour toute question ou clarification, contactez-nous via la bulle de chat en bas à droite de votre écran.