Paramètres du thème
Les paramètres du thème sont des réglages globaux. Ils s'appliquent à toutes les pages de votre boutique. Cette page présente chaque groupe de Paramètres du thème, dans l'ordre où ils apparaissent dans l'éditeur de thème.
Pour ouvrir les paramètres du thème :
- Accédez à Boutique en ligne (Online Store) → Thèmes (Themes).
- Sur la carte du thème Tenora, sélectionnez Personnaliser (Customize).
- Dans l'éditeur de thème, sélectionnez Paramètres du thème (l'icône d'engrenage).
Les valeurs recommandées ci-dessous sont celles du style prédéfini Tenora, sauf mention contraire.
Logo et favicon
| Paramètre | Rôle | Valeur recommandée |
|---|---|---|
| Logo | L'image du logo dans l'en-tête et sur la page de mot de passe. Sans logo, l'en-tête affiche le nom de votre boutique sous forme de texte. | Un fichier .png transparent ou .svg |
| Largeur du logo | La largeur du logo, de 40 à 300px. | 120px |
| Image du favicon | La petite icône dans l'onglet du navigateur. | Un fichier .png de 32 x 32px |
Conseils
- Dans l'en-tête, le logo ne dépasse jamais 56px de haut. Un logo haut reste compact : un logo large rend donc généralement mieux.
- Le logo utilise le texte alternatif de l'image. Si l'image n'en a pas, le nom de la boutique est utilisé. Ajoutez un texte alternatif au logo dans Contenu (Content) → Fichiers (Files).
- Sans logo, les noms de boutique de plus de 18 caractères s'affichent dans une taille de texte plus petite. Pour un nom de boutique long, nous vous recommandons d'importer un logo.
- Pour afficher une version claire de votre logo sur la bannière avec image, utilisez le paramètre Logo de l'en-tête transparent de la section En-tête.
Couleurs
Combinaisons de couleurs
Une combinaison de couleurs est un ensemble de couleurs que vous appliquez à une section. Tenora propose 5 combinaisons de couleurs. La plupart des sections ont un paramètre Combinaison de couleurs : vous pouvez donc choisir une combinaison différente pour chaque section.
Chaque combinaison de couleurs comprend ces couleurs :
| Couleur | Utilisation |
|---|---|
| Arrière-plan | L'arrière-plan de la section |
| Texte | Les titres, le corps de texte et les icônes |
| Accent | Les liens, les états actifs et les détails des lignes de cote |
| Arrière-plan du bouton | L'arrière-plan des boutons pleins |
| Texte du bouton | Le texte des boutons pleins |
| Texte du bouton à contour | Le texte et la bordure des boutons à contour |
Pour modifier une combinaison de couleurs :
- Accédez à Paramètres du thème → Couleurs.
- Sélectionnez la combinaison de couleurs à modifier.
- Modifiez les couleurs. L'aperçu se met à jour immédiatement.
- Sélectionnez Enregistrer.
Recommandations
- Gardez un rapport de contraste d'au moins 4.5:1 entre Texte et Arrière-plan, ainsi qu'entre Texte du bouton et Arrière-plan du bouton. Toutes les paires de couleurs des trois styles prédéfinis respectent ce niveau (WCAG AA).
- Gardez une combinaison claire pour la plupart des pages et une combinaison sombre pour le pied de page, comme dans les styles prédéfinis.
- Les messages d'erreur et de réussite utilisent la couleur de texte de la combinaison avec une icône colorée : ils restent donc lisibles avec toutes les combinaisons.
Surfaces
| Paramètre | Rôle | Valeur recommandée |
|---|---|---|
| Afficher la texture grain | Ajoute une subtile texture de papier aux arrière-plans. | Activé pour les styles clairs et naturels (Tenora, Terrace). Désactivé pour les styles sombres (Lantern). |
Typographie
Titres
| Paramètre | Rôle | Valeur recommandée |
|---|---|---|
| Police | La police des titres. Choisissez-la dans la bibliothèque de polices Shopify. | Cormorant (Tenora), Fraunces (Terrace), Bodoni Moda (Lantern) |
| Échelle des tailles de titre | Détermine dans quelle mesure chaque niveau de titre est plus grand que le corps de texte. Options : Compacte, Équilibrée, Expressive. | Équilibrée |
| Casse | Par défaut conserve votre texte tel que vous l'avez saisi. Majuscules affiche les titres en lettres capitales. | Par défaut |
Corps de texte
| Paramètre | Rôle | Valeur recommandée |
|---|---|---|
| Police | La police du corps de texte, des boutons et des libellés. | Instrument Sans (Tenora), Work Sans (Terrace), Manrope (Lantern) |
| Taille de police | La taille de texte de base, de 14 à 20px. | 16px |
Conseil : choisissez des polices qui contiennent les caractères de toutes les langues de votre boutique. Certaines polices ne prennent pas en charge tous les alphabets. S'il manque un caractère, le navigateur l'affiche avec une police de secours.
Mise en page
| Paramètre | Rôle | Valeur recommandée |
|---|---|---|
| Largeur de la page | La largeur maximale du contenu. Options : Étroite (1200px), Standard (1440px), Large (1680px). | Standard |
| Marge de la page | L'espace à gauche et à droite de la page, de 16 à 80px. Il se réduit automatiquement sur petit écran. | 48px |
| Espacement des sections | Ajuste les marges intérieures haute et basse de toutes les sections. Options : Compact, Standard, Aéré. | Standard |
| Espacement de la grille | L'espace entre les éléments des grilles, comme les cartes de produit, de 8 à 48px. | 24px |
Boutons
| Paramètre | Rôle | Valeur recommandée |
|---|---|---|
| Arrondi des angles | Arrondit les angles des boutons, de 0 à 40px. 0 donne des angles droits. | 0px (Tenora, Lantern), 24px (Terrace) |
| Épaisseur de la bordure | La largeur de la bordure des boutons à contour, de 1 à 3px. | 1px |
| Casse | Texte des boutons Par défaut ou en Majuscules. | Majuscules (Tenora, Lantern), Par défaut (Terrace) |
Les boutons de paiement de marque, comme Shop Pay, conservent leurs propres couleurs et leur propre style. Le thème ne les modifie pas.
Champs de saisie
Ces paramètres s'appliquent aux champs de formulaire, comme le sélecteur de quantité, le champ d'inscription par e-mail, les champs « Est-ce que ça rentre ? » et les champs du formulaire de contact.
| Paramètre | Rôle | Valeur recommandée |
|---|---|---|
| Arrondi des angles | Arrondit les angles des champs, de 0 à 24px. | Selon le style de vos boutons : 0px avec des boutons carrés, environ 8px avec des boutons arrondis |
| Épaisseur de la bordure | La largeur de la bordure des champs, de 1 à 3px. | 1px |
Cartes de produit et de collection
| Paramètre | Rôle | Valeur recommandée |
|---|---|---|
| Style | L'apparence des cartes de produit. Standard affiche uniquement l'image et le texte. Encadré place la carte sur une surface claire avec une marge intérieure. Échantillon ajoute un onglet d'échantillon de matière à l'image de la carte. | Échantillon (Tenora), Standard (Terrace), Encadré (Lantern) |
| Format de l'image | La forme des images des cartes. Options : Adapter à l'image, Portrait, Carré, Paysage. | Portrait pour les photos de meubles, Carré pour les luminaires et les petits articles |
| Arrondi des angles | Arrondit les angles des cartes, de 0 à 24px. | 0px, ou 8px avec des boutons arrondis |
Conseil : avec Adapter à l'image, chaque carte prend la forme de sa propre image produit. Utilisez cette option uniquement si toutes vos images produit ont la même forme. Sinon, la grille paraît irrégulière.
Format de devise
| Paramètre | Rôle | Valeur recommandée |
|---|---|---|
| Afficher les codes de devise | Affiche les prix avec le code de devise, par exemple « $12.00 USD » au lieu de « $12.00 », sur les pages produit, les cartes de produit, le panier et le tiroir du panier. | Activé si vous vendez dans plusieurs devises qui partagent un symbole, comme USD, CAD et AUD. Sinon, désactivé. |
Le total estimé du panier affiche toujours le code de devise. Pour en savoir plus, consultez Vendre à l'international.
Panier
| Paramètre | Rôle | Valeur recommandée |
|---|---|---|
| Type de panier | Tiroir ouvre le panier dans un panneau latéral lorsqu'un client ajoute un produit ou sélectionne l'icône du panier. Page amène le client sur la page du panier. | Tiroir |
| Afficher la note de commande | Affiche un champ « Ajouter une note à la commande » dans le tiroir du panier et sur la page du panier. Les clients peuvent l'utiliser pour leurs instructions de livraison. | Activé |
Le tiroir du panier a ses propres paramètres. Pour les modifier, ouvrez l'éditeur de thème, sélectionnez la section Tiroir du panier, puis modifiez Combinaison de couleurs ou Afficher les boutons de paiement dynamique.
Recherche
| Paramètre | Rôle | Valeur recommandée |
|---|---|---|
| Activer la recherche prédictive | Affiche des produits, des suggestions, des collections, des pages et des articles pendant que le client tape dans le panneau de recherche. Lorsqu'elle est désactivée, le panneau de recherche fonctionne toujours et ouvre la page des résultats de recherche. | Activé |
| Afficher le prix du produit | Affiche le prix à côté des produits dans la recherche prédictive. Ce paramètre n'est visible que lorsque la recherche prédictive est activée. | Activé |
Réseaux sociaux
Saisissez l'adresse complète de chaque compte de réseau social, par exemple https://www.instagram.com/yourstore. Laissez un champ vide pour masquer l'icône correspondante.
Les comptes disponibles sont : Facebook, Instagram, Pinterest, TikTok, X (Twitter), YouTube, Vimeo, Tumblr et Snapchat.
Les icônes apparaissent :
- dans le bloc Icônes de réseaux sociaux de la section Pied de page
- dans le menu tiroir sur téléphone et tablette
Si aucun compte n'est renseigné, aucune icône ne s'affiche.