La capacité à présenter efficacement les informations sur les produits est l’élément vital du commerce électronique. Pourtant, trop souvent, les commerçants sont confrontés à un paradoxe frustrant : l’abondance se transforme en surcharge . Les mises en page rigides, les présentations sèches et les avalanches d'informations étouffent la voix de votre produit, laissant les clients perplexes et désengagés.
Pour surmonter ces obstacles, le thème Concept fournit la section Détails du produit , un outil puissant conçu pour rationaliser et optimiser la communication sur les produits. Cette section permet aux commerçants d'élaborer une description claire et concise du produit, en se concentrant sur leurs spécifications.
Ce tutoriel vous montre comment configurer la section Détails du produit étape par étape :
A. Où se trouve cette fonctionnalité
Sur votre page Produit via l' éditeur de thème , créez la section Détails du produit sous le groupe de sections Modèle .
Cette section de configuration offre une gamme d'options de personnalisation, organisées de manière pratique en trois blocs distincts pour une navigation facile : Description , Ligne pliable et Blocs de spécifications .
B. Configuration des détails du produit
1. Les paramètres de la rubrique
Paramètres des sections | Description | |
---|---|---|
Détails du produit | ||
Ouvrir la première rangée pliable | Activez pour ouvrir la première ligne réductible. | |
Titre de spécification | Saisit le texte | |
Titre | ||
Titre | Le titre de la section. | |
Taille du titre | La taille du titre peut être définie sur l'une des options suivantes : Small , Medium , Large ou Extra large . | |
Alignement du cap | Le titre peut être aligné à gauche , au centre ou à droite . | |
Balise de titre | Sélectionne la balise de titre pour structurer et organiser votre contenu pour le référencement. | |
Sous-titre | Le sous-titre du titre est placé au-dessus du titre. | |
Description | Le texte de description du titre est placé sous le titre. | |
Texte surligné | ||
Texte surligné | Choisissez parmi l'une des 6 options suivantes pour formater votre texte :
| |
Griffonnage surligné Exiger que le style de texte en surbrillance soit défini sur Griffonnage dessiné à la main. | Ce paramètre propose 5 façons de surligner du texte :
| |
Couleur | Vous pouvez éventuellement personnaliser les couleurs de la section, notamment les suivantes :
| |
Section | ||
Vous pouvez ajuster le remplissage supérieur et le remplissage inférieur de 0 px à 120 px par incréments de 4 px. | ||
Afficher le séparateur de section | Affiche un séparateur de ligne au-dessus de cette section. | |
Faire une section pleine largeur | Rend le conteneur sur toute la largeur. | |
Rendre la section arrondie | Applique un bord arrondi aux deux coins supérieurs. |
2. Les paramètres du bloc
2.1. Description
Ce bloc est censé exploiter des descriptions informatives et engageantes pour présenter de manière optimale les détails du produit et améliorer l'expérience client.
Titre : le titre du bloc. (Par exemple, Description .)
Le bloc Description est renseigné avec le contenu du champ Description du produit , tel que trouvé dans le tableau de bord d'administration > Produits > Flow Harmony ( Flow Harmony est l'exemple de produit dans cet article). Pour référence, veuillez consulter les deux images ci-dessous.
Bloc de description | Le produit Flow Harmony |
---|---|
2.2. Rangée pliable
Utilisez des onglets pliables pour présenter facilement des informations supplémentaires qui permettent aux clients de prendre des décisions d'achat éclairées.
- Titre - Le titre du bloc
Contenu de la ligne – Saisit ou choisit un champ méta (icône métafiel) qui fournit des détails améliorant la compréhension des clients et facilitant des décisions d'achat en toute confiance.
L'icône métafiel :
- Métachamps : saisit l'espace de noms et la clé du métachamp contenant la valeur. Chaque champ méta doit être sur sa propre ligne.
Par exemple:
Dans cet exemple de produit Flow Harmony , la valeur du contenu de la ligne est déterminée en récupérant par programme le champ méta Sound , garantissant ainsi la cohérence des données et un affichage précis.
Le contenu de la ligne | Le produit Flow Harmony |
---|---|
Pour améliorer davantage les informations sur le produit, des informations sur la batterie ont été ajoutées en saisissant exactement l' espace de noms du champ méta de la batterie et la clé dans les métachamps : tech_specs.battery
.
2.3. spécification
Le processus de configuration du bloc Spécifications propose deux approches :
2.3.1. Ajout manuel de spécifications
Visualisons la première méthode en action. Pour afficher 5 spécifications du produit Flow Harmony, nous suivrons ces étapes :
- Ajouter 5 blocs de spécifications
- Personnalisez chaque bloc avec une icône et un texte pertinents
Pour offrir un support visuel, les deux images ci-dessous fournissent un contexte supplémentaire.
2.3.2. Intégration métaobjet et métachamp
La deuxième méthode exploite la puissance combinée de Metaobject et Metafield . Ici, Metaobject sert de référentiel centralisé pour toutes les spécifications du produit , tandis que les Metafields individuels affichent dynamiquement ces spécifications pour chaque produit spécifique .
Le processus comprend trois étapes principales :
- Création de métaobjet
- Création de métachamp
- Configuration du bloc de spécifications
1. Création de métaobjet
Accédez aux paramètres via le tableau de bord d'administration .
Dans Paramètres , cliquez sur l'onglet Données personnalisées > Ajouter une définition .
Après avoir cliqué sur Ajouter une définition , cette fenêtre apparaîtra :
À titre de référence, veuillez vous assurer que la disposition de vos données correspond à l'exemple présenté dans les images ci-dessous :
Nom - entre
Tech spec
Champs – Choisit le texte du fichier et du texte sur une seule ligne
Fichier - Entre
Icon
dans Nom et choisit Un fichier .Texte sur une seule ligne : saisit
Label
dans Name et choisit One file .
À la fin de cette étape, la configuration du métaobjet reflétera la représentation visuelle dans l'image ci-dessous :
Après la création du métaobjet, remplissez-le avec les spécifications complètes du produit (par exemple, casque , câble USB-C, 1,25 m , haut-parleurs , etc.). Réalisez cela en :
En cliquant sur Ajouter une entrée
Sélection d'une icône représentative et saisie du texte dans Étiquette .
Par exemple , nous ajoutons ici une entrée « Câble USB-C, 1,25 m » :
Répétez le processus pour les valeurs « Entrée » restantes.
Une fois cette étape terminée, votre spécification technique Metaobject hébergera de manière exhaustive toutes les entrées de produit ( dans cet exemple, nous avons 8 entrées ), agissant comme un référentiel central pour les informations sur les spécifications.
2. Création de métachamp
Cette étape consiste à établir un nouveau métachamp nommé « Tech specs » conçu pour contenir des valeurs uniques spécifiques à chaque produit .
Pour créer un nouveau champ méta, accédez à Paramètres via le tableau de bord d'administration > Données personnalisées > Produits > Ajouter une définition .
Nom – entre
Tech specs
Espace de noms et clé - entre
custom.tech_specs
Dans le type de sélection : sélectionne le métaobjet
Dans référence - choisit Tech spec , puis sélectionne le type de liste d'entrées .
Cliquez sur Enregistrer pour terminer cette étape.
Une fois cette étape finalisée, le métachamp nouvellement créé sera automatiquement renseigné sur tous vos produits. Vous pouvez désormais attribuer des valeurs spécifiques à des produits individuels, comme vous le souhaitez.
Par exemple, dans le produit Flow Harmony > Spécifications techniques > Sélectionner les entrées > choisit les entrées pour ce produit dans la liste .
3. Configuration du bloc de spécifications
Revenez au bloc Spécifications sous la section Détails du produit .
Cette étape nécessite simplement de sélectionner le champ méta Spécifications techniques en cliquant sur l' icône du champ méta située en haut à droite.
Les spécifications du produit désigné seront automatiquement renseignées.
Nous espérons que cet article vous a été utile. Si vous avez des questions ou des préoccupations concernant cette fonctionnalité, n'hésitez pas à contacter notre équipe pour obtenir de l'aide.