brooklyn

Brooklyn est un thème sur mesure pour les boutiques de vêtements modernes. Les fonctionnalités comprennent le premier design réactif pour les mobiles, une typographie unique, un diaporama de page d'accueil de bord à bord, une grille de produits dynamique et des pages de produits avec une disponibilité en un coup d'œil pour chaque taille.

Brooklyn est idéal dans les cas suivants :

  • Diaporamas en plein écran
  • Petits menus
  • Plus de 5 produits

Si vous avez une offre de produits plus importante ou si vous souhaitez un thème présentant des images de produits plus volumineuses, essayez Venture, Boundless ou Supply.

Si vous avez moins de 5 produits, essayez Jumpstart.

Procurez-vous Brooklyn depuis la boutique des thèmes de Shopify ›

Pour en savoir plus sur les sections uniques disponibles avec Brooklyn, cliquez sur le bouton Sections. Pour en savoir plus sur les paramètres de thème uniques disponibles pour Brooklyn, notamment les paramètres de couleur, de police et de favicon, cliquez sur le bouton Paramètres du thème. Pour accéder à des conseils et des astuces pour optimiser votre boutique, cliquez sur le bouton Conseils.

Vous pouvez utiliser l'éditeur de thème pour créer du contenu et organiser la mise en page de votre boutique en ligne.

Sections communes

Brooklyn comprend trois sections qui apparaissent sur chaque page de votre boutique :

  • La section du menu Barre latérale , qui glisse depuis la gauche et inclut généralement les liens « Rechercher », « À propos de nous » et « Connexion ».
  • La section En-tête , qui est affichée en haut de la page, inclut généralement votre logo et vos menus de navigation.
  • La section Pied de page , qui est affichée au bas de la page, et comprend généralement des liens pour faire des recherches sur le site, ainsi que le lien À propos de nous, et les informations de copyright.

Vous pouvez modifier les sections de l'en-tête et du menu latéral à partir de n'importe quelle page de l'éditeur de thème. Contrairement à d'autres types de section, l'éditeur de thème affiche les sections de menu d'en-tête et de barre latérale, quelle que soit la page de la boutique que vous consultez dans l'aperçu du thème.

Brooklyn comprend plusieurs paramètres uniques pour le contenu de l'en-tête et du menu de la barre latérale.

Brooklyn comporte un menu de barre latérale qui glisse quand vous cliquez sur l'icône de menu.

  1. Cliquez sur l'onglet Sections.

  2. Cliquez sur le menu Barre latérale.

  3. Dans le menu déroulant Menu principal , sélectionnez un menu supérieur pour le menu de la barre latérale.

  4. Dans le menu déroulant du menu du bas , sélectionnez un bas pour le menu de la barre latérale.

  5. Cliquez sur Enregistrer.

en-tête

Vous pouvez ajouter le logo de votre entreprise à l'en-tête de votre boutique. Vous pouvez utiliser une image de logo personnalisé avec Brooklyn. Le meilleur format est un fichier .png avec un fond transparent. Les images de logo doivent être de 450 x 200 px. Vous pouvez redimensionner l'image du logo en ajustant sa largeur.

Vous pouvez également ajouter un menu et une icône de recherche à l'en-tête de votre boutique.

Pour mettre en ligne un logo personnalisé :

  1. Cliquez sur l'onglet Sections.

  2. Cliquez sur l' en-tête.

  3. Dans la liste déroulante Menu , sélectionnez le menu que vous souhaitez afficher dans l'en-tête.

  4. Dans la zone Logo , cliquez sur Sélectionner une image , puis effectuez l'une des opérations suivantes :

- Pour sélectionner une image que vous avez déjà mise en ligne dans votre interface administrateur Shopify, cliquez sur l'onglet Bibliothèque. - Pour sélectionner une image sur votre ordinateur local, cliquez sur l'onglet Bibliothèque , puis sur le bouton plus.

Si vous utilisez une image de diaporama sur votre page d'accueil, il est possible que votre logo ne soit pas lisible s'il apparaît sur une diapositive sombre :

