Blog E-Commerce

Comment créer mon site e-commerce professionnel avec Botamp ?

July 01, 2021

De nos jours grĂące Ă  Botamp c’est facile de crĂ©er son site web sans grande connaissance en informatique. Vous pouvez simplement choisir parmi en un modĂšle de site web puis Ă©diter et personnaliser les informations.

Quoi que, si vous voulez créer un site web unique et professionnel vous devez passer par les 7 étapes en dessous. Ces étapes sont utilisées par les professionnels en développement web puis en design.

Dans cet article, je vous montrerai comment créer votre site web e-commerce en suivant ces étapes avec une étude de cas.

Étape 1 : DĂ©finition de l’objectif

La premiÚre étape est de définir les objectifs de votre site web et votre vision avant de le concevoir. Pour notre étude de cas, on va créer un site e-commerce de vente de chaussures de sport pour homme.

Prenez une feuille et suivez les Ă©tapes en mĂȘme temps que moi. Pour dĂ©finir vos objectifs, rĂ©pondez aux questions suivantes :

1. Quel est l’objectif de mon site ?

L’objectif principal de notre site sera de vendre des chaussures de marque à nos visiteurs. L’objectif secondaire sera de prendre leurs emails pour leur envoyer des offres de promotion plus tard.

2. Qui est mon public cible ?

C’est important de dĂ©finir une cible prĂ©cise pour pouvoir vous concentrer sur elle et personnaliser vos messages. Pour mon site web notre public cible, c'est des jeunes hommes bĂ©ninois de 19 et 30 ans qui aiment les musiques urbaines, le basketball et la mode.Vous pouvez regarder le profil de vos clients actuels pour dĂ©finir votre public cible.

3. Comment les utilisateurs atteignent-ils mon site Web ?

C’est bien de construire un site web, mais vous devez Ă©galement penser Ă  comment vous allez attirer vos premiers visiteurs. Dans notre cas, nous allons attirer les visiteurs avec nos rĂ©seaux sociaux, grĂące aux tĂ©moignages de nos clients et des collaborations avec des influenceurs.

4. Qu'est-ce que les visiteurs attendent de mon site Web ?

C’est quoi l’intention de vos visiteurs en venant sur votre site web ? En fonction de cette rĂ©ponse, vous saurez comment organiser votre site web et afficher exactement ce qu’ils recherchent.Nos visiteurs Ă  nous viendront pour avoir plus d’informations sur un produit, commander ou s’abonner Ă  notre newsletter.

5. Qu'est-ce que j'aime ou n'aime pas dans les sites Web de mes concurrents ?

C’est aussi important de regarder les sites web de la concurrence pour copier ce que vous trouvez bien et Ă©numĂ©rer ce que vous n’aimez pas. Vous devez donc lister des sites de vos concurrents directs ou des sites e-commerce que vous trouvez intĂ©ressants puis Ă©numĂ©rer ce que vous aimez. Au BĂ©nin, je ne connais pas particuliĂšrement de site e-commerce dans la vente de chaussure. Nous allons donc listĂ© les sites e-commerce de vente de chaussure en ligne et Ă©galement le modĂšle Simple Catalog de Botamp :


Ce que j’aime

  • Sur la page d’accueil ils mettent en avant leurs produits les mieux vendus
  • Partage tĂ©moignages clients
  • Ils ont montrĂ© la vision de leur boite

Ce que je n’aime pas

  • Ils ont utilisĂ© la page d’accueil pour afficher tous leurs produits
  • Ils n’ont pas demandĂ© l’email des visiteurs

6. Qu'est-ce qui me distingue de mes concurrents ?

Vous devez mettre en avant sur votre site web, vos points forts et comment vous vous distinguez de la concurrence. Listez donc ce que vous allez mettre en avant. Nous allons miser sur la qualitĂ© de nos produits et sur l’originalitĂ©.

Étape 2 : PrĂ©parer les images et les contenus de votre site

