Comment créer une page "Bientôt disponible" pour WooCommerce (2 méthodes) 

Votre boutique n'est pas encore prête pour les clients, mais l'URL fonctionne et quiconque la trouve voit une boutique à moitié construite.

Une page "Bientôt disponible" pour WooCommerce résout ce problème, et vous avez deux façons de la mettre en place : le paramètre que WooCommerce fournit déjà, ou une page que vous concevez vous-même. Je vais vous guider à travers les deux, en commençant par celle que vous avez déjà.

Dans ce guide :

• Pourquoi créer une page "Bientôt disponible" pour WooCommerce ?
• Méthode 1 : Le mode "Bientôt disponible" intégré de WooCommerce
• Méthode 2 : Créez la vôtre avec SeedProd
• Que se passe-t-il si vous activez les deux ?
• Comment afficher un produit unique comme "Bientôt disponible"
• Pourquoi mon site affiche-t-il "Bientôt disponible" ?
• Questions fréquemment posées

Pourquoi créer une page « Prochainement » WooCommerce ?

Une page "Bientôt disponible" permet de garder votre boutique en ligne inachevée hors de vue. Vous contrôlez ce que les gens voient, au lieu de les laisser trouver une page d'erreur ou une vitrine à moitié construite.

Bien faite, cependant, une page "Bientôt disponible" vous rapporte quelque chose pendant que la boutique est fermée :

• Donnez aux visiteurs les détails sur la date de lancement de votre boutique
• Créez de l'enthousiasme pour le jour du lancement avec des comptes à rebours
• Collectez des adresses e-mail et développez votre liste avec des formulaires d'inscription
• Offrez des réductions et des promotions pour attirer les clients avant votre lancement
• Prenez une longueur d'avance dans le classement des moteurs de recherche avec une page web indexable

Vous avez deux façons de la mettre en place, et la première se trouve déjà dans vos paramètres WooCommerce.

Méthode 1 : Le mode "Bientôt disponible" intégré de WooCommerce

Depuis WooCommerce 9.1, masquer votre boutique est un paramètre plutôt qu'un plugin. Allez dans WooCommerce » Paramètres » Visibilité du site et passez de "En ligne" à "Bientôt disponible".

C'est tout le travail. WooCommerce remplace vos pages de boutique par son propre modèle de maintien et empêche les visiteurs d'y accéder. C'est le défaut

Vous avez également votre mot à dire sur la façon dont il se cache. Laissé tel quel, votre site entier disparaît, mais activez Appliquer uniquement aux pages de la boutique et il ne masque que vos pages de boutique, de panier, de paiement et de compte, laissant votre blog et votre page "À propos" lisibles.

Sur une boutique qui reçoit déjà du trafic, je l'activerais à chaque fois, car les pages que Google a déjà indexées continuent de fonctionner pendant que la boutique est en cours de construction.

Si vous avez besoin de montrer la vraie boutique à un client ou à un développeur, activez Partager votre site avec un lien privé. Quiconque ouvre ce lien navigue dans la boutique en direct, et WooCommerce s'en souvient pendant 90 jours.

Le paramètre intégré a cependant une seule limite réelle : il vous donne une page de maintien comme celle ci-dessous, pas une page de lancement.

Vous obtenez un titre et une ligne de texte. Il n'y a pas de compte à rebours, pas de formulaire d'inscription par e-mail et pas de contrôle significatif sur la conception.

C'est bien si tout ce que vous voulez, c'est que la boutique soit fermée. C'est un problème si vous voulez collecter des adresses e-mail avant d'ouvrir, ce qui est le but d'une page de pré-lancement pour la plupart des boutiques que j'ai gérées.

Méthode 2 : Comment créer une page "Bientôt disponible" pour WooCommerce avec SeedProd

Si vous voulez une page qui vend réellement le lancement, vous devez la construire vous-même. C'est la voie que j'emprunte sur les boutiques que j'ai gérées, en utilisant SeedProd.