Si cela se produit, vous pouvez mettre en ligne une autre version de votre logo lorsqu'une image de diaporama sombre figure sur votre page d'accueil. Dans la zone du logo de la page d'accueil , mettez en ligne une version plus claire de votre logo. Idéalement, ce logo devrait être blanc :

Bas de page

Le pied de page de votre boutique est le contenu qui apparaît toujours au bas de chaque page de votre boutique :

Avec Brooklyn, vous pouvez changer le menu affiché.

Personnaliser la section de pied de page :

  1. Cliquez sur l'onglet Sections.

  2. Cliquez sur la section Pied de page.

  3. Dans le menu déroulant du pied de page , sélectionnez le menu que vous souhaitez afficher. Par défaut, le menu Pied de page est sélectionné et il inclut les liens « Rechercher », « À propos de nous » et « Se connecter ».

  4. Cliquez sur Enregistrer.

Diaporama

Brooklyn utilise un diaporama en plein écran ou « bannière large/haute », la meilleure taille pour votre image de diaporama est donc 1 200 px. Brooklyn est un thème réactif, ce qui signifie qu'il ajuste automatiquement la taille de l'image en fonction des écrans d'ordinateur et mobiles. Lorsque vous utilisez un thème réactif comme Brooklyn, il est recommandé de faire ce qui suit :

  • Évitez de placer du texte dans l'image du diaporama, car il peut être coupé lorsque l'image est redimensionnée. Utilisez plutôt un titre et un sous-titre dans chaque diapositive. Lorsque vous ajoutez du texte à un diaporama, vous pouvez choisir un texte clair ou sombre pour qu'il soit lisible sur l'image du diaporama. Vous pouvez également ajouter un bouton pour lier la diapositive à une URL.
  • Certaines grandes images peuvent être découpées en thèmes réactifs. Si votre diaporama contient de grandes images, certaines parties de l'image peuvent ne pas être visibles sur les écrans plus petits. Vous pouvez en apprendre plus sur les meilleures pratiques pour les images de diaporama dans Mettre en ligne des images.

Vous pouvez choisir de faire pivoter les images du diaporama automatiquement en sélectionnant Rotation automatique entre les diapositives , puis en sélectionnant l'intervalle auquel les images changent.

Pour modifier les paramètres du diaporama de votre page d'accueil :

  1. Cliquez sur l'onglet Sections.

  2. Cliquez sur Diaporama.

  3. Dans la zone Contenu , cliquez sur Diapositive.

  4. Dans la zone Image , cliquez sur Sélectionner une image , puis effectuez l'une des opérations suivantes :

- Pour sélectionner une image que vous avez déjà mise en ligne dans votre interface administrateur Shopify, cliquez sur l'onglet Bibliothèque. - Pour sélectionner une image de stock à partir de la collection d'images en stock Burst de Shopify, cliquez sur l'onglet Images gratuites. De là, vous pouvez saisir un terme de recherche ou parcourir les catégories d'images. - Pour sélectionner une image sur votre ordinateur local, cliquez sur l'onglet Bibliothèque , puis sur le bouton plus.

  1. Dans la zone Superposition , sélectionnez la couleur pour la superposition dans le champ Superposition et configurez l'opacité pour la superposition dans le champ Opacité.

  2. Dans les champs de texte Titre et Sous-titre , saisissez le texte qui apparaîtra dans le diaporama.

  3. Si vous souhaitez afficher un bouton qui lie une diapositive à une URL, saisissez le texte qui apparaît sur le bouton dans le champ de texte du bouton , puis collez l'URL dans le champ Lien vers une diapositive.

  1. Si vous souhaitez que les diapositives pivotent automatiquement, cochez la case Rotation automatique entre les diapositives et sélectionnez la fréquence à laquelle vous souhaitez qu'elles pivotent à partir du menu déroulant Les diapositives changent toutes les.

Texte enrichi

Utilisez la section Texte enrichi pour fournir tout contenu écrit que vous souhaitez afficher sur votre page d'accueil ou pour intégrer une page créée dans votre interface administrateur Shopify. Par exemple, vous pouvez présenter de futurs événements en intégrant votre page de blog, ou afficher une page comportant l'un ou l'autre des éléments suivants :

  1. Cliquez sur l'onglet Sections.

  2. Cliquez sur Texte enrichi.

  3. Si vous souhaitez ajouter du texte, cliquez sur Texte enrichi , saisissez votre texte dans le champ Texte. Cliquez sur les icônes en gras ou en italique pour mettre en forme le texte sélectionné.

  4. Si vous souhaitez afficher une page de votre boutique, cliquez sur Ajouter du contenu , puis sur Page. Sélectionnez une page à afficher en tant que page d'accueil dans le menu déroulant.

