Éléments Shopify - Détails du produit

Dans cet article, vous découvrirez un autre élément Shopify nommé Détails du produit.

A propos de l’élément Afficher les détails du produit

L’élément Détails du produit est conçu pour afficher les détails de votre produit sur la page produit correspondante afin d’augmenter votre taux de conversion. Vous pouvez utiliser l’élément Détails du produit pour promouvoir vos produits sur n’importe quelle page non-produit ou l’utiliser sur une page de produit.

Notez que vous pouvez rechercher cet élément en utilisant la fonction de recherche au lieu de le trouver dans la barre latérale.

L’élément Détails du produit est livré avec trois variantes courantes, mais nous continuerons à ajouter d’autres variantes pour vous aider à gagner du temps.

Faites glisser une variante sur la mise en page et voyez comment elle peut être configurée.

Configuration de l’élément Détails du produit

L’élément Détails du produit est livré avec de nombreux paramètres vous permettant d’affiner l’apparence du contenu pour le meilleur taux de conversion possible.

Sélectionnez l’élément dans la présentation pour voir ses paramètres.

Lorsque vous faites glisser et déposez l’élément Détails du produit dans la page de l’éditeur, vous avez le choix entre 2 options de source de produit, telles que:

  • Auto
  • Produit personnalisé

Notez que si vous êtes sur la page du produit et utilisez l’élément Détails du produit, vous pouvez choisir l’option Source du produit. Cependant, si vous êtes dans une page standard et utilisez cet élément, l’option Source du produit est désactivée et le produit personnalisé est choisi par défaut.

Si vous choisissez Auto, le produit attribué lors de la création de cette page de produit sera affiché dans l’éditeur de page. L’option Auto est la valeur par défaut lorsque vous utilisez l’élément Détails du produit.

Lorsque les clients cliquent sur le bouton Afficher les détails, ils sont redirigés vers la page de produit correspondante. Voyons comment cela fonctionne sur une page en direct avec l’exemple ci-dessous

shopify elements product view details

Les paramètres dans les onglets Général et Style sont spécifiques à cet élément. Nous allons en apprendre plus ci-dessous.

Paramètres de l’onglet Général
1. CONTENU Texte du bouton: saisissez le texte à votre guise pour le bouton Afficher les détails

Afficher l’icône: permet d’afficher l’icône> du bouton Afficher les détails.

2. ACTION Vous pouvez en apprendre davantage sur le paramètre Action ici.
3. SUIVI
  • Suivi : c’est ici que vous pouvez configurer : 
  • Un événement Google Analytics vers votre compte GA. Vous pouvez en apprendre plus sur comment le configurer ici
  • Facebook Pixel quand un client clique sur l’élément. Vous pouvez en apprendre plus ici.
4.ATTRIBUTS Ce groupe de 3 paramètres est commun à tous les éléments. Vous pouvez en apprendre plus ici.
5. VISIBILITE Ce groupe de 3 paramètres est commun à tous les éléments. Vous pouvez en apprendre plus ici.
6. ANIMATION Ce groupe de 3 paramètres est commun à tous les éléments. Vous pouvez en apprendre plus ici.
Paramètres de l’onglet Style
1. GLOBAL Vous pouvez en apprendre GLOBAL paramètres ici.
2. ESPACEMENT Vous pouvez en apprendre ESPACEMENT paramètres ici.
3. TYPOGRAPHIE Vous pouvez en apprendre TYPOGRAPHIE paramètres ici.
4. FOND Vous pouvez en apprendre FOND paramètres ici.
5. BORDURE Vous pouvez en apprendre BORDURE paramètres ici.
6. AFFICHAGE Vous pouvez en apprendre AFFICHAGE paramètres ici.
7. CSS PERSONNALISE Vous pouvez en apprendre CSS PERSONNALISE paramètres ici.
Paramètres de l’onglet Style
  • État du bouton: Il existe 2 options de style pour cet élément, notamment:
    • Normal
    • Flotter: Si vous choisissez cette option, tout ce que vous stylisez ne s’affichera qu’après avoir passé la souris sur le bouton Afficher les détails.

Les paramètres de l’onglet Style de l’élément Détails du produit sont les suivants:

1. OVERALL You can read about the OVERALL parameter here.
2. SPACING You can read about the SPACING parameter here.
3. TYPOGRAPHY You can read about the TYPOGRAPHY parameter here.
4. BACKGROUND You can read about the BACKGROUND parameter here.
5. BORDER You can read about the BORDER parameter here.
6. DISPLAY You can read about the DISPLAY parameter here.
7. CUSTOM CSS You can read about the CUSTOM CSS parameter here.

Was this helpful?

Try out all PageFly features with Free plan

.myshopify.com
Don’t have Shopify store yet? Create store
×

PageFly Help Center is now available in French and Portuguese.Please check the flags on the page header.

I got it!
Languages