Regroupez toutes les informations importantes que vous voulez afficher sur votre site web, par exemple :

  • Les images de votre boite (logo, photos, vidĂ©os, etc.)
  • Les textes Ă©crits existants (votre slogan, mission, vision, etc.)
  • Les informations que vous avez sur votre cible
  • Les analyses de la concurrence
  • Les couleurs et les polices de votre entreprise Ă  utiliser pour votre site

Si vous arrivez Ă  regrouper tout ceci, vous ĂȘtes prĂȘt Ă  crĂ©er votre site web.

Étape 3 : CrĂ©er un plan du site

Un plan du site vous aide à visualiser la hiérarchie des pages dont vous aurez besoin sur votre site Web. Vous pouvez créer un plan du site à l'ancienne (stylo et papier) ou utiliser un outil en ligne.

Les étapes ci-dessus vous aideront à déterminer ce que vos utilisateurs attendent de votre site, ce qui vous aidera à comprendre les pages dont vous aurez besoin. Dressez le plan de vos pages et ajoutez une courte description afin de définir clairement l'objectif de chaque page.

Voici le plan du site du site web que l’on va construire :

  • Accueil : Guider les visiteurs aussi rapidement que possible vers les produits les plus vendus ou vers les informations qu’ils recherchent. Offrir un aperçu visuel des diffĂ©rentes pages avec de courtes descriptions et des liens.
    • Boutique : PrĂ©senter les diffĂ©rents produits que nous vendons en permettant de filtrer uniquement les produits par catĂ©gorie :
      • Basketball : Page dĂ©diĂ©e pour les produits de style Basketball
      • Lifestyle : Page dĂ©diĂ©e pour les produits de style Lifestyle
    • À propos : Nous allons renforcer l’image de notre marque, parler des fondateurs et assurer de la qualitĂ© de nos produits.
    • Contact : Permettre aux potentiels clients de nous contacter
    • Galerie : Un espace photos pour montrer les photos de notre produit vendu sur les pieds de nos clients

Étape 4 : CrĂ©er un site avec Botamp

Maintenant que nous avons prĂ©parĂ© tout ce qu’il faut, nous pouvons crĂ©er notre site web sur Botamp. Pour crĂ©er votre site web allez sur cette page, vous verrez la liste de tous les modĂšles que vous pouvez utiliser pour commencer.

Vous pouvez dĂ©cider de visiter ces liens et de choisir ce qui vous convient. Pour ce tutoriel moi je dĂ©cide de commencer par zĂ©ro en cliquant sur le bouton “Commencer de zĂ©ro”.

Si vous aviez un compte et avez dĂ©cidĂ© de crĂ©er un nouveau site, vous n’aurez pas Ă  crĂ©er un nouveau compte.

Nous devons choisir le nom et l’url de notre site web. Le choix de l’url est assez important, car c’est ce que vos utilisateurs vont taper pour venir sur votre site. Vous devez donc choisir une url unique et qui reprĂ©sente votre entreprise. Vous pouvez par exemple choisir le nom de votre entreprise.



AprÚs la création de votre compte, définissons le style de notre site en modifiant les couleurs et la police par défaut.

Botamp propose un guide de petites étapes à suivre pour créer son site web. Nous allons donc le suivre pour terminer les configurations.



En suivant les 2 premiĂšres Ă©tapes, nous allons remplir les informations de notre entreprise et ajouter les images dans les configurations.

Étape 5 : Ajouter les produits

Avant de créer nos pages, il manque cette derniÚre étape importante : ajouter nos produits sur Botamp.

Pour les ajouter, nous devons d’abord activer la fonctionnalitĂ© e-commerce sur notre site en allant dans les configurations, puis sur l’onglet e-commerce. Si vous utilisez un thĂšme e-commerce tel que Simple Catalog, il est probable que la fonctionnalitĂ© soit dĂ©jĂ  activĂ©e.