SeedProd est un constructeur de sites web WordPress par glisser-déposer. Son éditeur visuel en direct vous permet de créer une page "Bientôt disponible" pour votre boutique et de voir chaque modification au fur et à mesure, vous n'avez donc jamais à toucher au code.

Vous pouvez également utiliser SeedProd pour créer un thème WooCommerce personnalisé avec glisser-déposer.

Voici ce que vous obtenez et que le réglage intégré n'offre pas :

• Un mode maintenance distinct ainsi que "Bientôt disponible", pour lorsque vous modifiez une boutique déjà ouverte
• Une bibliothèque de modèles "Bientôt disponible" prêts à l'emploi pour commencer, vous n'avez donc pas à concevoir à partir d'un écran vierge
• Des blocs pour les en-têtes, les appels à l'action, les témoignages et les comptes à rebours, vous construisez donc une page plutôt qu'un avis
• Des blocs WooCommerce pour ajouter au panier, panier et paiement, vous pouvez donc prendre des précommandes à partir de la page elle-même. Il est bon de savoir qu'un paiement fonctionnel signifie que votre boutique n'est pas vraiment cachée, alors n'utilisez ces blocs que si la vente avant le lancement est le plan
• Suivez et gérez les inscriptions avec le tableau de bord des abonnés
• Intégrez avec des plateformes marketing populaires comme Constant Contact et ActiveCampaign
• Protection anti-spam contre les bots et les soumissions de formulaires frauduleuses

Vous n'aurez besoin ni d'un développeur ni d'une seule ligne de code pour tout cela.

Tutoriel vidéo

Étape 1 : Installer et activer SeedProd

Cliquez sur le bouton ci-dessous pour obtenir votre copie de SeedProd et créer votre compte.

Limite de la version gratuite : il existe une version gratuite de SeedProd qui gère le mode "Bientôt disponible". J'utilise la version Pro ici car le compte à rebours et les intégrations d'e-mails sont ce qui rend une page de lancement digne d'être construite.

Ensuite, installez et activez le plugin sur votre site web WordPress. Si vous avez besoin d'aide pour cette étape, suivez ce guide facile sur l'installation d'un plugin WordPress.

Après avoir installé et activé SeedProd, accédez à SeedProd » Paramètres depuis votre tableau de bord WordPress. Cela vous permet de saisir votre clé de licence afin d'accéder aux mises à jour du plugin et aux fonctionnalités avancées.

Vous pouvez trouver votre clé de licence SeedProd dans votre compte sur le site web SeedProd, sous l'onglet Téléchargements.

Après avoir saisi votre clé de licence, cliquez sur le bouton Vérifier la clé, et vous êtes prêt à commencer à créer votre page WooCommerce "Bientôt disponible".

Étape 2 : Configurer une page « Prochainement »

Pour commencer à créer votre page WooCommerce "Bientôt disponible", rendez-vous sur SeedProd » Pages depuis votre panneau d'administration WordPress.

Cet écran montre plusieurs options pour créer différents types de pages sur votre site WordPress, y compris :

• Mode "Bientôt disponible" – Créez une page "Bientôt disponible" pour tout type de site web en construction.
• Mode Maintenance – Affichez un message de maintenance lorsque vous effectuez des modifications mineures ou des mises à jour.
• Page de connexion – Remplacez l'écran de connexion par défaut par une page de connexion WordPress personnalisée.
• Page 404 – Configurez une page d'erreur 404 personnalisée pour que les utilisateurs restent plus longtemps sur votre site.

Sous cette section, vous pouvez également créer n'importe quelle page de destination autonome que vous souhaitez.

Mais pour ce tutoriel, vous voudrez sélectionner le bouton "Configurer une page "Bientôt disponible".

Ensuite, vous verrez la bibliothèque de modèles réactifs de SeedProd. Sous le filtre "Bientôt disponible", vous pouvez voir divers modèles de pages "Bientôt disponible" qui sont prêts à être utilisés immédiatement.

