Rubedo Commerce
Tutoriel de création d’un site e-commerce avec
Rubedo Commerce 3.1
Rubedo Commerce
Tutoriel : Rubedo Commerce
� Rubedo Commerce est une solution de gestion de sites/ multi-sites e-commerce.
Adossé aux fonctionnalités de gestion des contenus et des médias de Rubedo,Rubedo Commerce offre un environnement complet permettant de gérerplusieurs sites internet, intranet, extranet et e-commerce.
Rubedo Commerce bénéficie ainsi de l’ensemble des fonctionnalités de Rubedo :e-mailing, gestion des droits, médiathèques, multi-sites, …
De la création de catalogues produits à la gestion des commandes, Rubedopropose une solution complète de e-commerce et de personnalisation en tempsréel avec les Magic Query. Proposez le bon produit à la bonne personne pourconvertir vos prospects en clients.
Rubedo Commerce
Tutoriel : Rubedo Commerce
� Etapes de création d’un site e-commerce
– Activer le e-commerce dans l’installation de Rubedo
– Création d’un nouveau site et activer les catégories
– Création des utilisateurs et des groupes
– Création de la taxonomie
– Création et publication des produits et des contenus
– Création de l’arborescence / Pages
– Paramétrage des fonctions e-commerce
Etape 0 - Activer les fonctions e-commerce
� Dans l’installation de Rubedo / Applications settings / activer le e-commerce
Les fonctionnalités e-commerce peuvent être ajoutées à un site existant ou sur un nouveau site Rubedo.
Etape 1 - Créer un nouveau site et activer les catégories e-commerce
Tutoriel : Rubedo Commerce
� Rubedo étant une solutionmultisites, il est nécessaired'activer les fonctionnalitésde catégorie de produitspour les sites e-commerce.
� Création d’un nouveau site:– Dans le menu Studio >
Sites
– Ajouter un site• Activer les catégories
Etape 2 - Création de la taxonomie
� A l'instar des référentiels de Rubedo (Contenus, médias et utilisateurs), la taxonomie permet de classer et catégoriser les produits. Ce classement offre ensuite de multiples possibilités d'affichage des produits et de recherche sur la base de critères de tri / facettes de recherche.
� Par exemple : taxonomies (Saisons et Types de vêtements) et les termes associés pour une boutique de vêtements– Saisons :
• Printemps
• Eté
• Automne
• Hiver
– Types de vêtements :• Veste
• Pantalon
• T-shirt
• Chemise
Etape 2 - Création de la taxonomie
Tutoriel : Rubedo Commerce
� Les taxonomies et les termes sont paramétrables dans le menu Administration / Taxonomie.
Liste des taxonomies
Liste des termes de la taxonomie
sélectionnée
Ajout et suppression de taxonomie
Ajout et suppression de termes
Paramètres de la taxonomie sélectionnée
En savoir plus http://docs.rubedo-project.org/fr/documentation/construire-site/gestion-donnees/taxonomie
Etape 2 - Création de la taxonomie
� Exemple de taxonomie : Saisons
Facettes de recherche affichées aux clients
Etape 3 - Création des utilisateurs et des groupes
� Lors de la création d'un site Rubedo, 2 types d'utilisateurs sont proposés par défaut : Email et Staff. Dans le cas d'un site e-commerce, il convient de créer un Type utilisateur dédié aux futurs clients.– En savoir plus : http://docs.rubedo-project.org/fr/documentation/construire-site/gestion-
donnees/types-utilisateurs
Liste des types d’utilisateurs
Liste des champs qui composent le profil des
utilisateurs
Paramétrage des champs
Etape 3 - Création des utilisateurs et des groupes
Tutoriel : Rubedo Commerce
� Les types d’utilisateurs sont constitués de champs typés : Texte, Texte Riche, Zone de texte, Evaluation, Slider, Nombre, Média, Média Externe, Date, Temps, Couleur, Liste de choix, Lien sur page, …
� Un type de champ donné correspond :– A un composant de saisie :
– A un format de rendu graphique par défaut, qui peut être modifié
� Pour chaque champ d’un contenu on peut préciser de nombreux paramètres : label, valeurs par défaut, bulle d’aide à la saisie, contrôles de saisie, exploitation dans la recherche …
Etape 3 - Création des utilisateurs et des groupes
� Le Type d'utilisateurs créé pour les clients sera notamment utilisé pour leur inscription/commande. Lorsque les clients souhaiteront passer une commande, si ils ne possèdent pas de compte sur le site ils devront compléter un formulaire d'inscription.
� Ce formulaire d'inscription / création de commande sera basé sur les champs du Type utilisateurs Clients. Comme dans l'exemple ci-dessous :
Etape 3 - Création des utilisateurs et des groupes
� Ouvrir le menu Studio : Types d’utilisateurs– Ajouter un nouveau Type
– Ajouter les différents champs• Paramétrer les champs dans la colonne de droite
� Propriétés du Type d’utilisateur– Rubedo Commerce bénéficie également des fonctionnalités de gestion des Groupes / droits
et Espaces de travail de Rubedo. Ces fonctionnalités permettent par exemple de créer des pages et/ou des produits "privatifs" qui ne seront accessibles qu'aux clients que vous aurez sélectionné. En savoir plus sur la Gestion des utilisateurs.
– Pour permettre aux clients de créer des commandes, les droits d’inscription doivent être en mode « Ouvert »
Etape 4 - Création et publication des Types de produits
Tutoriel : Rubedo Commerce
� A l'instar des Types de contenus et des Types d'utilisateurs, Rubedo permet de définir les différentes informations qui composent un produit. "On ne vend pas des clés USB de la même façon qu'un tee-shirt".
� Pour assurer la souplesse de création des différents types de produits, Rubedo permet de définir les différentes informations qui composeront les produits.
� Vous pouvez donc créer un nouveau type de produit parfaitement adapté pour chaque typologie de produit.
Etape 4 - Création et publication des Types de produits
Tutoriel : Rubedo Commerce
– Dans l'application Type de contenu, cliquer sur "Ajouter"
– Indiquer le nom du type de produit, puis sélectionner "Configurable"
Etape 4 - Création et publication des Types de produits
� Ajouter les différents champs nécessaires pour créer les produits. Par exemple : Numéro du produit, description, image, poids, dimension, délai de préparation, pack size et couleur. Le champ Titre correspondra au nom du produit.
Voir les différents types de champs disponibles.
Etape 4 - Création et publication des Types de produits
� Pour chaque champ, il est possible d'appliquer des propriétés. Sélectionner le champs à gauche pour ajouter des propriétés dans l'onglet droit.– Indiquer lorsque le champ est une variation du produit. Dans l’exemple ci-dessous, le champ
Couleur est utilisé en tant que « variations », dans les propriétés de recherche, ce champ est activé pour « Utiliser comme facette » pour les vêtements.
Etape 4 - Création et publication des Types de produits
� Les variations sont ensuite visibles aux internautes sur les fiches produits dans un « Product box » :
Etape 4 - Création et publication des Types de produits
� Onglet Taxonomie– Sélectionner les vocabulaires de taxonomie associés (Multi classement des
contenus avec la taxonomie).
Tutoriel : Rubedo Commerce
Etape 4 - Création et publication des Types de produits
� Onglet Propriétés– La gestion des propriétés des Types de produits permet de définir leur
visibilité (Par exemple réserver à des groupes d'utilisateurs, ventes privées, ...), et gérer la gestion des stocks et les délais de préparation.
Etape 4 - Création et publication des Types de produits
� Onglet Propriétés– Droits et workflow
• Permet de définir l'espace de travail dans lequel les produits seront affichés. Laisser Global pour afficher le type de produit en mode "public". Sélectionner un espace de travail différent pour afficher le contenu dans un espace "privatif". En savoir plus sur les Espaces de travail.
– Commentaires• Activer ou désactiver pour permettre de commenter les fiches produits avec
DisQus. Une clé de compte DisQus doit être ajoutée dans "Sites".
– E-Commerce• Management des stocks : activer ou désactiver la gestion des stocks depuis Rubedo.
Cette fonction permet également de définir si les produits sans stock peuvent être commandés sur le site et permet de visualiser sur l'interface "Gestion des stocks" l'état en temps réel des stocks des produits.
• Délai de préparation : Permet de spécifier un délai de préparation pour tous les produits de ce type. Ce délai est également indiqué aux clients lors de leur commande.
Etape 4 - Création et publication des Types de produits
� Onglet Mise en page– Cet onglet permet de créer une mise en page spécifique pour tous les
produits de ce type. Pour créer une mise en page spécifique, consulter le tutoriel de Mise en page des contenus, médias et utilisateurs.
Etape 4 - Création et publication des Types de produits
� Onglet Mise en page– Le champ Product box présentent l'affichage du prix, les variations, les stocks
(si activé) et les fonction d'ajout au panier.
– Astuce : Une fonction d'affichage sous forme d'onglet est disponible pour la mise en page des produits.
• Sélectionner le cadre principal
• Ajouter une ligne puis dans la colonne de droite activer Afficher en onglet
• Ajouter des colonnes pour chaque onglet et les nommer (Par exemple : Description, caractéristiques techniques, Conditions).
• Ajouter les différents champs (Champs disponibles) dans les colonnes
• Activer le gabarit pour le site souhaité
• Sauvegarder les modifications
Lorsque le Type de produit est validé, il est possible de créer les produits.
Etape 4 - Création et publication des Types de produits
Tutoriel : Rubedo Commerce
Etape 4 - Création et publication des Types de produits
� Onglet Mise en page– Une fonction d'affichage sous forme d'onglet est disponible
• Ajouter une ligne puis activer Display as a tabs / Afficher en onglets
• Ajouter des colonnes pour chaque onglet (ici 3 colonnes) et les nommer (Par exemple : Description, caractéristiques techniques, délai).
• Ajouter les différents champs dans les colonnes
• Activer le gabarit pour le site souhaité.
Tutoriel : Rubedo Commerce
Etape 5 - Création des produits
Tutoriel : Rubedo Commerce
� Les produits sont créés à partir des types de produits précédemment définis. La création de nouveaux produits se fait soit par le menu Commerce, soit par l'entrée Contenus.
Etape 5 - Création des produits
Tutoriel : Rubedo Commerce
� Sélectionner le type de produit à gauche, les produits déjà créés s'affichent.
� Cliquer sur Ajouter
Liste des types d’de produits
Liste des produits
Etape 5 - Création des produits
Tutoriel : Rubedo Commerce
� Le formulaire de saisie d’un nouveau produit s’affiche
Etape 5 - Création des produits
Tutoriel : Rubedo Commerce
� Le formulaire se compose des onglets suivants : – Edition : permet de rédiger les informations sur le produit
– Métadonnées : permet de définir une date de début et une date de fin d'affichage. Par exemple pour des "offres éclair".
– Taxonomie : permet de tagguer les produits (utilisé pour la recherche à facettes)
– Espace de travail : voir gestion des droits
– Versions : Rubedo stocke les différentes versions des produits. Il est possible de revenir à la version précédente par un simple clic.
– Caractéristiques : permet d’indiquer les variations et les prix du produit
Etape 5 - Création des produits
Tutoriel : Rubedo Commerce
� Product settings / Caractéristiques
Etape 5 - Création des produits
Tutoriel : Rubedo Commerce
� Gestion des variations d'un produit :– SKU : correspond à la référence du produit
– Prix de base : "prix de départ" HT des nouveaux produits
– Délai de préparation : permet d'afficher le délai de préparation avant son acheminement
– Gestion des Stock et Possibilité de commander les produits sans stock : permet aux clients de commander un produit hors stock et permet d'indiquer les critères d'alertes des stocks
– Variations : permet de saisir les variations d'un produit• Cliquer sur Ajouter
• Une nouvelle ligne s'affiche en reprenant les informations activées en tant que variation, ainsi que la colonne Prix HT, SKU et Stock.
� NB : le SKU des variations doit être unique, les stocks sont gérés par variation.
� Pour finir, Publier le produit.
Etape 5 - Création des produits
Tutoriel : Rubedo Commerce
� Appliquer des réductions / Promotions– Les réductions sont applicables aux variations de produits et peuvent être
programmées.
Etape 5 - Création des produits
Etape 5 - Création des produits
� La Gestion des variations des produits : Promotions– Sélectionner une variation
– Ouvrir le panneau de promotions
– Cliquer sur Ajouter
– Définir une date de début et de fin, ainsi que le nouveau prix. L'ancien prix et le nouveau seront affichés aux clients sur la fiche du produit.
� Les blocs de recherche, de liste et de détail des produits présentent par défaut le prix le plus bas disponible pour un produit.
Etape 5 - Création de l’arborescence / Pages
Tutoriel : Rubedo Commerce
� Lorsque les produits ont été créés, il faut créer les pages et l'arborescence du site. Une page est obligatoirement construite à partir d’un masque de pages. Voir la création de Masques de pages et la création de Pages.
� Pour les besoins de vente en ligne, des blocs spécifiques pour le e-commerce sont disponibles. Chaque bloc peut être ajouté dans les différents masques et dans les différentes pages pour définir un parcours client personnalisé et adapté aux produits / services proposés à la vente.
� NB : Les Maques de pages permettent de définir l'ergonomie générale d'un site. Les blocs transverses de Panier en mode bouton et d'accès au compte client sont généralement intégrés aux Masques de page. Ces blocs nécessitent au préalable d'avoir créé les pages décrites plus loin.
Etape 5 - Création de l’arborescence / Pages
Tutoriel : Rubedo Commerce
� Voir Tutoriel : Masques de pages
Liste des Masques de page
Exemple de Masque de page
Menu contextuel des Masques
Etape 5 - Création de l’arborescence / Pages
� Voir aussi Tutoriel : Pages
Menu contextuel
Arborescence du site
Détail de la page
Paramétrage des blocs
Menu de la page sélectionnée
Tutoriel : Rubedo Commerce
Etape 5 - Création de l’arborescence / Pages
Tutoriel : Rubedo Commerce
� Les blocs e-commerce sont ajoutées dans les pages ou les masques.– Liste des blocs
Etape 5 - Création de l’arborescence / Pages
Tutoriel : Rubedo Commerce
� Pour la réalisation d'un site e-commerce, plusieurs pages de bases doivent être créées :– Conditions générales de ventes : page présentant les Conditions générales de
ventes. Un lien vers cette page sera nécessaire pour le bloc "Validation de commande".
– Panier : Page de visualisation du détail du panier, cette page doit présenter le bloc "Panier" en mode détail.
Etape 5 - Création de l’arborescence / Pages
Tutoriel : Rubedo Commerce
� Validation de commande : cette page permettra aux clients de créer un compte ou de se connecter au site pour commander. Cette page doit présenter le bloc "Valider mon panier".
Etape 5 - Création de l’arborescence / Pages
Tutoriel : Rubedo Commerce
Format bouton
Format Détail
Bloc Panier
Etape 6 - Création des pages de catégories et des produits
Tutoriel : Rubedo Commerce
� Le bloc "Valider mon panier" affiche un tunnel d'achat pour les clients sur une page unique.
� Le bloc propose plusieurs options :– Proposer l'inscription à une ou plusieurs mailing list
– Choix du type d'utilisateurs pour définir les champs de profil (Information de contact)
� Paramètres :– Type d’utilisateur : Choisir le type correspondant aux clients
– Mailing list : l’abonnement à une newsletter peut être proposé lors du checkout
– Termes et conditions de ventes : sélectionner la page qui propose les conditions de vente du site
– Page détail de commande : lien vers la page contenant un bloc "Détail de commande"
– Texte d'inscription : texte affiché pour les personnes ne disposant pas encore de compte sur le site.
Etape 5 - Création de l’arborescence / Pages
� Des pages destinées aux clients :– Mon compte : cette page permettra aux clients de modifier leurs informations de
contact. La page propose un bloc "Profil" et en mode "Hors navigation".
– Mes commandes : cette page parente de "Mon compte" permettra aux clients de consulter les différentes commandes qu'ils ont réalisé. Cette page propose un bloc "Commandes de l'utilisateur".
– Détail des commandes : page parente et "hors navigation" de la page "Mes commandes". Cette page permet d'accéder au détail d'un commande sélectionnée. La page propose un bloc "Détail de commande".
Etape 5 - Création de l’arborescence / Pages
� Des pages destinées aux clients :
Etape 5 - Création de l’arborescence / Pages
Tutoriel : Rubedo Commerce
� Détail des commandes : Ce bloc permet d’afficher les détail d’une commande dans une page.
Etape 6 - Création des pages de catégories et des produits
Tutoriel : Rubedo Commerce
� Rubedo permet l’affichage des produits par catégories. Par exemple : Vêtements, Informatique, Hôtel, …
� Les catégories de produits sont créés à partir des pages de l’arborescence du site. Lorsqu'une page est paramétrée en tant que Catégorie, celle-ci pourra être utilisée avec le bloc "Catégorie".
– Étape 1 : création des pages de catégories• Page Catégories vêtements
– Page catégories Robes
– Page catégories T-shirt
Etape 6 - Création des pages de catégories et des produits
Tutoriel : Rubedo Commerce
� Etape 2 : Indiquer les informations de Catégories (Titre, description et images) dans les pages Robes et T-shirt.
Etape 6 - Création des pages de catégories et des produits
Tutoriel : Rubedo Commerce
� Etape 3 : ajouter le bloc catégorie dans la page Vêtements
– Dans la page parente des catégories, ici la "page Vêtements", ajouter le bloc ecommerce Catégories. La page Vêtement affiche alors les catégories avec les informations saisies. Par exemple :
Etape 6 - Création des pages de catégories et des produits
Tutoriel : Rubedo Commerce
� Paramétrage du bloc Catégories
– Racine : sélectionner la page racine à partir de laquelle les catégories de produits seront affichées.
– Fallback root : courant ou parent
– Colonnes : nombre de colonnes pour afficher les catégories
– Largeur miniatures (px) : largeur des images en pixels
– Hauteur miniatures (px) : hauteur des images en pixel
– Mode de redimensionnement des miniatures : crop, morph ou boxed
– Afficher les catégories de niveau 2 : si la case est activée, les catégories de niveau 2 seront également affichées.
Etape 6 - Création des pages de catégories et des produits
Tutoriel : Rubedo Commerce
� Paramétrage du bloc Recherche de produits– Le bloc de "Recherche de produits" permet de présenter une page de
recherche listant les produits sélectionnés.
Facettes de recherche
Recherche plein texte
Vue liste ou vue grille
Etape 6 - Création des pages de catégories et des produits
Tutoriel : Rubedo Commerce
� Paramétrage du bloc Recherche de produits– A l'identique du bloc "Page de recherche", le bloc affiche le nombre de produits
et les facettes permettant d'affiner les résultats. Le gabarit de recherche affiche par défaut les éléments suivants : images, nom du produit et présentation courte, prix du produit, accès à son détail ou ajout automatique au panier.
– 2 vues sont disponibles : affichage en mode liste et affichage en mode grille.
– Ce bloc bénéficie des fonctionnalités de paramétrage avancé permettant de proposer des recherches sur la base de requêtes (choix du type de produit, choix de caractéristiques et taxonomies).
• Exemple : Vêtements + Vestes + Femme + Eté
Etape 6 - Création des pages de catégories et des produits
Tutoriel : Rubedo Commerce
� Paramétrage du bloc Recherche de produits :• Restreindre au site : Seuls les contenus publiés sur le site seront affichés.
• Page associée : sélectionner la page présentant le détail des produits. Voir aussi "Quelle page choisir pour afficher mon contenu".
• Page de profil : sélectionner la page de profil si besoin.
• Facettes prédéfinies : sélectionner les facettes pour définir les produits à afficher.
– Options d'images :• Champ image : nom du champ image utilisé dans le type de produit à afficher.
• Hauteur (px) : hauteur de l'image en pixel.
• Largeur (px) : Largeur de l'image en pixel.
• Mode de redimensionnement : crop, boxed ou morph.
– Options d'affichage :• Modes d'affichage : cases à cocher ou standard (texte).
• Mode d'affichage pour les utilisateurs : grille ou liste.
• Hauteur du résumé : hauteur du résumé en pixel.
MODIFIEZ LE STYLE DU TITRE
Administration des sites e-commerce
� Expéditeurs
� Stock
� Taxes
� Paiement
� Commandes
Gestion des frais de transport
� La gestion des livraisons est accessible depuis le menu e-commerce (lorsque les fonctions e-commerce sont activées).
� Les frais de livraison s'appliquent par pays. Dans le panier, ils s'affichent en fonction du pays de livraison saisi par le client.– Cliquer sur Ajouter et indiquer un nom.
Gestion des frais de transport
Tutoriel : Rubedo Commerce
� Gestion des frais de livraison– Gestion des propriétés
• Une fois créé, il est possible de gérer les différentes propriétés.
• Activer : permet de rendre disponible ce mode de transport aux acheteurs
• Type : 2 options possibles, par commande ou par produit
– Cliquer sur le bouton Ajouter en bas à droite.• Sélectionner un pays
• Ajouter le prix de la livraison
• Ajouter un taux de taxe si nécessaire
• Ajouter un délai de livraison et définir l'affichage de ce délai pour le client.
– Renouveler ensuite l'opération pour les pays qui peuvent bénéficier de la livraison.
– Lorsque les clients accèdent au formulaire de paiement, ils ne visualisent que les frais de livraison du pays qu'ils ont indiqué dans l'adresse de livraison.
Gestion des stocks
Tutoriel : Rubedo Commerce
� Les fonctionnalités e-commerce de Rubedo proposent une application de gestion des stocks. L'ajout de stock sur les produits peut être réalisé à partir des fiches produits ou de l'application de gestion des stocks.
� L'application de gestion des stocks est disponible dans le menu E-commerce. Il présente les différents types de produits créés. Pour chaque type de produit, l'application permet de lister les produits.
Gestion des stocks
Tutoriel : Rubedo Commerce
� Ajouter des stocks
– Sélectionner le produit et cliquer sur Ajouter du stock.
– Une fenêtre s'affiche et permet d'indiquer le nombre de produit à ajouter au stock existant sur le site
– Le nouveau stock est ajouté en temps réel au produit
– Les stocks sont également modifiables depuis les fiches produits
Gestion des stocks
Tutoriel : Rubedo Commerce
� Une alerte visuelle permet de distinguer les produits n'ayant plus de stock
Gestion des taxes
Tutoriel : Rubedo Commerce
� L'application de gestion des taxes permet de définir des taux de taxes / TVA personnalisés. Elle offre la possibilité de choisir les taxes applicables pour chaque Types de produit et permet de combiner le Type d'utilisateur et le pays de livraison.
� Les produits peuvent ainsi être proposés en TTC en utilisant l'application Taxes ou HT si l'application Taxes n'est pas utilisées. La gestion des taxes sera utilisée en fonction de la nature BtoB ou BtoC du site de vente en ligne.
� Lorsqu'un taux de taxe est applicable, le prix du produit affiché au client intègre le montant de la taxe calculée.
Gestion des taxes
Tutoriel : Rubedo Commerce
� Pour afficher les prix TTC des différents produits d'un e-shop, le taux de TVA est appliquée par "Types de produits" Vêtement et Alimentation, le pays est remplacé par une étoile.
� Lorsque des taxes particulières sont applicables pour des clients souhaitant une livraison en dehors du pays natif du site e-commerce, le prix affiché sur le site prendra en compte les taux de taxes lorsque la personne aura sélectionné son pays de livraison.
Gestion des paiements
Tutoriel : Rubedo Commerce
� Par défaut Rubedo Commerce propose 3 modes de paiement :– Chèque
– Paypal
– Virement
� D’autres modes de paiement peuvent être ajoutés en fonction des besoins
Gestions des commandes
Tutoriel : Rubedo Commerce
� L'application Commandes permet de gérer les différentes ventes réalisées sur un site ecommerce. Elle permet :
– De consulter les commandes
– D'exporter les commandes (sélection de dates)
– Modifier le statut de paiement d'une commande (Payée, en attente de paiement, annulée)
– De joindre une facture à une commande
Gestions des commandes
Tutoriel : Rubedo Commerce
Behavior driven content and commerce
Transforme l’expérience digitale
www.rubedo-project.org
@Rubedo_project #Rubedo