Fenêtre E-commerce: Page Fiche Produit

Étape 3 - Plan >

Fenêtre E-commerce: Page Fiche Produit

Previous pageReturn to chapter overviewNext page
Montrer/Cacher le texte caché

Avec l'édition  Pro de WebSite X5 le logiciel génère une Fiche Produit pour chaque Produit de votre e-commerce pour afficher toutes les informations y concernent, pour le présenter plus complètement aux clients. Avec les options de cette section, qui s'ouvre en sélectionnent la Page Spéciale "E-Commerce : Page Fiche Produit" sur le Plan et en appuyant sur Modifier, vous pouvez donc définir la structure des Pages Fiche Produit et l'affichage des produits connexes et les boutons pour partager la page sur les réseaux sociaux ou écrire un commentaire.

Dans la fenêtre vous retrouvez les sections suivantes:

▪Général ;
▪Commentaires.
Cliquez pour etendre/reduireRéférence : La section Général

Pour définir la structure des Pages Fiche Produits vous pouvez utiliser les options disponibles dans la section Affichage :

Galerie à la gauche, détails à la droite.

Détails à la gauche, galerie à la droite.

Vous pouvez puis travailler avec des options de Style pour définir la taille des éléments :

▪Largeur : pour définir la largeur de la Galerie  en pourcentage par rapport à la Page.
▪Hauteur Galerie : pour définir en pixels la hauteur de la Galerie des images.
▪Hauteur Miniatures : pour définir en pixels la hauteur des Miniatures de la Galerie des images.

Maintenant vous pouvez choisir les Éléments à afficher  :

•Prénom du Produit ;
•Description ;
•Détails : c'est-dire la Catégorie, les Options du Produit, la Disponibilité, le Prix, l'affichage de la TVA, le Champ Quantité ;
•Bouton : un Produit au Panier et procéder avec son achat ;
•Liste des souhaits : pour ajouter le Produit à la Liste des souhaits, c'est-à-dire la liste de produits que le client peut acheter plus tard.

Une fois que vous avez sélectionné l'Élément avec lequel vous souhaitez travailler, vous retrouvez les suivantes options :

▪Visible :  pour afficher l'élément. Si vous sélectionnez l'élément Détails, par contre, vous pouvez choisir si afficher les informations telles que Catégorie, Disponibilité ou Prix.
▪Police : pour spécifier la police, la tailler et le Style du texte. La liste déroulante propose toutes les polices présentes sur l'ordinateur, la commande pour appliquer la Police par défaut (définie par le Style de l’élément Texte de la page dans la fenêtre Style du texte) ; la liste des Polices sécurisées, c'est-à-dire des polices présentes sur tous les dispositifs et qui ne requièrent aucune publication,  tous les Google Fonts et les Polices Web ajoutés à l’aide de la fenêtre Ajouter des polices web rappelée par la commande Autres types de caractère.
▪Couleur de texte : pour spécifier la couleur du texte.
▪Afficher Catégorie : pour afficher la Catégorie du Produit que vous avez défini sur E-commerce | Produits.
▪Afficher le champ quantité : pour afficher un Champ Quantité pour que le Client puisse indiquer la qualité du Produit à insérer dans le panier.
▪Afficher les Options du Produit : pour afficher les Options du Produit disponibles si vous les avez définies depuis la fenêtre E-commerce | <%S1_CART_TABPANEL1%
▪Afficher disponibilité : pour afficher, en plus de l'icône pour la Disponibilité indicative, même le numéro qui en spécifique la Disponibilité effective.

Si vous activez l'option Afficher disponibilité et il y a au moins un Produit pou lequel vous avez défini d'afficher ce type de disponibilité, la page où se trouve le Objet Catalogue des produits doit être défini en php. Vous pouvez faire ça avec l'option Extension du fichier créé disponible sur Propriétés de la page | Avancées.