Survolez n'importe quel modèle pour voir les options de prévisualisation, et cliquez sur l'icône de coche pour choisir ce design.

Après avoir choisi votre modèle de page "Bientôt disponible", SeedProd s'ouvre et l'affiche dans le constructeur de pages par glisser-déposer. C'est sur cette page que vous pouvez personnaliser votre page WooCommerce "Bientôt disponible".

Étape 3 : Personnalisez votre page "Bientôt disponible" pour WooCommerce

Chaque élément de la page est modifiable dans l'éditeur visuel de SeedProd. Cliquez sur n'importe quelle partie de la conception pour modifier le texte, les images ou les boutons, et vous verrez la mise à jour en direct.

C'est le moment d'ajouter les sections qui font le travail : un formulaire d'inscription par e-mail, une grille de produits, vos liens sociaux.

Sur le côté droit de l'écran, vous verrez un aperçu en direct de votre design où vous pourrez apporter des modifications et voir les changements en temps réel.

Et sur le côté gauche se trouvent diverses sections et blocs pour construire et personnaliser votre design.

Pour modifier un élément, cliquez dessus, et les paramètres de ce bloc s'ouvrent à gauche. Cliquer sur le titre, par exemple, ouvre son panneau de paramètres de contenu.

À partir de là, vous pouvez modifier le contenu, changer les couleurs et la taille des polices, et changer les balises de titre afin que les moteurs de recherche lisent correctement la structure de la page.

Vous pouvez faire de même pour tous les autres éléments de votre page, tels que le compte à rebours, le texte du paragraphe et les icônes des réseaux sociaux.

Par exemple, cliquer sur le bloc icônes des réseaux sociaux vous permet d'ajouter les liens de vos profils de réseaux sociaux. Vous pouvez également cliquer sur l'onglet Modèles pour changer rapidement les couleurs et le style des icônes.

Vous pouvez ajouter plus de contenu à votre page en choisissant un bloc dans les sections de blocs Standard, Avancé ou WooCommerce.

• Les blocs Standard incluent des listes à puces, des images, des boutons, des vidéos, etc.
• Les blocs Avancés incluent des formulaires d'optin, des cadeaux, des comptes à rebours et de nombreux autres outils de génération de prospects.
• Les blocs WooCommerce vous permettent d'ajouter des paniers d'achat, des pages de paiement, des grilles de produits et des boutons ajouter au panier à votre page "Bientôt disponible".

Nous vous recommandons d'ajouter un formulaire d'optin pour développer votre liste et un compte à rebours "Bientôt disponible" pour créer un sentiment d'urgence.

Vous pouvez également définir les couleurs, les polices et les styles pour toute la page en une seule fois, ce qui vous évite de styliser chaque bloc à la main.

Vous pouvez trouver le panneau Paramètres globaux en cliquant sur l'icône d'engrenage dans le coin inférieur gauche de votre écran. À partir de là, cliquez sur n'importe quel titre pour ajouter un schéma de couleurs global, des polices, une image d'arrière-plan, et plus encore.

Par exemple, nous avons supprimé l'image d'arrière-plan par défaut, en la remplaçant par quelque chose de plus accrocheur.

Nous avons également cliqué sur le titre Couleurs pour modifier les couleurs des titres, du texte, des boutons et des liens.

Une fois que vous êtes satisfait de la page "Bientôt disponible" de votre boutique en ligne, cliquez sur le bouton Enregistrer en haut pour sauvegarder votre progression.

Étape 4 : Connectez votre service de marketing par e-mail

Si vous avez ajouté un formulaire d'inscription par e-mail à votre page "Bientôt disponible" WooCommerce, il est judicieux de le connecter à un service de marketing par e-mail. De cette façon, vous pouvez collecter des prospects, gérer vos abonnés et envoyer des e-mails à des clients potentiels.

Vous pouvez trouver les intégrations d'e-mails de SeedProd sous l'onglet Connect en haut de votre écran.

