Paramètres de thème

Vous pouvez utiliser les paramètres de thème pour modifier la typographie, les couleurs, les liens de médias sociaux et les paramètres de paiement de votre boutique en ligne.

Vous pouvez utiliser les paramètres de thème pour modifier la typographie, les couleurs, les liens de médias sociaux et les paramètres de paiement de votre boutique en ligne. Lorsque vous modifiez les paramètres de votre thème, les changements s’appliquent à la totalité de votre boutique en ligne.

Vous pouvez ajouter le logo de votre entreprise à votre boutique en ligne. Votre logo s’affiche aux endroits suivants :

  • dans votre en-tête, sur toutes les pages
  • sur votre page de mot de passe

La largeur des images de logo ne doit pas dépasser 300 px.

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Logo.
  3. Dans la zone Logo, cliquez sur Sélectionner une image, puis effectuez l'une des opérations suivantes :

    • Pour utiliser une image que vous avez déjà importée dans votre interface administrateur Shopify, cliquez sur l’image pour la sélectionner, puis cliquez sur Sélectionner.
    • Pour utiliser une image de votre ordinateur local, cliquez sur Mettre en ligne. Choisissez une image sur votre ordinateur et cliquez sur Ouvrir pour lancer la mise en ligne. Elle sera automatiquement sélectionnée une fois la mise en ligne terminée. Cliquez sur Sélectionner.
    • Pour sélectionner une image gratuite, cliquez sur Images gratuites puis recherchez une image ou cliquez dessus pour la sélectionner.
  4. Ajoutez du texte alternatif à l’image de votre logo :

    1. Cliquez sur Modifier le texte alternatif.
    2. Dans la fenêtre Modifier l’image, saisissez une brève description de l’image.
    3. Cliquez sur Save (Enregistrer).
  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Logo.
  3. Dans la zone Largeur du logo sur ordinateur, déplacez le curseur jusqu’à la largeur de pixel que vous souhaitez.

Favicon

Vous pouvez ajouter une icône de favoris ou un favicon qui peut vous aider à personnaliser votre boutique en ligne. Un favicon apparaît dans les endroits suivants :

  • l'onglet de votre navigateur web
  • l'historique de votre navigateur web
  • les icônes présentes sur votre bureau
  • en regard du nom de votre boutique en ligne lorsqu'il est marqué d'un signet

En savoir plus sur les favicons.

Personnaliser votre favicon

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Logo.
  3. Dans la zone Image de favicon, cliquez sur Select image (Sélectionner une image), puis effectuez l’une des opérations suivantes :

    • Pour utiliser une image que vous avez déjà importée dans votre interface administrateur Shopify, cliquez sur l’image pour la sélectionner, puis cliquez sur Sélectionner.
    • Pour utiliser une image de votre ordinateur local, cliquez sur Mettre en ligne. Choisissez une image sur votre ordinateur et cliquez sur Ouvrir pour lancer la mise en ligne. Elle sera automatiquement sélectionnée une fois la mise en ligne terminée. Cliquez sur Sélectionner.
    • Pour sélectionner une image gratuite, cliquez sur Images gratuites puis recherchez une image ou cliquez dessus pour la sélectionner.
  4. Ajoutez du texte alternatif à votre image favicon :

    1. Cliquez sur Modifier le texte alternatif.
    2. Dans la fenêtre Modifier l’image, saisissez une brève description de l’image.
    3. Cliquez sur Save (Enregistrer).

Informations sur la marque

Vous pouvez inclure des informations à propos de votre marque. Vous pouvez ajouter le bloc d’informations sur la marque dans votre pied de page.

Personnaliser les informations relatives à votre marque

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Informations sur la marque.
  3. Saisissez un titre.
  4. Saisissez une description.
  5. Cliquez sur Sélectionner une image, puis effectuez l’une des actions suivantes :

    • Pour utiliser une image que vous avez déjà importée dans votre interface administrateur Shopify, cliquez sur l’image pour la sélectionner, puis cliquez sur Sélectionner.
    • Pour utiliser une image de votre ordinateur local, cliquez sur Mettre en ligne. Choisissez une image sur votre ordinateur et cliquez sur Ouvrir pour lancer la mise en ligne. Elle sera automatiquement sélectionnée une fois la mise en ligne terminée. Cliquez sur Sélectionner.
    • Pour sélectionner une image gratuite, cliquez sur Images gratuites puis recherchez une image ou cliquez dessus pour la sélectionner.
  6. Dans la zone Largeur de l’image, déplacez le curseur jusqu’à la largeur de pixel que vous souhaitez.

