Les points clés
- Le moyen le plus simple d’ajouter un bouton est via l’éditeur de thème (Theme Editor) — la plupart des sections ont un bloc bouton intégré que vous pouvez ajouter.
- Pour un placement de bouton personnalisé en dehors des sections existantes, vous aurez besoin de code ou d’un outil IA comme Fudge.
- Lier un bouton à une page, un produit ou une URL externe se fait dans le panneau des paramètres du bouton, dans l’éditeur de thème.
- Les boutons d’ajout au panier “sticky” et les CTA dans le header nécessitent des modifications de code.
Les boutons font partie des demandes de personnalisation les plus courantes sur Shopify. Que vous vouliez un CTA dans votre section hero, un bouton de lien dans une section de contenu, ou un bouton “Acheter maintenant” sticky — voici comment les ajouter.
Pourquoi vous pouvez nous faire confiance
Nous avons créé et personnalisé des centaines de boutiques Shopify. Nous avons aussi développé Fudge — un éditeur de boutique IA noté 5.0 sur le Shopify App Store.
Comment ajouter un bouton dans l’éditeur de thème Shopify
La plupart des sections Shopify prennent nativement en charge les blocs de boutons. C’est la méthode la plus rapide.
Sur le même sujet : Rendre les boutons Shopify plus faciles à cliquer.
Étape 1. Allez dans Boutique en ligne → Thèmes → Personnaliser.
Étape 2. Naviguez jusqu’à la page et la section où vous voulez le bouton.
Étape 3. Cliquez sur la section pour ouvrir ses paramètres. Cherchez un bloc Bouton (Button) ou une option Ajouter un bloc (Add block) dans la barre latérale gauche.
Étape 4. Ajoutez le bloc bouton. Entrez l’étiquette du bouton (le texte affiché) et le lien (où il mène lorsqu’on clique dessus).
Étape 5. Enregistrez.
Si vous ne voyez pas d’option bouton dans une section, c’est que le modèle de cette section n’en inclut pas. Vous devrez soit passer à une section qui en propose, soit ajouter un bouton via du code ou avec Fudge.
Comment lier un bouton à une page sur Shopify
Dans l’éditeur de thème, quand vous cliquez sur un bloc bouton, vous verrez un champ Lien (Link). Vous pouvez le lier à :
- Une page — tapez
/pages/votre-slug-de-pageou utilisez le sélecteur de page - Un produit —
/products/handle-du-produit - Une collection —
/collections/handle-de-collection - Une URL externe — collez l’URL complète
- Une adresse email —
mailto:[email protected]
Le sélecteur de lien de l’éditeur de thème affiche une liste de vos pages, produits et collections, avec une fonction de recherche.
Voir aussi : Ajouter des CTA sur une page de collection Shopify.
Comment ajouter un bouton dans le contenu d’une page Shopify
Si vous modifiez une page classique (Boutique en ligne → Pages) et que vous voulez ajouter un bouton dans le contenu texte :
Étape 1. Cliquez sur l’icône insérer un lien dans la barre d’outils de l’éditeur de page (elle ressemble à un maillon de chaîne).
Étape 2. Entrez le texte de votre lien et l’URL.
Cela crée un texte avec un lien (hypertexte), pas un vrai bouton. Pour lui donner l’apparence d’un bouton, vous devrez appliquer une classe CSS ou utiliser une option de votre thème.
Pour avoir un bouton CTA au design propre au sein du contenu d’une page, il est préférable d’ajouter un bloc bouton via l’éditeur de thème (si votre thème prend en charge les sections sur les pages) plutôt que d’utiliser l’éditeur de page basique.
Comment ajouter un bouton “sticky” sur Shopify
Un bouton d’ajout au panier sticky — qui suit l’utilisateur lorsqu’il scrolle sur une page produit — est un vrai boost de conversion. Cependant, il n’est pas inclus par défaut dans la plupart des thèmes.
Pour en ajouter un, vous avez deux options :
Option 1 — Une application Shopify. Il existe plusieurs apps d’ajout au panier sticky sur l’App Store. C’est la méthode la plus rapide et sans modifier le code.
Option 2 — Du code sur mesure via Fudge. Décrivez ce que vous voulez à Fudge:
“Ajoute une barre d’ajout au panier sticky sur mes pages produits, qui s’affiche quand l’utilisateur scrolle après le bouton d’ajout au panier principal. Affiche le titre du produit, le prix et un bouton d’achat.”
Fudge génère le code et l’ajoute à votre thème sous forme de brouillon. Vous n’avez plus qu’à vérifier et publier.
Sur le même sujet : Ajouter du JavaScript personnalisé sur Shopify.
Comment ajouter un bouton dans le header Shopify
Ajouter un bouton CTA dans le header de votre boutique (ex : “Acheter maintenant” ou “Prendre RDV”) nécessite généralement de modifier la section “header” de votre thème.
Dans l’éditeur de thème : naviguez jusqu’à la section header et vérifiez si elle a un bloc Bouton ou un bloc CTA. Certains thèmes (comme Dawn) l’incluent, d’autres non.
Si votre thème ne prend pas en charge les boutons dans le header nativement, il faudra du code — vous devrez modifier le fichier header.liquid ou la section équivalente pour y ajouter un élément de bouton avec le lien et le design souhaités.
C’est une demande courante. Vous pouvez tout simplement le demander à Fudge : “Ajoute un bouton ‘Démarrer’ sur le côté droit du header, avec un lien vers /pages/contact.”
Sur le même sujet : L’éditeur de Page Fudge.
Comment changer le texte d’un bouton sur Shopify
Le texte du bouton se définit dans l’éditeur de thème lorsque vous ajoutez ou modifiez un bloc de bouton. Cliquez sur le bloc du bouton dans les paramètres de la section et mettez à jour le champ Étiquette.
Pour les boutons qui apparaissent dans les paramètres de langue de votre thème (comme « Ajouter au panier » ou « Acheter maintenant »), allez dans Boutique en ligne → Thèmes → Actions → Modifier les langues. Recherchez l’expression que vous souhaitez modifier et mettez-la à jour à cet endroit. Pour un tutoriel complet, voir comment modifier le texte d’un bouton sur Shopify.
FAQ
Quelle est la différence entre un Bouton d’achat (Buy Button) Shopify et un bouton de l’éditeur de thème ?
Un bouton de l’éditeur de thème est un élément cliquable que vous ajoutez dans les sections de votre vitrine, utilisé pour n’importe quel lien ou CTA. Le Bouton d’achat (Buy Button) est un canal de vente Shopify distinct qui génère un widget intégrable pour vendre des produits Shopify sur des sites externes (un blog ou une page de destination hors Shopify). Utilisez les boutons de l’éditeur de thème à l’intérieur de votre boutique Shopify, et le Bouton d’achat pour vendre à l’extérieur.
Comment ajouter un bouton d’ajout rapide à une grille de collection Shopify ?
Dans les thèmes modernes de la Boutique en ligne 2.0 (Online Store 2.0), ouvrez l’éditeur de thème → modèle de Collections → cliquez sur la section de la grille de produits. Cherchez une option « Ajout rapide » (Quick add) ou « Aperçu rapide » (Quick view) dans les paramètres de la section. Si votre thème n’en comprend pas, vous devrez soit changer de thème, soit l’ajouter via du code personnalisé.
Puis-je ajouter un bouton à une page Shopify sans coder ?
Oui pour les sections qui incluent un bloc de bouton - utilisez simplement l’éditeur de thème. Pour les endroits où le thème n’offre pas de bouton (emplacements personnalisés dans les pages produits, en-têtes, zones de contenu), vous aurez besoin soit de code personnalisé, soit d’un constructeur de pages (page builder), soit d’un outil d’IA comme Fudge qui génère le code à partir d’une description.
Comment changer la couleur ou le style d’un bouton Shopify ?
La plupart des thèmes configurent les couleurs des boutons globalement sous Éditeur de thème → Paramètres du thème → Couleurs ou Boutons. Pour changer le style d’un seul bouton sans affecter le reste, vous aurez besoin d’un bloc Liquid personnalisé (Custom Liquid) avec du CSS inline, ou de modifier le code du thème. Voir comment changer la couleur d’un bouton sur Shopify pour le tutoriel complet.
Qu’est-ce que le bouton « Suivre sur Shop » (Follow on Shop) de Shopify ?
C’est un bouton séparé que vous pouvez ajouter au pied de page de votre boutique, et qui permet aux visiteurs de suivre votre marque dans l’application Shop de Shopify. L’ajout se fait via Boutique en ligne → Thèmes → puis en trouvant les paramètres de la section Follow on Shop. Cela n’a rien à voir avec les boutons de l’éditeur de thème ou le canal Bouton d’achat.