Vos icônes sociales seront grisées dans votre aperçu en direct, mais sur votre page en direct, elles n'apparaîtront pas du tout.

Étape 5 : Configurer les paramètres de votre page

Avant de publier, certains paramètres méritent d'être configurés. Passez à l'onglet Paramètres de la page et regardez le panneau de navigation à gauche.

Tout d'abord, vous pouvez modifier le titre, l'URL et le statut de votre page sous l'onglet Général.

Ensuite, si vous êtes un utilisateur SeedProd Pro, vous verrez l'onglet Contrôle d'accès. Sur cet écran, vous pouvez choisir qui peut voir votre page "Bientôt disponible" WooCommerce et qui peut accéder à votre site Web pendant sa construction.

En conséquence, vous pouvez accorder l'accès à tous les développeurs et freelances travaillant sur votre site. Et si vous êtes vous-même un développeur, vous pouvez fournir un accès temporaire aux clients pour leur montrer vos progrès.

Le panneau suivant concerne les paramètres SEO, où vous pouvez ajouter un titre et une description SEO. Ces informations sont visibles par les moteurs de recherche et apparaîtront dans les résultats de recherche.

De plus, vous pouvez également ajouter un favicon et vos miniatures de médias sociaux. Et si vous souhaitez empêcher les moteurs de recherche d'indexer votre page, vous pouvez activer l'option « Activer le No Index ».

Enfin, vous pouvez ajouter des scripts tiers tels que votre code de suivi Google Analytics et les pixels Facebook sous l'onglet Scripts.

Étape 6 : Publiez votre page WooCommerce "Bientôt disponible"

Avant de mettre en ligne votre page "Bientôt disponible" sur votre boutique en ligne, il est judicieux de la prévisualiser sur l'écran de prévisualisation mobile de SeedProd. Ainsi, vous pouvez vous assurer que tout est beau sur les appareils mobiles.

Pour ce faire, cliquez sur l'icône de prévisualisation mobile dans la barre d'outils inférieure, et vous verrez un aperçu mobile en direct de votre page.

À partir de là, vous pouvez modifier votre conception et même masquer certains éléments pour qu'ils n'apparaissent pas sur ordinateur ou mobile.

Par exemple, pour masquer les icônes sociales sur mobile, il vous suffit de cliquer sur l'élément, de sélectionner l'onglet Avancé, et d'activer l'option Masquer sur mobile sous l'en-tête Visibilité de l'appareil.

Vos icônes sociales sont grisées dans votre aperçu en direct, mais sur votre page en direct, elles n’apparaîtront pas du tout.

Lorsque vous êtes prêt à publier votre page "Bientôt disponible" WooCommerce, cliquez sur la flèche déroulante à côté du bouton Enregistrer et cliquez sur Publier.

Étape 7 : Activer le mode Bientôt disponible

Il ne vous reste plus qu'à activer votre page "Bientôt disponible" pour WooCommerce. Pour ce faire, retournez au tableau de bord SeedProd en cliquant sur SeedProd » Pages depuis le panneau du tableau de bord WordPress à gauche.

Ensuite, sous l'en-tête Mode "Bientôt disponible", basculez le bouton sur « Actif ».

Vos visiteurs arrivent maintenant sur votre page Bientôt disponible au lieu de la boutique, où ils peuvent voir quand vous ouvrez et s'inscrire à vos e-mails.

Comment modifier votre page WooCommerce Bientôt disponible plus tard

Les dates de lancement changent. Pour modifier la vôtre, allez dans SeedProd » Pages dans votre tableau de bord, où le bouton indique maintenant Modifier la page au lieu de Configurer.

Il ouvre le même constructeur dans lequel vous avez commencé, vous pouvez donc modifier le texte, échanger des images, ajuster les couleurs ou ajouter de nouvelles sections exactement comme vous l'avez fait la première fois.

Lorsque vous avez terminé, cliquez sur le bouton Enregistrer, et vos modifications apparaîtront immédiatement sur la page en direct.