Liste des collections

Avec Brooklyn, vous pouvez afficher jusqu'à 9 collections sur votre page d'accueil.

  1. Cliquez sur l'onglet Sections.

  2. Cliquez sur Collection.

  3. Sélectionnez une collection à afficher dans le menu déroulant.

  4. Dans la zone Paramètres , saisissez le texte que vous souhaitez afficher au-dessus des collections dans le champ Titre.

  5. Cliquez sur Enregistrer.

Collection en vedette

Avec Brooklyn, vous pouvez présenter des produits de l'une de vos collections sur votre page d'accueil. Vous pouvez choisir une grille ou un affichage de collage pour la collection en vedette sur votre page d'accueil.

  1. Cliquez sur l'onglet Sections.

  2. Cliquez sur Collection en vedette.

  3. Dans le champ Titre , saisissez le texte que vous souhaitez afficher au-dessus de la collection.

  4. Sélectionnez une collection dans le menu déroulant Collection. Jusqu'à 50 produits s'afficheront à partir de la collection que vous sélectionnez.

  5. Dans la liste Style de grille , indiquez si vous souhaitez afficher les images du produit dans une grille ou un collage.

Newsletter

Avec Brooklyn, vous pouvez afficher un formulaire d'inscription à votre newsletter sur votre page d'accueil. Ce type de section n'inclut aucune option ; si vous souhaitez afficher un formulaire de newsletter, laissez la section telle quelle. Si vous ne souhaitez pas afficher un formulaire de newsletter, vous pouvez supprimer la section de votre page d'accueil.

Lorsque quelqu'un s'inscrit à une newsletter, il est ajouté en tant que client à votre boutique. La section Newsletter contient un lien vers la page Clients de votre interface administrateur. Vous pouvez cliquer sur ce lien pour voir une liste à jour de vos clients.

Page de collection

Avec Brooklyn, vous pouvez afficher les produits sur votre page de collection dans un collage ou une grille.

Le style de collage est une caractéristique unique de Brooklyn. Il affiche un mélange d'images de produits plus ou moins grandes, ce qui a pour effet de mettre en évidence des produits aléatoires :

Le style de grille affiche les images de produit au format tableau. Toutes les images de produits sont de la même taille :

  1. Dans l'aperçu de l'éditeur de thème de votre boutique, ouvrez une page de collection.

  2. Cliquez sur l'onglet Sections.

  3. Cliquez sur la page Collection.

  4. Dans la liste Style de grille , sélectionnez Collage ou Grille.

  5. Cochez Afficher les balises de collection pour inclure un lien en haut de la page, qui filtre les résultats du produit par balise de collection :

  6. Cochez Afficher le distributeur du produit pour ajouter le nom du distributeur sous l'image du produit :

  7. Cliquez sur Enregistrer.

Pages Produits

Dans la section Pages de produits , vous pouvez ajouter ou supprimer les éléments suivants :

  • Zoom sur image
  • Icônes de partage social
  • La marque ou le distributeur du produit
  • Un sélecteur de quantité
  • Un bouton de passage à la caisse dynamique

Vous pouvez également définir la manière dont les images s'affichent et modifier la taille des boutons de passage à la caisse dynamique et Ajouter au panier.