▪Afficher le prix : pour afficher le prix du Produit, avec ou sans TVA.
▪Modalité : pour spécifier si vous souhaitez utiliser un Texte ou une Image en tant que Bouton. Dans le premier cas, vous pouvez définir le style du lien textuel ; dans le deuxième, il faut importer le Fichier Image à utiliser depuis le champ approprié.
▪Ajouter le produit sans montrer le Panier : disponible pour l'élément Bouton, avec cette option le Client peut ajouter directement le Produit sans avant afficher le Panier.
▪Couleur : pour spécifier la couleur pour icône de coeur utilisée pour ajouter un Produit à la Liste de souhaits.
▪Ajouter sans afficher la Liste de souhaits : que disponibles pour  l'élément Liste de souhaits,  avec cette option le Client peut ajouter le Produit directement à sa liste de souhaits sans l'afficher avant.

Dans la section Options, par contre, vous pouvez définir le possible affichage des Produits connexes :

▪Afficher les produits de la même Catégorie : si l'option est active, sur la page sera disponible une galerie avec les images des Produits qui font part de la même Catégorie du produit sélectionné.

L’encadré Google AMP présente en revanche les options nécessaires pour créer une version AMP des Articles :

▪Créer des pages Google AMP en incluant le contenu du Blog : en activant cette option, une version en AMP est créée pour chaque Article du Blog, en plus de la Page utilisée sur le Site. Les versions en AMP seront utilisées par Google pour permettre aux utilisateurs navigants sur un dispositif mobile d’y accéder rapidement.
▪Image d'en-tête pour Google AMP : définit l’image qui doit être utilisée comme en-tête (en-tête supérieur) des Pages Google AMP au lieu de l’en-tête présent dans les Pages complètes.