Que se passe-t-il si vous activez les deux ?

Rien ne casse, mais rien ne s'empile non plus. SeedProd et WooCommerce exécutent des systèmes séparés de « Bientôt disponible » qui ne savent pas que l'autre existe, ce que j'ai confirmé en lisant le code des deux plugins plutôt qu'en supposant.

SeedProd gagne. Il construit sa page plus tôt dans le chargement de la page que WooCommerce, donc les visiteurs obtiennent votre conception SeedProd et le modèle simple de WooCommerce n'apparaît jamais.

Les deux peuvent garder des pages choisies publiques tandis que le reste reste caché. WooCommerce le fait avec une restriction couvrant vos pages de boutique, et SeedProd le fait avec une liste d'URL que vous tapez vous-même, ce qui demande plus de travail mais vous permet de choisir exactement ce qui reste en ligne.

Alors utilisez l'un, pas les deux. Deux interrupteurs faisant le même travail est la façon dont vous finissez par ne pas pouvoir déterminer lequel cache votre magasin, donc si vous utilisez SeedProd, laissez le réglage WooCommerce sur En ligne et gérez tout depuis SeedProd » Pages.

Comment afficher un seul produit WooCommerce comme Bientôt disponible

WooCommerce n'a pas de paramètre « Bientôt disponible » pour les produits individuels. La fonctionnalité est uniquement pour l'ensemble du magasin, il n'y a donc pas de bascule par produit et pas de badge « Bientôt disponible » dans l'écran du produit.

De nombreux conseils en ligne impliquent le contraire, j'ai donc cherché dans le code du plugin pour en être sûr. Tout ce que WooCommerce propose pour le mode « Bientôt disponible » fonctionne au niveau du site ou du magasin, et rien ne touche un seul produit.

Ce que vous faites à la place dépend si vous voulez que le produit soit visible.

Planifiez-le pour le jour du lancement

Définissez la date de publication du produit dans le futur et WordPress le gardera caché jusqu'alors, le publiant pour vous le jour J. C'est l'option la plus propre lorsque vous connaissez déjà votre date de lancement.

Cachez-le de votre catalogue

Dans la boîte de publication, Visibilité du catalogue vous donne quatre choix : Boutique et résultats de recherche, Boutique uniquement, Résultats de recherche uniquement, et Caché.

Caché exclut le produit de votre boutique et de la recherche de votre site, mais le lien direct fonctionne toujours. Cela en fait un moyen utile d'envoyer un aperçu à une poignée de personnes sans l'ouvrir à tout le monde.

Affichez-le, mais bloquez la vente

Le statut du stock a trois réglages : En stock, Hors stock, et En commande.

En rupture de stock laisse la page produit visible sans bouton d'achat, afin que les clients puissent voir ce qui arrive et lire la description. En précommande laisse la page visible et accepte toujours les commandes, ce qui s'apparente davantage à une précommande réelle.

Pour un véritable badge « Bientôt disponible » avec une date de lancement, vous aurez besoin d'un plugin de précommande ou de liste d'attente. WooCommerce n'en crée pas pour vous.

Ou donnez au produit sa propre page de destination

Si ce que vous voulez vraiment, c'est une page pour un seul produit non encore sorti, c'est le rôle d'une page de destination plutôt que d'un réglage produit, et c'est l'approche que j'adopterais.

Gardez le produit lui-même caché, puis créez une page dans SeedProd avec les photos du produit, un compte à rebours jusqu'au jour du lancement et un formulaire d'e-mail. Dirigez votre trafic de teasing vers cette page, et vous aurez une liste d'attente prête à être envoyée par e-mail dès que le produit sera en ligne.

Pourquoi mon site WooCommerce indique-t-il « Bientôt disponible » ?

Parce que l'un des deux paramètres « Bientôt disponible » est activé, et ce n'est peut-être pas vous qui l'avez activé.

