Rubedo commerce, tutoriel de création de sites ecommerce

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


� 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


� 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



� 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


� 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



� 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 …


� 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 :


� 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


� 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.



– Dans l'application Type de contenu, cliquer sur "Ajouter"

– Indiquer le nom du type de produit, puis sélectionner "Configurable"


� 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.


� 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.


� Les variations sont ensuite visibles aux internautes sur les fiches produits dans un « Product box » :


� Onglet Taxonomie– Sélectionner les vocabulaires de taxonomie associés (Multi classement des

contenus avec la taxonomie).



� 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.


� 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.


� 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.


� 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.




� 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é.


Etape 5 - Création des produits


� 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.



� 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



� Le formulaire de saisie d’un nouveau produit s’affiche



� 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



� Product settings / Caractéristiques



� 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.



� Appliquer des réductions / Promotions– Les réductions sont applicables aux variations de produits et peuvent être

programmées.



� 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


� 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.



� Voir Tutoriel : Masques de pages

Liste des Masques de page

Exemple de Masque de page

Menu contextuel des Masques


� 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




� Les blocs e-commerce sont ajoutées dans les pages ou les masques.– Liste des blocs



� 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.



� 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".



Format bouton

Format Détail

Bloc Panier

Etape 6 - Création des pages de catégories et des produits


� 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.


� 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".


� Des pages destinées aux clients :



� Détail des commandes : Ce bloc permet d’afficher les détail d’une commande dans une page.



� 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 2 : Indiquer les informations de Catégories (Titre, description et images) dans les pages Robes et T-shirt.



� 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 :



� 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.



� 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



� 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é



� 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


� 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


� 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


� 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


� Une alerte visuelle permet de distinguer les produits n'ayant plus de stock

Gestion des taxes


� 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


� 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


� 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


� 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


Behavior driven content and commerce

Transforme l’expérience digitale

www.rubedo-project.org

@Rubedo_project #Rubedo

Technology

Rubedo commerce, tutoriel de création de sites ecommerce