Créer une boutique en ligne avec l'IA, c'est simple sur le papier : vous décrivez le site que vous voulez, et l'intelligence artificielle le construit. Mais avec certains outils, la moindre retouche doit passer par une nouvelle demande à l'IA, même pour changer trois mots ou remplacer une image. Et parfois, elle modifie autre chose au passage.
Le créateur IA de Hostinger propose une autre approche : l'IA construit la structure, puis vous faites vous-même les retouches en cliquant sur le texte, et vous ajoutez vos produits depuis une interface e-commerce. Dans ce tutoriel, vous suivez la création complète de « L'Affiche Chic », une boutique d'affiches numériques à télécharger, avec un outil qui permet de visualiser chaque affiche dans un salon avant de l'acheter. Chaque étape est détaillée pour que vous puissiez adapter la méthode à votre propre projet.
Le principe : l'IA construit, vous gardez la main
Mode agentique ou mode manuel
Le créateur IA de Hostinger propose deux modes :
-
Le mode agentique : vous construisez en discutant. Vous expliquez ce que vous voulez, l'IA s'en charge, puis vous demandez des ajustements. Par exemple : « Crée un site pour une entreprise de peinture, puis ajoute un calculateur pour estimer le prix des travaux selon la surface à peindre. » Vous pouvez aussi joindre des images ou des fichiers PDF pour partir de vos propres documents.
-
Le mode manuel : vous construisez vous-même dans un éditeur visuel, par glisser-déposer, avec l'IA en soutien si besoin.
Ce tutoriel utilise le mode agentique. Cela ne vous oblige pas à tout confier à l'IA, car ce mode intègre aussi des outils de modification.
L'option « Sélectionner & modifier »
C'est la fonction clé de l'outil. Elle vous permet de retoucher le contenu créé par l'IA sans rédiger de nouvelle demande, et donc sans consommer de crédits IA. Vous la verrez en action plus bas.
Choisir sa formule Hostinger pour créer une boutique en ligne
Les prix indiqués sont ceux affichés au moment du tournage de la vidéo. Ils peuvent avoir changé depuis.
Pourquoi la formule Unlimited
Sur la page du créateur IA, trois formules sont proposées : Premium, Unlimited et Cloud Startup. Pour une boutique, je vous recommande Unlimited. C'est selon moi le meilleur compromis entre fonctionnalités et prix, en particulier parce qu'elle permet de créer une boutique en ligne. Elle comprend :
-
le créateur de site, les outils IA et l'hébergement ;
-
la création de plusieurs sites, sans limite de nombre annoncée ;
-
un nom de domaine offert pendant un an ;
-
des boîtes mail professionnelles gratuites la première année ;
-
des crédits IA offerts une seule fois pour démarrer (15 crédits au début du tournage, avant un changement de système expliqué plus bas).
Durée : pourquoi choisir 48 mois
Si vous comptez développer votre site sur le long terme, la durée de 48 mois vous permet de garder le tarif de souscription pendant 4 ans. Vous connaissez dès le départ le coût du pack sur toute la période. Ensuite, le renouvellement annoncé était de 16,99 € par mois.
Attention : le prix est affiché par mois pour comparer les offres, mais les 4 années se règlent en une seule fois.
Ajouter l'option Hostinger E-commerce
Pour vendre des produits, il faut ajouter l'option Hostinger E-commerce. L'offre de départ coûtait 1 € pour 3 mois, puis 7,99 € par mois pour une période de 12 mois. Ce montant s'ajoute au pack Unlimited : prévoyez-le dans votre budget.
Choisir le nom de domaine
C'est l'adresse que vous allez partager pour faire connaître votre site : choisissez-la avec soin. Pour la boutique de l'exemple, j'ai recherché « laffichechic » et retenu l'extension .eu :
-
la première année est offerte ;
-
2 années supplémentaires coûtaient 12,98 € au total, pour réserver l'adresse sur 3 ans ;
-
le renouvellement affiché ensuite était de 6,49 € par an.
Hostinger propose aussi d'acheter d'autres extensions du même nom. C'est utile pour protéger des adresses proches, mais pas indispensable pour commencer.
Appliquer le code promo
Si vous passez par le lien affilié alpa14.com/hostinger, vous bénéficiez de 10 % de remise supplémentaire :
1. Cliquez sur Vous avez un code promo ?
2. Saisissez ALPA14.
3. Cliquez sur Appliquer.
Dans l'exemple, la remise atteignait 19,15 €. Le pack revenait à 3,59 € par mois, pour un total de 223,62 € TTC avec toutes les options choisies.
Avant de valider, vérifiez les durées dans le récapitulatif : ici 4 ans pour le pack, 3 ans pour le domaine et 3 mois pour l'offre de départ e-commerce. Tout ne se renouvelle pas au même moment.
Offre Black Friday : pendant le tournage, Hostinger a publié ses offres Black Friday avec de nouvelles offres toujours cumulables avec le code ALPA14. Vérifiez si l'offre est toujours en cours.
Créer son compte et payer
1. Si vous avez déjà un compte Hostinger, cliquez sur Connexion. Sinon, inscrivez-vous avec Google ou avec une adresse email et un mot de passe.
2. Le numéro de téléphone est facultatif. La case en dessous concerne les offres par WhatsApp et SMS : laissez-la décochée si vous ne voulez pas les recevoir.
3. Cliquez sur S'inscrire, complétez votre adresse de facturation, cliquez sur Continuer, puis passez au paiement.
Vous accédez ensuite à votre espace d'administration en vous connectant en haut à droite du site.
Créer la boutique en ligne avec l'IA Hostinger
Lancer la création du site
Dans l'espace d'administration, votre formule et votre nom de domaine apparaissent. Cliquez sur Créer ou migrer, puis sur Créer un nouveau site. Hostinger propose alors quatre façons de construire votre site :
1. Décrivez-le, nous le construisons : le créateur IA, adapté aux débutants. C'est l'option choisie ici.
2. WordPress : Hostinger installe le CMS, et vous construisez ensuite votre site.
3. Héberger du code : Hostinger publie et héberge un site ou une application dont le code a été généré, par exemple, par l'IA Claude.
4. Héberger un site existant codé ailleurs, en PHP ou en HTML.
Choisissez ensuite le mode agentique, sélectionnez votre nom de domaine, puis cliquez sur Suivant. Une zone vous demande ce que vous voulez créer. Vous pouvez aussi partir d'un template, c'est-à-dire d'un site déjà structuré, mais ce tutoriel démarre avec un prompt.
Préparer des prompts simples et clairs
Avancez pas à pas, avec des prompts courts et précis. Un prompt de 20 lignes avec des dizaines d'instructions risque de perdre l'IA.
Une méthode pratique : expliquez votre projet à votre IA habituelle (ChatGPT, Gemini, Claude ou une autre), puis demandez-lui de le découper en plusieurs prompts simples. Après quelques échanges, j'ai obtenu ainsi 5 prompts pour poser les bases de ma boutique.
Vous trouverez ci-dessous les prompts utilisés pour L'Affiche Chic. Copiez-les et servez-vous-en comme modèles : remplacez le nom de la boutique, le style et les produits par les vôtres.
Premier prompt : la structure de la boutique
Prompt – structure de la boutique
Crée une boutique épurée en français appelée L'Affiche Chic pour vendre des affiches d'art numérique à télécharger en PDF. Style galerie d'art contemporaine, fond blanc cassé. Utilise ces 4 affiches que je joins avec leur prix et un bouton Télécharger le PDF pour chacune.
Collez le prompt, joignez vos fichiers (ici les 4 affiches en PDF), puis envoyez. L'IA établit un plan et construit le site en quelques minutes.
Le résultat correspond à la demande : un style galerie épuré, un fond blanc cassé, les 4 affiches avec leur bouton et une section « mode d'emploi » (choisir l'affiche, commander le PDF, l'imprimer). Cette première génération a consommé un peu plus d'un crédit IA.
Modifier le texte sans consommer de crédits IA
Pour retoucher le texte vous-même :
1. Activez le bouton Sélectionner & modifier en haut à gauche.
2. Survolez la page : chaque zone de texte devient modifiable.
3. Cliquez sur le texte à changer.
Un menu apparaît. Vous pouvez y changer gratuitement la couleur, la police et la taille, mettre en gras, en italique ou souligner, aligner le texte et ajouter des liens. Dans l'exemple, je remplace « un peu d'art » par « un peu de souvenirs », puis je clique sur Appliquer. Le solde de crédits ne bouge pas.
Le même menu propose aussi Modifier avec l'IA. La demande porte alors sur l'élément sélectionné, ce qui évite les malentendus.
Vérifier la vue mobile et corriger avec un prompt ciblé
Un aperçu mobile est disponible en haut à droite. C'est une vérification importante, car beaucoup de visiteurs consultent les sites sur leur téléphone. Le site est responsive : la rangée de 4 vignettes passe sur deux rangées de 2.
Problème repéré : sur mobile, deux des trois éléments du menu étaient masqués. Ce genre de détail apparaît forcément en cours de route. Corrigez-le avec un petit prompt glissé entre vos prompts principaux.
Le plus efficace est de cibler l'élément :
1. Activez Sélectionner & modifier et cliquez sur le menu.
2. Choisissez Modifier avec l'IA.
3. En une phrase, demandez la création d'un menu hamburger pour la vue mobile.
4. Cliquez sur Ajouter un commentaire, puis sur Appliquer.
Le menu hamburger (les trois petits traits qui ouvrent un menu déroulant) a été créé. Quand vous parlez à l'IA à propos d'un élément précis, elle comprend mieux la consigne.
Tester le parcours d'achat
Testez votre boutique en conditions réelles. Le mode de paiement test simule tout le processus d'achat sans argent réel et crée une commande test.
Ce premier test a révélé trois points à corriger :
-
le bouton Télécharger le PDF menait directement au panier, sans fiche produit ;
-
l'email de confirmation reçu par le client ne contenait pas de lien de téléchargement ;
-
les prix et l'email reçu par le vendeur étaient en couronnes suédoises et en suédois, car Hostinger avait détecté ma localisation (en Suède). Ce réglage se change dans le module e-commerce.
Créer les pages produits
Pour ajouter une fiche produit, j'ai dicté ce prompt grâce au micro de l'outil :
Prompt – pages produits
Crée 4 pages produit distinctes, une page par affiche, et ne modifie rien d'autre sur le site.
La première tentative a échoué. L'IA a proposé de recommencer, et la seconde a fonctionné : chaque affiche dispose maintenant de sa page, à compléter. Cette étape a coûté 2,43 crédits.
Restaurer une version précédente
Si un résultat ne vous convient pas, remontez jusqu'au prompt concerné et cliquez sur Restaurer. Le site revient à son état d'avant ce prompt. Retenez cette fonction : l'IA peut parfois dérailler. La consommation de crédits de chaque prompt s'affiche au même endroit.
Ajouter un outil sur mesure : le visualiseur d'affiches
Le créateur IA peut aussi programmer un outil intégré au site, comme le ferait un développeur. Ici, il s'agit de visualiser chaque affiche sur le mur d'un salon.
Le prompt du visualiseur
Prompt – visualiseur d'affiches
Ajoute juste après l'accueil un encadré Visualiser votre affiche. Utilise une photo de salon moderne prise bien de face avec un mur dégagé au-dessus d'un canapé. Place la première affiche du catalogue dans un cadre noir sur ce mur avec une ombre portée réaliste et un léger reflet de verre pour une intégration naturelle et professionnelle.
Corriger quand l'IA se trompe
L'IA a affirmé avoir placé l'affiche, alors que le salon était vide. Pas besoin de tout réécrire : il a suffi de lui signaler, en une phrase, qu'elle n'avait pas fait ce que demandait le prompt précédent. L'affiche est alors apparue au bon endroit, avec un cadre un peu trop épais.
Rendre les vignettes cliquables
Le prompt suivant ajoute la sélection des affiches et corrige le cadre :
Prompt – vignettes cliquables
Sous ce salon, ajoute un petit titre Cliquez sur votre affiche pour la visualiser, suivi des vignettes des quatre affiches du catalogue en petit. Quand l'utilisateur clique sur une affiche, elle remplace instantanément celle qui est dans le cadre sans déformer ses proportions, et réduis l'épaisseur du cadre noir de moitié.
Les vignettes sont apparues et le cadre a été affiné, mais le clic ne changeait pas l'affiche.
Se faire aider par l'agent IA
Quand vous êtes bloqué, sollicitez l'agent IA. Son analyse : le prompt demandait trois choses à la fois. Pour isoler le problème, il a conseillé de sélectionner la section du salon avec Sélectionner & modifier, puis d'envoyer un prompt plus ciblé, qu'il a rédigé lui-même. Après application, le visualiseur fonctionnait. L'agent joue le rôle d'un coach à qui vous pouvez demander une astuce au bon moment.
Ajouter les pages légales
Pour créer les pages légales, j'ai dicté ce prompt :
Prompt – pages légales
Crée trois pages distinctes : une pour les conditions générales d'utilisation, une pour la politique de confidentialité et une pour la politique de remboursement. Tu placeras le lien vers ces pages dans le menu du bas et ne modifie rien d'autre dans le site.
Les trois pages apparaissent dans le pied de page. Elles fournissent une base de texte, que vous pouvez compléter avec Sélectionner & modifier, sans crédits.
Conseil à vérifier : faites relire ces textes générés par l'IA pour vous assurer qu'ils correspondent à votre activité et à la réglementation qui s'applique.
Suivre sa consommation de crédits IA
Gardez un œil sur votre solde : chaque prompt consomme des crédits, surtout pendant la construction de la structure. Les retouches de texte manuelles, elles, sont gratuites.
Pendant le tournage, Hostinger a changé son système : les crédits fonctionnent désormais aussi avec l'agent IA, et chaque ancien crédit vaut maintenant 50 nouveaux crédits. La consommation affichée est plus élevée, sans que le prix change. La formule affichait alors 500 crédits. Quelques repères :
-
la création des trois pages légales a coûté 43,78 nouveaux crédits ;
-
à la fin du projet, il restait 163,65 crédits ;
-
vous pouvez acheter des crédits supplémentaires. Au moment du tournage, environ 2 500 crédits coûtaient une vingtaine d'euros.
Si la structure de votre site est plus complexe, un achat de crédits peut valoir le coup, d'autant que les mises à jour de texte se font ensuite sans IA.
Configurer le module e-commerce Hostinger
Cliquez sur E-commerce en haut de l'éditeur pour accéder à l'interface de gestion de la boutique.
Tour d'horizon de l'interface
Vous y trouvez les canaux de vente, les commandes, les statistiques, les clients, les produits et les catégories. Vous pouvez aussi proposer des rendez-vous et des réservations en ligne, et créer des abonnements. Avec l'option Reach, vous accédez à l'emailing pour recontacter vos clients ou envoyer une newsletter.
Créer un code de réduction
1. Ouvrez Codes de réduction, puis Ajouter un code de réduction.
2. Choisissez un pourcentage ou un montant fixe (ici, ALPA14 à 10 %).
3. Appliquez-le à tous les produits ou à une catégorie.
4. Donnez-lui un nom interne pour vous y retrouver (ici, « Audience YouTube »), puis enregistrez.
Régler les paramètres de la boutique
Dans Paramètres, ajoutez votre logo et le nom de la boutique, puis réglez la devise (passage en euros), la langue (français), votre adresse email, votre code postal et votre pays.
Paiement, CGU, taxes et factures
-
Paiement : Stripe, PayPal, Paysera, ou paiement manuel (espèces à la livraison, virement ou autre méthode).
-
Livraison : pour les produits physiques.
-
Conditions générales : collez ici l'adresse des pages légales créées plus tôt.
-
Taxes et factures : règles particulières et modèle des factures générées automatiquement.
Envoyer les emails depuis votre nom de domaine
Dans Emails, choisissez votre nom de domaine comme expéditeur. Si Hostinger signale des enregistrements DNS manquants, cliquez pour les configurer automatiquement. Les emails partent alors d'une adresse du type noreply@laffichechic.eu, plus professionnelle et que vous pouvez personnaliser. Vous pouvez aussi ajouter votre logo et prévisualiser chaque email automatique : téléchargement du fichier numérique, carte cadeau, etc.
Les intégrations
Les intégrations relient votre boutique à d'autres services. Printful, par exemple, permet l'impression à la demande : une piste pour proposer des affiches imprimées.
Remplacer les produits de service par des produits numériques
C'est ce qui expliquait l'absence de lien de téléchargement : lors du premier prompt, l'IA avait créé des produits de service. Pour livrer un fichier après paiement, il faut des produits numériques.
Créer un produit numérique
1. Dans Produits, cliquez sur Ajouter un produit, puis choisissez Produit numérique (téléchargeable via un lien après l'achat).
2. Importez l'image de l'affiche, et d'autres visuels si vous le souhaitez.
3. Saisissez le titre (ici « Affiche 01 »), un sous-titre facultatif et, si vous voulez, un ruban comme « Nouveauté ».
4. Rédigez la description. La barre de mise en forme vous permet de la structurer avec des titres H2, utiles pour le référencement. Vous pouvez aussi ajouter des images ou une vidéo YouTube, et vous faire aider par l'IA.
5. Indiquez le prix (ici 15 €) et joignez le fichier PDF qui sera téléchargé après le paiement.
6. Ajoutez des informations supplémentaires si besoin, puis enregistrez.
Répétez l'opération pour chaque produit. Les nouveaux produits apparaissent automatiquement dans la galerie et dans le visualiseur.
Supprimer les anciens produits
Les nouveaux produits s'ajoutant automatiquement, la boutique affichait tout en double. Il suffit de supprimer les anciens produits de service dans Produits, sans passer par l'IA ni consommer de crédits.
Tester une commande complète
Nouveau test : ajout d'une affiche au panier, saisie de l'email et du nom, puis du code ALPA14. La réduction de 1,50 € s'applique, pour un total de 13,50 €. Après le paiement test, l'email « Votre téléchargement est prêt » arrive avec le lien vers le PDF, prêt à imprimer.
Publier votre boutique en ligne
Tant que vous n'avez pas publié, votre adresse n'affiche rien. Quand le site est prêt, cliquez sur Publier en haut à droite. La mise en ligne prend quelques minutes. Rafraîchissez ensuite votre adresse : la boutique est en ligne, avec le visualiseur, la galerie, les pages produits et les pages légales.
Ensuite, vous ajoutez de nouveaux produits depuis le module e-commerce, et la galerie se met à jour automatiquement, sans crédits IA.
5 étapes pour améliorer le référencement de votre boutique avec l'IA
Une belle boutique ne sert à rien si personne ne la trouve. L'IA d'Hostinger peut vous aider à travailler votre visibilité dans les moteurs de recherche :
1. Faire un état des lieux. Demandez à l'IA d'analyser le référencement de la boutique sans rien modifier : titres, textes, images, affichage mobile. Elle classe les problèmes par priorité.
2. Optimiser les pages principales. Après avoir vérifié cette analyse, faites optimiser les titres et descriptions qui apparaissent dans les résultats de recherche, avec les expressions qui décrivent votre offre (ici, « affiche numérique à télécharger »). Précisez de ne changer ni la mise en page ni l'adresse des pages.
3. Travailler chaque fiche produit. Faites améliorer les titres et les descriptions (ici, préciser qu'il s'agit d'affiches à télécharger en PDF et à imprimer), ainsi que les textes alternatifs des images.
4. Renforcer les liens internes et ajouter une FAQ. Demandez de mieux relier l'accueil, la galerie et les fiches produits, sans liens vers les anciens produits, et d'ajouter une FAQ avec des questions que les internautes posent souvent.
5. Faire une dernière vérification. Avant de publier, demandez un contrôle des titres, des descriptions, des liens et de l'affichage mobile, toujours sans modification automatique. L'IA vous liste les problèmes restants par priorité.
Conclusion
Le créateur IA de Hostinger vous permet de créer une boutique en ligne avec l'IA, même si vous débutez, sans perdre la main sur le contenu. L'IA construit la structure et programme des outils sur mesure. Vous retouchez ensuite les textes avec Sélectionner & modifier et vous gérez vos produits depuis le module e-commerce, sans consommer de crédits. L'IA vous fait gagner du temps, mais vérifiez toujours ses propositions avant de publier, et pensez à la fonction Restaurer quand un prompt ne donne pas le résultat attendu.
Prochaine étape : notez votre projet de boutique, demandez à votre IA habituelle de le découper en 4 ou 5 prompts simples, puis lancez-vous en vous inspirant des prompts de cet article. Si vous choisissez Hostinger, le lien affilié alpa14.com/hostinger et le code ALPA14 vous donnent 10 % de réduction supplémentaire. Et dites en commentaire de la vidéo ce que vous aimeriez créer.
Envie de découvrir plus d'outils incroyables ? Abonnez-vous à la chaîne Alpa14 et activez la cloche pour ne manquer aucun futur tutoriel !
➡️ https://www.alpa14.com/abonnement-chaine-youtube