Pour modifier les paramètres des pages de produit :

  1. Dans le menu déroulant de la barre supérieure, sélectionnez Pages de produit.

  2. Cliquez sur Sections.

  3. Cliquez sur les pages du produit.

  4. Pour permettre aux clients d'effectuer un zoom en cliquant sur l'image d'un produit, cochez Activer le zoom de l'image.

  5. Pour afficher les icônes de partage social, cochez Activer le partage de produits.

  6. Pour afficher la marque ou le distributeur du produit, cochez Afficher le distributeur du produit. Pour qu'une marque ou un distributeur s'affiche, vous devez ajouter un distributeur au produit.

  7. Pour définir la façon dont les images s'affichent, dans le menu déroulant Affichage d'image , sélectionnez Empiler ou Miniatures. Sélectionnez Empiler pour afficher une colonne d'images en taille réelle. Sélectionnez Miniatures pour afficher une image en taille réelle suivie de miniatures pour toutes les images supplémentaires.

  8. Pour afficher un sélecteur de quantité, effectuez les tâches suivantes :

    1. Cochez Afficher le sélecteur de quantité.
    2. Dans le menu déroulant Type de sélecteur , sélectionnez Bouton ou Menu déroulant.
  9. Pour afficher un bouton de passage à la caisse dynamique, cochez la case Afficher le bouton de passage à la caisse dynamique.

  10. Pour définir la taille du bouton Ajouter au panier et du bouton de passage à la caisse dynamique, dans le menu déroulant Taille du bouton , sélectionnez Petit ou Grand.

  11. Cliquez sur Enregistrer.

Couleurs

Vous pouvez choisir les couleurs pour les différentes parties de votre boutique en ligne.

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

  2. Cliquez sur Couleurs.

  3. Pour chaque type de contenu, cliquez sur l'échantillon de couleur pour utiliser le sélecteur de couleur :

    Le sélecteur de couleurs dans l'éditeur de thème

- La zone Sélection récente affiche les couleurs que vous avez récemment sélectionnées pour votre thème. - La zone En cours d'utilisation affiche les couleurs que vous utilisez actuellement dans d'autres parties de votre thème.

Pour configurer la couleur sur transparent, cliquez sur Aucun.

  1. Cliquez sur Enregistrer.

Typographie

Avec Brooklyn, vous pouvez changer la police et la taille de police du texte de votre boutique.

Définir les options de typographie :

  1. Cliquez sur Personnaliser.

  2. Cliquez sur Paramètres du thème.

  3. Cliquez sur Typographie.

  4. Dans la section Titres , sélectionnez la police, la taille et l'épaisseur de soulignement pour le texte d'en-tête dans les menus déroulants.

  5. Dans la section de texte d'accent , sélectionnez la police des menus, les boutons et le texte de sous-titre de votre boutique. Si vous souhaitez mettre du texte en majuscule, cochez la case Mettre le texte en majuscule. Si vous souhaitez augmenter l'espace entre les lettres, cochez Espacer les lettres.

  6. Dans la section Corps du texte , sélectionnez la police et la taille de la police pour le corps du texte de votre boutique. Si vous souhaitez mettre en forme du texte de corps, cochez la case Mettre en italique les titres, les blocs de citation, le nom de l'auteur du commentaire et les dates.

  7. Cliquez sur Enregistrer.

Page de panier

Brooklyn vous permet de personnaliser votre page de panier en sélectionnant le type de panier et en activant les notes de commande du client.

Le thème Brooklyn prend en charge 2 types de panier :

  • Lorsqu'un article est ajouté au panier, Page redirige vos clients vers la page de votre panier.
  • Tiroir ouvre un tiroir sur le côté de la page lorsque des éléments sont ajoutés à un panier et invite l'utilisateur à passer à la page de paiement.

Brooklyn inclut également une option permettant à vos clients de vous envoyer des instructions spéciales avec leur commande.

Pour définir les options de panier dans Brooklyn :

  1. Dans la section Brooklyn , cliquez sur Personnaliser.

  2. Cliquez sur Paramètres du thème.

  3. Cliquez sur la page Panier.

  4. Sélectionnez un type de panier dans le menu déroulant Type de panier.

  5. Si vous souhaitez autoriser les clients à fournir des notes de commande à la caisse, cochez la case Activer les notes de commande.

Médias sociaux

Brooklyn comprend plusieurs options pour intégrer votre boutique en ligne aux médias sociaux, notamment Facebook, Twitter et Pinterest.

Pour activer les paramètres de médias sociaux pour Brooklyn :

  1. Dans la section Brooklyn , cliquez sur Personnaliser.

  2. Cliquez sur Paramètres du thème.

  3. Cliquez sur Médias sociaux.

comptes