AMP est un projet de Google visant à améliorer la vitesse de chargement des pages sur les appareils mobiles  (https://www.ampproject.org/).

Les Pages Google AMP sont très simples et incluent uniquement les éléments strictement nécessaires. Elles sont servies par le cache de Google et s’affichent avec l’ajout d’une barre qui propose le domaine et le lien vers la version complète des Pages.

AMP présente quelques limitations, notamment en ce qui concerne l’impossibilité d’utiliser JavaScript. C’est pourquoi dans les Pages Google AMP, les blocs latéraux ne peuvent pas être conservés, les éventuels Diaporamas sont recréés à l'aide d’un élément spécifique et certains types de lien sont remplacés par un lien vers la version complète de la Page.

Étant donné que les versions AMP sont chargées par Google sur ses serveurs en HTTPS, pour que tout fonctionne correctement, il est nécessaire que le Site complet et les éventuelles ressources reliées dans les Articles du Blog soient chargés sur un domaine en HTTPS.

Cliquez pour etendre/reduireRéférence : La section Commentaires

Les commandes de cette section permettent de gérer l'entrée des commentaires laissés par les visiteurs comme réaction aux Produits de la boutique en ligne.

Tout d'abord il faut activer l'option Permettre de laisser des commentaires pour les Produits de la boutique en ligne.

Ensuite, il faut spécifier le Système de gestion des commentaires en choisissant entre :

WebSite X5: est le système interne de WebSite X5 et implique l'utilisation d'un Panneau de Contrôle en lignespécifique.

Facebook: utilise le Plug-in Social de Facebook pour gérer les discussions et les commentaires

Disqus: est le système fourni par Disqus.

Selon le Système de gestion des commentaires choisi, il y a des options différentes sur lesquelles travailler.

Cliquez pour etendre/reduireRéférence : Les commandes pour gérer les commentaires à l’aide du système interne de WebSite X5

Si vous utilisez le Système de gestion des commentaires interne de WebSite X5, il est nécessaire de définir le Type de contenu que les Visiteurs du Site pourront laisser, en choisissant entre :

Commenter et voter: les Visiteurs peuvent laisser des commentaires et, en plus, exprimer un vote.

Commentaire: les Visiteurs peuvent laisser des commentaires mais ne peuvent pas voter.

Voter: les Visiteurs peuvent voter mais ne peuvent pas laisser de commentaires.

Une fois le Type de contenu sélectionné, dans la section Gestion des commentaires sont présentées les options disponibles :

▪Mode de vote  : définit le style de l'élément graphique (par exemple, une série de 5 étoiles) proposé aux visiteurs pour leur permettre de voter. Il s'agit de la seule option disponible si vous sélectionnez Voter comme Type de contenu.
▪Organiser les commentaires sur plusieurs colonnes : avec cette option on peut organiser les commentaires sur des colonnes flanquées plutôt que  l'un sous l'autre.
▪Afficher le bouton 'Abus' : permet de mettre à disposition des visiteurs le bouton "Abus" à l'aide duquel ils peuvent signaler tout comportement incorrect.
▪Activer le contrôle anti-spam 'Captcha' : ajoute le contrôle anti-spam du Captcha au terme du formulaire pour insérer un commentaire.

Vous pouvez choisir le système de captcha que vous souhaitez utiliser à l'aide de la fonction prévue à cet effet figurant dans la fenêtre Confidentialité et Sécurité | Sécurité.

▪Commentaires par page  : définit le nombre maximum de commentaires qui doit s'afficher par Page.
▪Mode d'affichage  : définit si les commentaires laissés par les visiteurs peuvent être consultés en ligne immédiatement, ou si ils doivent d'abord être approuvés à l'aide des commandes du Panneau de contrôle en ligne.
▪Ordre d'affichage  : définit dans quel ordre chronologique doivent être affichés les commentaires publiés, du plus récent au plus ancien ou vice versa.

Habituellement les fournisseurs d'accès Internet permettent l'accès en écriture pour chaque dossier du serveur: dans ce cas, il n'est pas nécessaire de renseigner un chemin pour le dossier public. Au contraire, pour connaître le chemin complet du dossier public, il est nécessaire de contacter son fournisseur d'accès Internet.

À travers la section WebSite Test du Panneau de Contrôle en ligne il est possible de vérifier si le dossier avec accès en écriture spécifié, et si les éventuels sous dossiers contenus, existent et, dans ce cas, s'ils permettent réellement l'écriture des données.

Si vous n'utilisez pas le WebSite X5 Hosting, il faut configurer la Base de Données connectée au Projet avec les options dédiées de la fenêtre Paramètres du Serveur.

Toujours si vous utilisez le Système de gestion des commentaires  de WebSite X5, sur le Panneau de Contrôle en ligne, vous pouvez activer l'envoi automatique d'une notification à l'Administrateur du Site web chaque fois un usager écrit un commentaire sur un Produit de la boutique en ligne.

Cliquez pour etendre/reduireReference: Les commandes pour gérer les commentaires sur Facebook

Si comme Système de gestion des commentaires vous décidez d'utiliser Facebook, il faut définir les options suivantes :

▪Couleur  : configure des couleurs claires ou foncées pour les éléments en premier plan, afin d'obtenir un contraste correct par rapport à l'arrière-plan.
▪Messages visibles  : définit le nombre de postes qui doivent être visualisés dans le cadre des commentaires.

Pour plus d'informations sur le fonctionnement des Social Plug-in de Facebook, voir: https://developers.facebook.com/docs/plugins/

Cliquez pour etendre/reduireReference: Les commandes pour gérer les commentaires sur Disqus

Enfin, si comme Système de gestion des commentaires vous décidez d'utiliser Disqus, vous pouvez définir les options suivantes :

▪Disqus Short Name  : c'est le nom attribué comme identifiant du Site durant le paramétrage du service sur Disqus. Tous les commentaires reçus par le biais d'un Site seront automatiquement associés au Short Name configuré afin de pouvoir être chargés et visualisés correctement.

Pour plus d'informations sur le système de gestion des discussions proposées par Disqus, voir: http://disqus.com/websites/