É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. CONTENUTexte 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. ACTIONVous 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.ATTRIBUTSCe groupe de 3 paramètres est commun à tous les éléments. Vous pouvez en apprendre plus ici.
5. VISIBILITECe groupe de 3 paramètres est commun à tous les éléments. Vous pouvez en apprendre plus ici.
6. ANIMATIONCe groupe de 3 paramètres est commun à tous les éléments. Vous pouvez en apprendre plus ici.
Paramètres de l’onglet Style
1. GLOBALVous pouvez en apprendre GLOBAL paramètres ici.
2. ESPACEMENTVous pouvez en apprendre ESPACEMENT paramètres ici.
3. TYPOGRAPHIEVous pouvez en apprendre TYPOGRAPHIE paramètres ici.
4. FONDVous pouvez en apprendre FOND paramètres ici.
5. BORDUREVous pouvez en apprendre BORDURE paramètres ici.
6. AFFICHAGEVous pouvez en apprendre AFFICHAGE paramètres ici.
7. CSS PERSONNALISEVous 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. OVERALLYou can read about the OVERALL parameter here.
2. SPACINGYou can read about the SPACING parameter here.
3. TYPOGRAPHYYou can read about the TYPOGRAPHY parameter here.
4. BACKGROUNDYou can read about the BACKGROUND parameter here.
5. BORDERYou can read about the BORDER parameter here.
6. DISPLAYYou can read about the DISPLAY parameter here.
7. CUSTOM CSSYou can read about the CUSTOM CSS parameter here.

Do you want to get more sales from the same amount of traffic?

PageFly can help you. We are the best page builder app to give you the freedom to customize your page, build trust and gain more sales.

Explore PageFly
PageFly Languagues

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

I got it!