Vous pouvez afficher des liens vers vos comptes de médias sociaux dans le pied de page de votre site.

Saisissez les URL de vos sites de médias sociaux dans les champs fournis.

Options de partage

Vous pouvez également autoriser vos clients à partager du contenu de votre boutique en ligne sur leurs comptes de médias sociaux. Dans la section Options de partage , cochez la case correspondant à chaque type de partage de médias sociaux que vous souhaitez autoriser :

  • Cochez Partager sur Facebook pour activer le bouton de partage Facebook pour les produits ou les articles de blog.

  • Cochez Tweet sur Twitter pour activer le bouton de partage Twitter pour les produits ou les articles de blog.

  • Cochez la case Épingle sur Pinterest pour activer le bouton de partage Pinterest pour les produits ou les billets de blog.

Les boutons

favicon

Vous pouvez mettre en ligne une icône de favoris, ou une « favicon », qui peut vous aider à marquer votre boutique en ligne en affichant votre logo dans les emplacements suivants :

  • l'onglet de votre navigateur web
  • l'historique de votre navigateur web
  • icônes sur votre bureau
  • à côté de votre nom de boutique en ligne lorsqu'il est marqué d'un signet.

Vous pouvez également ajouter du texte d'image associée à votre favicon. Le texte d'image associée s'affiche si une image ne peut pas être chargée, et est utilisé par un logiciel de lecture d'écran pour décrire l'image aux utilisateurs malvoyants. L'ajout de texte d'image associée améliore également le référencement naturel de votre site web.

Pour mettre en ligne un favicon :

  1. Dans la section Brooklyn , cliquez sur Personnaliser.

  2. Cliquez sur Paramètres du thème.

  3. Cliquez sur Favicon.

  4. Dans la zone Image favicon , cliquez sur Sélectionner une image , puis effectuez l'une des opérations suivantes :

- Pour sélectionner une image que vous avez déjà mise en ligne dans votre interface administrateur Shopify, cliquez sur l'onglet Bibliothèque. - Pour sélectionner une image sur votre ordinateur local, cliquez sur l'onglet Bibliothèque , puis sur le bouton plus.

  1. Si vous souhaitez ajouter du texte d'image associée à votre image favicon, cliquez sur Mettre à jour. Dans la fenêtre Modifier l'image , saisissez le texte d'image associée dans le champ Texte d'image associée.

  2. Cliquez sur Enregistrer.

Changer le style de thème

Brooklyn contient deux styles de thème :

  • Classique U : un style de thème moderne, gris et blanc.
  • Ludique : un style de thème gai, aux tons pastel.

Pour sélectionner un style de thème :

  1. Cliquez sur l'onglet Paramètres du thème.

  2. Cliquez sur le bouton Modifier le style de thème.

  3. Cliquez sur le style de thème que vous souhaitez utiliser.

  4. Cliquez sur Changer de style.

Conseils de navigation

Ajouter un menu déroulant

Pour ajouter des menus déroulants à votre menu principal, vous devez créer des menus sur votre page de navigation. Cet article vous guidera tout au long de ce processus.

Le menu principal se réduit en un bouton

Une partie limitée de votre en-tête est réservée à votre navigation. Si vos liens dépassent la largeur allouée, votre navigation sera automatiquement convertie en un bouton qui ouvre un menu déroulant.

Le comportement n'est pas contrôlé strictement par le nombre de liens dans votre menu principal, bien qu'il soit conseillé de ne pas dépasser quatre ou cinq liens. Pour inclure plus de liens, vous pouvez :

  • Utiliser une police plus étroite. Pour cela, utilisez l'éditeur de thème, cliquez sur Paramètres du thème , puis sur Typographie. Changer la police du texte accentué.
  • Faites en sorte que chaque lien utilise moins de caractères. Par exemple, remplacez « Foire aux questions » par « FAQ », « Nous contacter » par « Contact », « Catalogue » par « Achat », et toutes les occurrences de « et » en « & ».

Si vous devez utiliser beaucoup de liens dans votre menu principal et que vous voulez désactiver le comportement du menu coulissant, consultez ce guide de personnalisation. La désactivation de cette fonctionnalité n'est pas prise en charge par Shopify.