Couleurs

Vous pouvez définir des nuanciers de couleurs primaires et secondaires pour votre boutique en ligne.

Personnaliser vos paramètres de couleur

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Couleurs.
  3. Pour ouvrir le sélectionneur de couleurs, cliquez sur l’échantillon de couleur pour indiquer la couleur du type de contenu que vous souhaitez modifier.

  4. Cliquez sur Save (Enregistrer).

Pour en savoir plus sur les options de couleurs, y compris sur la façon de définir des dégradés de couleur, consultez_Nuanciers de couleurs_.

Typographie

Vous pouvez définir le style et la taille de la police pour le texte de votre boutique en ligne. Vous pouvez choisir une police système ou une police personnalisée.

Il est conseillé d’utiliser les polices système dans votre boutique. L’utilisation de telles polices évite de télécharger de nouvelles polices sur l’ordinateur de vos client(e)s, ce qui peut avoir une incidence négative sur la vitesse de chargement de votre boutique. La police qui s’affiche sur l’ordinateur de vos client(e)s dépend de leur système d’exploitation.

Personnaliser vos paramètres de typographie

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Typographie.
  3. Pour chaque type de texte, cliquez sur Change (Modifier) pour utiliser le sélecteur de polices.
  4. Explorez les polices disponibles avec le champ de recherche ou en cliquant sur Charger plus.
  5. Cliquez sur le nom de la police que vous souhaitez utiliser, puis sur Sélectionner.
  6. Cliquez sur Save (Enregistrer).

Personnaliser les tailles de polices

Vous pouvez définir les tailles de police par défaut de votre titre et du corps du texte dans le paramètre du thème Typography.

Étapes

  1. Cliquez sur Paramètres du thème > Typography.
  2. Pour modifier la taille de police par défaut des titres, utilisez l’échelle de taille de police pour sélectionner la taille par défaut. La taille minimum de police est de 100 %, et la taille maximale de police est de 150 %. Chaque incrément de l’échelle augmente la taille de la police de 5 %. Le paramètre par défaut est de 100 %.
  3. Pour modifier la taille de police par défaut du corps du texte, utilisez l’échelle de taille de police pour sélectionner la taille par défaut. La taille minimum de police est de 100 %, et la taille maximale de police est de 130 %. Chaque incrément de l’échelle augmente la taille de la police de 5 %. Le paramètre par défaut est de 100 %.
  4. Cliquez sur Save (Enregistrer).

Mise en page

La mise en page vous permet de définir la largeur maximale de l'affichage de votre boutique en ligne.

  1. Cliquez sur Paramètres du thème > Mise en page.
  2. Utilisez le curseur de plage pour choisir entre une largeur de 1 000 px ou 1 600 px pour la page. Le paramètre par défaut est de 1 600 px.
  3. [Facultatif] Ajoutez de l’espace vertical entre les sections avec le curseur de plage. Vous pouvez ajouter jusqu'à 100 px entre les sections.
  4. [Facultatif] Si vous avez une disposition en grille, utilisez le curseur de plage pour ajouter des espaces horizontaux et des espaces verticaux entre le contenu de la grille. L’ajout d’un espace horizontal ajoute au maximum 40 px d’espace à vos rangées. L’ajout d’un espace vertical ajoute au maximum 40 px d’espace à vos colonnes.
  5. Cliquez sur Save (Enregistrer).

Bordures et ombres

Vous pouvez ajuster les bordures et les ombres de certains types de contenu interactif, tels que les boutons, les variantes ou les entrées de quantité.

Les options personnalisables pour les bordures sont les suivantes :

  • Épaisseur, qui modifie le contour de l’article.
  • Opacité, qui définit la visibilité du contour de l’article.
  • Rayon de coin, qui arrondit les coins de vos articles.