La partie déroutante est que vous ne pouvez pas le voir lorsque vous êtes connecté. Les deux systèmes laissent passer directement les administrateurs de la boutique, donc votre boutique vous semble parfaitement normale et fermée à tout le monde.

Ouvrez d'abord votre site dans une fenêtre privée. Cela vous dira s'il y a réellement un problème ou si vous regardez votre propre vue d'administrateur.

Ensuite, désactivez celui qui est activé :

• WooCommerce : allez dans WooCommerce, puis Paramètres, puis Visibilité du site, et revenez à En direct.
• SeedProd : allez dans SeedProd, puis Pages, et désactivez le Mode « Bientôt disponible » en le mettant sur Inactif.

Vérifiez les deux si cela s'affiche toujours. Ils sont indépendants, donc désactiver l'un n'affecte pas l'autre.

WooCommerce peut le signaler pour vous, tant que le badge est activé. Le paramètre Afficher le badge de visibilité du site dans la barre d'administration affiche l'état de visibilité de votre site à côté du nom du site dans votre barre d'outils d'administration, afin que vous puissiez le voir d'un coup d'œil.

Questions fréquemment posées

Les clients peuvent-ils toujours acheter pendant que mon magasin est en mode « Bientôt disponible » ?

Pas via vos pages de magasin normales, car ce sont celles qui sont cachées. Vous pouvez toujours encaisser de l'argent délibérément en ajoutant les blocs « Ajouter au panier » ou « Paiement » de SeedProd à votre page « Bientôt disponible », ce qui explique le fonctionnement des précommandes. N'oubliez pas qu'un paiement en direct signifie que votre magasin n'est pas vraiment fermé.

Qu'est-ce que l'option woocommerce_coming_soon ?

C'est le paramètre de base de données derrière l'écran de Visibilité du site, et un second paramètre décide s'il couvre tout votre site ou seulement vos pages de magasin. Vous n'avez pas besoin de toucher directement à l'un ou l'autre. La modification de la Visibilité du site dans vos paramètres WooCommerce les écrit pour vous.

Puis-je garder certaines pages publiques pendant que le reste de mon site est caché ?

Oui, avec l'une ou l'autre méthode. WooCommerce a une option unique qui cache uniquement vos pages de magasin, panier, paiement et compte. SeedProd vous permet plutôt de lister les URL que vous souhaitez rendre accessibles, ce qui prend plus de temps à configurer mais vous donne un contrôle précis sur ce que les visiteurs peuvent encore lire.

Combien de temps dois-je laisser une page « Bientôt disponible » de WooCommerce en ligne ?

Seulement tant que vous êtes sur le point de lancer. Une page « Prochainement » peut vous aider à constituer une liste pendant quelques semaines, mais la laisser en ligne pendant des mois signifie que la seule page que Google a à sa disposition est une page d’attente. Si la construction doit durer longtemps, masquez uniquement la boutique et continuez à publier du contenu.

WooCommerce fermera votre boutique en deux clics. Ce qu’il ne fera pas, c’est vous créer une page qui collecte des adresses e-mail et compte à rebours jusqu’au jour d’ouverture.

Vous n’avez pas non plus à concevoir cela à partir de zéro, car les modèles et le bloc de compte à rebours sont déjà là. Commencez dès aujourd’hui avec SeedProd et ayez votre page de lancement en ligne cet après-midi.

Vous trouverez peut-être également utiles les guides WooCommerce suivants :

• Comment sécuriser votre site WooCommerce
• Comment masquer facilement les produits en rupture de stock dans WooCommerce
• Comment personnaliser l'onglet Informations supplémentaires de WooCommerce
• Comment personnaliser votre page de panier WooCommerce
• Comment personnaliser facilement votre page de boutique WooCommerce
• Comment afficher les produits mis en avant WooCommerce (+ produits associés)

Merci de votre lecture. Veuillez nous suivre sur YouTube, Twitter et Facebook pour plus de contenu utile pour développer votre entreprise si cet article vous a plu.