Modifier la couleur du lien de navigation

La couleur des liens de navigation en haut de votre page est liée au paramètre Couleurs de l'onglet Paramètres du thème de l'éditeur de thème :

Vous pouvez choisir n'importe quelle couleur selon vos goûts, pas seulement blanc ou noir.

Si vous utilisez le diaporama plein écran, vos liens de navigation et le texte de l'en-tête du diaporama seront soit blancs ou noirs, selon que la couleur du texte est configurée sur Clair ou Foncé dans la diapositive en cours d'affichage. L'utilisation du noir et blanc accentue le contraste entre la photo de la diapositive et le texte, ce qui facilite la lecture du texte. Cliquez ici pour obtenir plus d'informations sur la sélection de la couleur du texte.

Ajouter une sous-navigation à une page de collection

Pour répertorier les sous-catégories sous le titre de votre page de collection, comme indiqué à la page Femmes de la boutique de démonstration Brooklyn, votre collection doit contenir des produits avec des balises. Les balises de produit sont utilisées pour créer des sous-catégories de produits dans votre boutique.

Assurez-vous que la fonction n'est pas désactivée dans l'éditeur de thème. Accédez à une page de collection dans l'aperçu de l'éditeur de thème, puis cliquez sur Sections. Cliquez sur Pages de collection , puis cochez Afficher les balises de collection  :

Conseils en matière d'images

Les meilleurs types d'images de produits pour Brooklyn

Les photos à plus haute résolution ont l'air plus finies et professionnelles dans le thème de Brooklyn ; vos images doivent donc être d'au moins 1024 x 1024 px. Vos images peuvent être aussi grandes que 2048 x 2048 px. Les images sont automatiquement réduites si nécessaire, donc plus la qualité est élevée, meilleur sera le résultat.

Le rapport largeur-hauteur optimal pour vos photos de produits est le carré.

Idéalement, le fond de vos photos devrait être d'une couleur unie le long des bords. Une couleur unie est uniforme, sans ombres ni reflets. Toutes les photos doivent présenter la même couleur unie le long de leurs bords.

Pour que la couleur du cadre du produit entourant vos photos corresponde à la couleur de fond de vos photos, allez à l'éditeur de thème et cliquez sur l'onglet Paramètres du thème. Cliquez sur Couleurs et modifiez la couleur de fond du produit. Configurez la couleur de fond du produit sur transparent afin que la couleur de fond à l'intérieur des photos de vos produits se fonde dans le cadre qui les entoure.

Taille optimale pour les images de diaporama

Les deux diapositives utilisées dans la boutique de démonstration de Brooklyn font exactement 1 200 px de large et 800 px de haut. Il est conseillé d'unifier la taille de toutes vos diapositives.

Il faut s'attendre à ce que les côtés de vos diapositives soient coupés sur les téléphones mobiles, et la partie du bas sur les écrans d'ordinateur portable. Vous trouverez plus d'informations sur les raisons pour lesquelles cela se produit ici.

Pourquoi les images de diaporama sont-elles coupées sur un appareil mobile ?

Sur les téléphones mobiles, les diapositives remplissent complètement l'écran de l'appareil de leur bord supérieur à leur bord inférieur. Les diapositives sont redimensionnées de sorte que leur hauteur soit la même que celle de votre appareil mobile. Vos diapositives deviennent alors une image de fond, qui couvre l'écran du mobile, et pour que cela se produise, les diapositives seront coupées à gauche et à droite.

Sur les grands écrans, le comportement est quelque peu inversé en raison d'un rapport largeur-hauteur différent. Les diapositives sont redimensionnées afin que leur largeur, et non leur hauteur, corresponde à la largeur du navigateur, et la partie du bas des diapositives est ensuite coupée.

Les deux comportements sont clairs dans la capture d'écran ci-dessous, qui montre côte à côte les vues de l'ordinateur de bureau et du dispositif mobile.

Afficher une image bord à bord pour une collection

Pour afficher une image bord à bord, votre collection doit contenir une image en vedette.

Après avoir ajouté une image vedette à votre page de collection dans votre interface administrateur, faites défiler la page jusqu'à la section Modèle et sélectionnez collection.image comme modèle pour votre collection.