Les options pour les ombres sont les suivantes :

  • Opacité modifie la visibilité de l’ombre de l’article. Une opacité d’ombre de 0 % supprime entièrement l’ombre de l’article.
  • Les curseurs de plage de décalage horizontaux ou verticaux déplacent l’emplacement de l’ombre autour de l’article.
  • Utilisez le curseur de plage Flou pour modifier l’opacité de l’ombre de l’article.

Boutons

Vous pouvez personnaliser les paramètres des boutons d’appel à l’action sur votre boutique en ligne en ajoutant des ombres, en modifiant l’espacement ou l’opacité, et en ajustant la forme de vos boutons.

Exemple de boutique en ligne avec bouton d’appel à l’action

Personnaliser les boutons

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Boutons.
  3. Utilisez les échelles coulissantes pour modifier l'apparence de votre bouton Bordure.
  4. Utilisez les échelles coulissantes pour changer le bouton Ombre. Définir l'opacité de l'ombre sur 0 % supprime l'ombre.
  5. Cliquez sur Save (Enregistrer).

Boutons pilules de variante

Les pilules de variantes vous permettent d’afficher les variantes d’un produit sur une page de produit ou une section de produit en vedette. Les client(e)s peuvent sélectionner la variante souhaitée pour ajouter le produit à leur panier sans avoir à modifier les pages de produits.

Exemple de boutique en ligne avec des pilules de variante sélectionnables

Personnalisation des pilules de variantes

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Boutons pilules.
  3. Utilisez les curseurs pour modifier l’apparence de votre bouton pilule Bordure de variante.
  4. Utilisez les échelles coulissantes pour changer la variante du bouton pilule Ombre. Définir l'opacité de l'ombre sur 0 % supprime l'ombre.
  5. Cliquez sur Save (Enregistrer).

Entrées

Les entrées sont des zones interactives, qui nécessitent une entrée client(e), par exemple un sélecteur de quantité, un formulaire d’inscription à la liste de diffusion ou des notes de panier. Vous pouvez ajuster l’apparence des entrées de votre boutique en ligne dans les paramètres de thème.

Exemple de boutique en ligne avec entrée de quantité

Personnalisation des entrées

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Entrées.
  3. Utilisez les curseurs pour modifier l'apparence de votre entrée Bordure.
  4. Utilisez les curseurs pour modifier l’entrée Ombre. Définir l’opacité de l’ombre sur 0 % supprime l’ombre.
  5. Cliquez sur Save (Enregistrer).

Cartes

Les cartes sont des zones réparties en sections, qui vous permettent d’afficher plusieurs éléments, tels que des cartes de produits, des cartes de blog, des cartes de collection ou des cartes de collage. Vous pouvez personnaliser la forme, le style, la couleur, l’alignement et le remplissage des images de vos cartes de section.

Personnalisation des cartes

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Cartes.
  3. Utilisez le menu déroulant pour choisir un Style de carte.
  4. Ajoutez le Remplissage de l’image avec le curseur. Cela ajoute de l’espace autour des images de vos cartes.
  5. Utilisez le menu déroulant pour définir l'Alignement du texte de vos cartes. Choisissez entre gauche, centre (par défaut) ou droite.
  6. Utilisez le menu déroulant pour sélectionner un Nuancier de couleurs pour vos cartes.
  7. Utilisez les curseurs pour modifier l'apparence de votre carte Bordure.
  8. Utilisez les curseurs pour changer la carte Ombre. Définir l'opacité de l'ombre sur 0 % supprime l'ombre.
  9. Cliquez sur Save (Enregistrer).

Conteneurs de contenu

Les conteneurs constituent la partie de texte des sections de contenu, par exemple, la zone de texte d’un diaporama, une bannière avec image ou les colonnes des sections multicolonnes. Vous pouvez personnaliser l’apparence des conteneurs de contenu de votre boutique en ligne.

Personnalisation des conteneurs de contenu

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Contenants de contenu.
  3. Utilisez les curseurs pour modifier l’apparence de la Bordure de votre contenant de contenu.
  4. Utilisez les curseurs pour changer le contenu du récipient Ombre. Définir l'opacité de l'ombre sur 0 % supprime l'ombre.
  5. Cliquez sur Save (Enregistrer).

Support multimédia

Le support multimédia est l’élément visuel des sections, par exemple, le support multimédia du produit ou l’image dans les sections « Image avec texte ». Vous pouvez ajouter des bordures et des ombres à vos supports multimédia.