Nous pouvons ensuite ajouter nos produits en allant sur la page Catalogue. Ajoutez des images mettant en avant vos produits et une description qui incite l’utilisateur Ă  trouver le produit indispensable pour lui. Vous pouvez catĂ©goriser vos produits si comme moi vous avez plusieurs produits appartenant Ă  diffĂ©rentes catĂ©gories.


En créant votre produit, on va vous demander le lien de commande du produit. Botamp ne permettant pas à vos visiteurs de commander directement vos produits. Vous devez mettre le lien WhatsApp de votre numéro professionnel ou le lien de votre produit sur un site de paiement en ligne tel que Stripe, Fedapay, Beem Africa, etc.

J'ai utilisé Fedapay et créé les pages pour mes différents produits. Vous pouvez utiliser n'importe quel autre site de paiement en ligne en fonction des pays de résidences de vos clients.

Étape 6 : Personnaliser et crĂ©er des pages

Nous sommes maintenant prĂȘts Ă  personnaliser nos pages. On commence par la page d'accueil. Nous allons donc sur la liste des pages du site, puis nous allons crĂ©er notre premiĂšre page en cliquant sur “Nouvelle page” puis sur “Page vide” (vous pouvez aussi dĂ©cider de commencer avec les modĂšles proposĂ©s).

Avant de personnaliser proprement une page, nous devons en premier temps penser à réaliser une esquisse. Une esquisse vous permet de visualiser concrÚtement à quoi votre contenu va ressembler et comment vos visiteurs pourront interagir avec, sans pour autant penser à un contenu détaillé.

Pour notre page d'accueil donc, voici les différentes sections que cela va comporter :

  1. Le menu du site
  2. Accueillir visiteurs avec une image de sneakers en fond d'Ă©cran et appel Ă  l'action de visualiser tous nos produits
  3. Une petite description de nos valeurs et la présentation de nos 2 catégories de sneakers avec 2 boutons pour accéder aux sneakers de chaque catégorie
  4. Une mise en lumiĂšre de nos valeurs en image et en 3 points
  5. 3 de nos produits les mieux vendus avec un bouton pour commander sous chaque produit
  6. Un formulaire pour demander Ă  l’utilisateur de laisser son email pour ĂȘtre au courant de prochaines promotions
  7. Un début de galerie de nos clients avec leurs chaussures
  8. Un pied de page pour accĂšs rapide et contact

Faites comme moi et Ă©crivez par ordre d'affichage ce que vous voulez afficher sur votre page d'accueil.

AprĂšs avoir listĂ© ce que vous voulez afficher, cherchez sur Botamp les sections qui ressemblent Ă  ce que vous visualisez dans votre tĂȘte.

Chez nous, ça donne ceci :


Maintenant nous pouvons modifier ces esquisses avec le bon texte, les bonnes images et le bon style.

NDLR : N’oubliez pas de donner un nom à votre page (ex : Accueil) et de l’enregistrer au fur et à mesure pour ne pas perdre votre travail

Vous pouvez changer la couleur des sections et supprimer ce qui ne vous plait pas.

Nous pouvons également augmenter la taille de certaines colonnes si nécessaire :

Vous pouvez aussi changer les couleurs et la police de tout votre site depuis l’onglet Style.

Remplacez les images par vos propres images pour ajouter de l’authenticitĂ© Ă  votre marque et vos produits. Vous pouvez Ă©galement trouver des images sur Iwaria ou sur Pexels. Si vous voulez utiliser des icĂŽnes, vous pouvez les rechercher sur Flaticon.

NDLR : Assurez-vous d’ajouter des images de petites tailles pour ne pas surcharger votre site et ralentir son chargement.

Aprùs modification du texte et ajout des images, voici le rendu final de notre page d’accueil :


Joli n’est-ce pas 😉 !?

Il manque juste quelques Ă©lĂ©ments et notre site sera opĂ©rationnel. Notre menu actuellement n’affiche rien et ne redirige vers aucune autres pages et les boutons sur la page ne redirigent vers rien non plus.