Vous pouvez voir une démonstration du fonctionnement sur la page Mens de la boutique de démonstration de Brooklyn. L'image de collection s'affichant en haut est la même image que vous voyez ici. Sa taille est de 1 405 px par 800 px.

Définir une image pour les articles de blog

La première image de votre article de blog sera choisie comme image vedette de la page de destination du blog. Cliquez ici pour découvrir comment ajouter une image à un article de blog.

Changer les icônes de carte de crédit au bas des pages

Cet article vous montrera comment ajouter des cartes de crédit, et en supprimer une partie ou la totalité.

Afficher les vignettes des vidéos dans les articles de blog

Si votre article de blog comporte une vidéo, ajoutez une vignette de celle-ci à l'extrait de votre article, et elle apparaîtra sur la page de destination du blog.

Conseils sur les produits

Supprimer la bordure grise autour des images de produit

Allez à l'éditeur de thème et sous Couleurs , configurez la couleur de fond du produit sur transparent :

Si les images de vos produits sont trop petites, lisez le guide de personnalisation avancé. Shopify ne prend pas en charge cette personnalisation de votre thème Brooklyn. Si vous avez besoin d'aide pour personnaliser votre thème Brooklyn, adressez-vous au forum de la communauté Design.

Ajouter un badge Enregistrer aux produits

Configurez une valeur Prix normal supérieure au prix de vos variantes de produit. Si un produit est mis en vente correctement dans ce cas, le badge s'affichera automatiquement sur cette image de produit aux pages de collection.

Définir quels produits paraissent plus grands sur les pages de collection

La taille des produits dans la grille de collage est basée sur l'ordre dans lequel ils apparaissent dans la collection. Vous pouvez réorganiser manuellement vos produits dans l'interface administrateur pour ajuster le dimensionnement.

Tous les six produits, le premier et le sixième produit recevront le plus grand traitement. Par exemple, les 1re, 6e, 7e, 12e, 13e et 18e images de votre collection seront plus grandes.

Pour afficher une grille d'images de produits de même taille, allez à l'éditeur de thème. Dans l'onglet de la page Collection , modifiez le style de grille de collage à grille.

Masquer les balises de produits sur les pages de collection

Allez à l'éditeur de thème, cliquez sur la section Page de collection , puis désactivez la case à cocher Afficher les balises de collection  :

Barrer les options de produits lorsqu'elles sont épuisées

Les options vendues sont barrées automatiquement pour les produits n'ayant qu'une seule option.

Si un produit comporte plusieurs options, par exemple la couleur et la taille, le produit n'est disponible à l'achat que si la taille et la couleur sont disponibles. Si vous sélectionnez une combinaison de couleurs et de tailles, qui entraîne une variante indisponible ou épuisée, le bouton Ajouter au panier sera désactivé et réétiqueté « Non disponible » ou « Épuisé ».

Pour le produit ci-dessous, la combinaison Marron - Moyen est épuisée :

Défilement animé lors de la sélection d'une variante

À la page du produit, si la description du produit est suffisamment courte pour tenir entièrement dans la zone de visualisation, la sélection d'une variante avec une image produira un défilement animé pour révéler l'image. Si la description est trop longue pour tenir à l'écran, l'image du haut sera remplacée par l'image de la variante, et il n'y aura pas de défilement animé.

La description du produit s'affiche à l'écran uniquement lorsqu'elle est suffisamment courte pour tenir dans la zone de visualisation. Un défilement animé qui révèle l'image d'une variante sélectionnée ne s'affichera que si la description est corrigée. Lorsque la description ne s'affiche pas parce qu'elle est trop longue, le thème ne peut pas défiler et révèle à la place la nouvelle variante avec une permutation de l'image supérieure.

Si vous préférez le défilement animé, saisissez des descriptions de produits courtes. Si vous préférez une permutation d'images, saisissez des descriptions de produits plus longues.

Indépendamment de la longueur de vos descriptions de produits, la sélection d'une variante avec une variante d'image affiche toujours les boutons d'options de produit. Les clients seront en mesure d'afficher toutes les couleurs d'un produit sans faire défiler vers le haut et vers le bas.

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

Essayez gratuitement