Personnalisation du support multimédia

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Média.
  3. Utilisez les curseurs pour modifier l'apparence de votre média Bordure.
  4. Utilisez les curseurs pour changer le média Ombre. Définir l'opacité de l'ombre sur 0 % supprime l'ombre.
  5. Cliquez sur Save (Enregistrer).

Menus déroulants et pop-ups

Ajustez l’apparence des menus de navigation déroulants, des fenêtres modales pop-up et des fenêtres pop-up de panier.

Personnalisation des menus déroulants et des fenêtres pop-ups

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Menus déroulants et fenêtres pop-ups.
  3. Utilisez les curseurs pour modifier l'apparence de votre Bordure.
  4. Utilisez les curseurs pour changer l'Ombre. Définir l'opacité de l'ombre sur 0 % supprime l'ombre.
  5. Cliquez sur Save (Enregistrer).

Tiroirs

Les tiroirs sont des contenants interactifs masqués, qui apparaissent et disparaissent lorsque l'on appuie ou clique sur un menu de navigation réductible ou des options de filtre, par exemple.

Personnalisation des tiroirs

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Tiroirs.
  3. Utilisez les curseurs pour modifier l'apparence de votre Bordure.
  4. Utilisez les curseurs pour changer l'Ombre. Définir l'opacité de l'ombre sur 0 % supprime l'ombre.
  5. Cliquez sur Save (Enregistrer).

Badges

Les badges En solde (ou Promo) et Épuisé sont automatiquement ajoutés aux images de vos produits lorsque leur prix descend ou lorsque l'inventaire atteint 0. Vous pouvez ajuster la position, la forme et la couleur de vos badges.

Exemple de boutique en ligne avec des badges promotion et épuisé

Les badges Page et Blog apparaissent sur les résultats de recherche pertinents. Vous pouvez personnaliser la position et la forme de ces badges, mais pas la couleur.

Personnalisation des badges

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Badges.
  3. Utilisez le menu déroulant pour sélectionner la position du badge dans les cartes de produit. Choisissez entre en haut à gauche, en haut à droite, en bas à gauche (par défaut) ou en bas à droite.
  4. Ajoutez des coins arrondis avec le rayon de coin. Définir le rayon de coin sur 0 px produit des bords de badge carrés et l’augmentation du rayon arrondit les bords des badges.
  5. Choisissez un Nuancier de couleurs pour vos badges. Vous pouvez définir un autre nuancier de couleur pour les articles épuisés.
  6. Cliquez sur Save (Enregistrer).

Icônes

Les icônes sont de petites images, qui peuvent être ajoutées à certaines sections ou blocs. Définissez les nuanciers de couleurs de vos icônes dans les paramètres de thème.

Exemple de boutique en ligne avec des icônes en rangées réductibles

Personnalisation des icônes

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Icônes
  3. Utilisez le menu déroulant pour sélectionner la couleur par défaut de vos icônes. Choisissez entre Accent 1, Accent 2, le bouton en relief ou la couleur du texte pour les icônes de votre boutique.
  4. Cliquez sur Save (Enregistrer).

Médias sociaux

Vous pouvez ajouter des boutons de partage social à vos produits et vos articles de blog, ainsi que des liens vers vos comptes de médias sociaux. Les liens vers vos comptes de médias sociaux s'affichent dans le pied de page de votre boutique en ligne.

Personnaliser vos paramètres de médias sociaux

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur Médias sociaux
  3. Pour ajouter des liens vers vos comptes de médias sociaux, saisissez-les dans les champs fournis sous Comptes. Entrez les liens complets, par exemple : https://instagram.com/shopify ou https://twitter.com/shopify.
  4. Cliquez sur Save (Enregistrer).

Comportement de recherche

La boutique en ligne comprend la recherche prédictive, qui indique les suggestions de produits lorsque les client(e)s commencent à taper dans le champ de recherche. Les suggestions de recherche peuvent aider les client(e)s à formuler et affiner leurs recherches, et leur offrir de nouvelles façons d’explorer une boutique en ligne. Elles peuvent également permettre aux client(e)s de parcourir rapidement les résultats sans avoir à quitter leur page actuelle pour voir une liste distincte de résultats de recherche.