Pour que les boutons marchent, vous devez mettre un lien vers une page. Vous pouvez rechercher le lien de la page si vous n’avez pas le lien en tĂȘte. Tous vos produits ont un lien de page, ainsi que leurs catĂ©gories.

Maintenant, il ne manque plus que d’ajouter le lien des autres pages qu’on avait dĂ©fini dans le plan du site.

Nous avons créé la page Accueil, mais il nous reste à créer les pages suivantes :

  • Boutique
  • À propos
  • Contact
  • Galerie

La page Boutique a Ă©tĂ© crĂ©Ă©e automatiquement dĂšs que vous avez activĂ© la fonctionnalitĂ© e-commerce : c’est la page Catalog (ou Catalogue).

Une page Catalog product (ou Produit du catalogue) a Ă©tĂ© automatiquement crĂ©Ă©e Ă©galement. C’est le modĂšle de toutes les pages de chacun de vos produits. Quand un visiteur va cliquer pour voir le dĂ©tail d’un produit, il va tomber sur une page avec ce format, mais avec les informations du produit sur lequel il a cliquĂ©.

Pour crĂ©er ainsi les autres pages, vous pouvez faire comme ce qu’on a fait prĂ©cĂ©demment ou commencer avec les modĂšles proposĂ©s quand vous cliquez sur Nouvelle page.

NDLR : Avant de quitter la page d’accueil pour crĂ©er les autres pages, n’oubliez pas de dĂ©finir la page comme page d’accueil dans les configurations afin que lorsqu’on tape l’url de votre site web, ce soit cette page qui s’affiche !

N’hĂ©sitez pas Ă  nous contacter depuis l’application si vous rencontrez des problĂšmes pendant la crĂ©ation de votre site.

Vous pouvez voir en dessous quelques sites web e-commerce conçus avec Botamp :

Cica beauté

François Xavier A.

La marque Houefa

Noar cosmetic

Étape 7 : Publier et configurer un domaine personnalisĂ© et professionnel

Jusqu’à prĂ©sent, si vous aviez essayĂ© de visualiser les pages que vous avez crĂ©Ă©, vous avez dĂ» voir une page qui vous dit que votre site n’est pas publiĂ©. En effet, pour assurer que votre site reste privĂ© jusqu’à ce que vous ne soyez prĂȘt, il n’est pas automatiquement publiĂ©.

Si votre site est prĂȘt et que vous avez crĂ©Ă© toutes vos pages, vous pouvez publier votre site et y accĂ©der pour voir le rendu sur votre Ă©cran. Testez ensuite sur votre tĂ©lĂ©phone pour vous assurer que tout est comme vous voulez.

Une fois vérifications faites, vous pouvez partager le lien dans vos réseaux, à vos clients ou futurs clients pour commencer à vendre.

Il manque toutefois une derniĂšre chose pour renforcer l’image de votre entreprise et ĂȘtre plus professionnel : avoir un domaine personnalisĂ© et propre Ă  vous.

Actuellement le nom de votre domaine doit ressembler Ă  ça : votrenomdesite.botamp.site. Pour le rendre plus professionnel il doit ressembler Ă  ceci : votrenomdesite.com.  Ainsi votre entreprise aura plus de crĂ©dibilitĂ© et cela va rassurer vos prospects sur votre professionnalisme.

En plus des nombreux avantages de souscrire à un plan pro de Botamp, vous obtenez gratuitement un nom de domaine personnalisé que nous configurons en plus pour vous.

Vous ĂȘtes maintenant prĂȘt pour crĂ©er un site web e-commerce professionnel ! N’hĂ©sitez pas Ă  crĂ©er un compte pour commencer Ă  crĂ©er votre site web.

Le site web que nous avons construit ensemble est également un modÚle dont vous pouvez vous inspirer pour débuter.

Partager :