Vous pouvez personnaliser les paramètres suivants pour la recherche :

  • Activer les suggestions de recherche – Activez ou désactivez les suggestions de recherche.
  • Afficher le fournisseur du produit : affichez ou masquez les fournisseurs de produits dans les suggestions de recherche.
  • Afficher le prix du produit : affichez ou masquez les prix des produits dans les suggestions de recherche.

Modifier les paramètres d’entrée de recherche

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquer sur Entrée de recherche
  3. Utilisez les paramètres pour personnaliser le comportement de recherche de la boutique.
  4. Cliquez sur Save (Enregistrer).

Pour en savoir plus sur le fonctionnement des suggestions de recherche, voir Recherche prédictive.

Format de devise

Vous pouvez choisir que les prix des produits, du panier et de la page de paiement indiquent toujours des codes de devise.

  1. Cliquez sur Theme settings (Paramètres du thème).
  2. Cliquez sur le format de la devise.
  3. Pour activer les codes de devise, cliquez sur la case à cocher Afficher les codes de devise.
  4. Cliquez sur Save (Enregistrer).

Panier

Vous pouvez modifier le style du panier sur votre boutique en ligne. Lorsqu’un(e) client(e) ajoute un produit de votre boutique à son panier, celui-ci peut apparaître en tant que tiroir, page ou notification pop-up. Lorsque le panier du/de la client(e) est vide, vous pouvez afficher une collection en vedette sur le tiroir du panier.

Étapes

  1. Cliquez sur Paramètres de thème > Panier.
  2. Utilisez le menu déroulant pour sélectionner un style de panier : tiroir, page ou notification pop-up.
  3. Facultatif : pour afficher le fournisseur des articles dans le panier d’un(e) client(e), cliquez sur Afficher le fournisseur.
  4. Facultatif : pour fournir à votre clientèle une zone pour effectuer des demandes spéciales ou ajouter des informations de commande supplémentaires, sélectionnez l’option Activer la note du panier.

Si le type de panier est Tiroir, vous pouvez afficher une collection dans le tiroir du panier. La collection sélectionnée n’apparaît que lorsque le panier est vide.

Pour ajouter une collection au tiroir du panier vide, cliquez sur Sélectionner une collection. Une fois qu’une collection a été sélectionnée, cliquez sur Modifier pour sélectionner une collection différente ou la retirer du tiroir du panier. Vous pouvez également cliquer sur Créer une collection pour créer une nouvelle collection. Ce bouton vous sort des paramètres du thème et de la zone Collections de votre interface administrateur Shopify.

Paiement

Cette section vous permet de personnaliser la page de paiement de votre boutique. Consultez Page de paiement de Shopify pour plus d’informations sur la page de paiement de votre boutique.

Modifier les styles de thème

Un style de thème est une collection de paramètres choisis par un concepteur de thème. Vous pouvez en appliquer un à votre boutique pour lui donner un aspect soigné. Un style est appliqué à tous les thèmes par défaut. Lorsque vous personnalisez un thème, vous remplacez les paramètres de style de ce thème par les vôtres. Si vous appliquez un style de thème à votre thème, vous modifiez vos paramètres du moment, tels que les couleurs et la typographie.

Étapes

  1. Cliquez sur Paramètres du thème > Style.

  2. À l’aide des menus déroulants, sélectionnez les options de style de votre thème. Les options disponibles dépendent du thème que vous utilisez.

  3. Cliquez sur Save (Enregistrer).

Annuler et rétablir les modifications

Le bouton Annuler inverse votre modification la plus récente, et le bouton Rétablir rajoute une modification que vous avez annulée. Cliquez sur le bouton Annuler plusieurs fois pour continuer à annuler votre travail, un changement à la fois. Les boutons Annuler et Rétablir se trouvent dans la barre d'outils de l'éditeur de thème.

Les boutons Annuler et Rétablir dans la barre d'outils de l'éditeur de thème

Cliquez sur le bouton Annuler pour annuler les modifications suivantes :

  • ajouter, réorganiser et supprimer des sections
  • application de couleurs, de polices et d'autres paramètres dans l'onglet Paramètres du thème
  • réinitialiser un style de thème.

Prêt(e) à commencer à vendre avec Shopify ?

Essayez gratuitement