Comment personnaliser une page protégée par mot de passe dans WordPress

Comment personnaliser une page protégée par mot de passe dans WordPress

Voulez-vous apprendre à personnaliser une page protégée par mot de passe dans WordPress ?

La personnalisation des pages verrouillées vous permet d'encourager davantage de visiteurs à s'abonner à votre site. De plus, c'est un excellent moyen d'utiliser l'espace pour promouvoir d'autres services ou pages de votre site.

Dans ce guide, je vais vous expliquer comment protéger une page par mot de passe dans WordPress en utilisant la fonctionnalité intégrée, puis comment la personnaliser avec SeedProd pour qu'elle ait l'air conçue plutôt que nue.

Quand faut-il personnaliser une page protégée par mot de passe dans WordPress ?

Il existe plusieurs scénarios où l'utilisation d'une page personnalisée protégée par mot de passe est une bonne idée. Par exemple, si votre site est encore en construction, le verrouillage de vos pages avec des mots de passe permet uniquement aux personnes autorisées d'y accéder à des fins de test.

Une autre situation courante où les pages protégées par mot de passe sont très utiles est lorsque vous souhaitez restreindre certaines de vos pages aux seuls abonnés payants.

La page par défaut de WordPress protégée par mot de passe a un design très basique avec un champ de mot de passe et un design basé sur votre thème WordPress. Voici à quoi ressemble une page standard protégée par mot de passe WordPress :

Exemple de page protégée par mot de passe

Malheureusement, il n'est pas facile d'ajouter des éléments supplémentaires tels que des boutons personnalisés, des widgets, des formulaires et d'autres éléments à l'aide de l'éditeur WordPress par défaut.

Mais pour rendre cela beaucoup plus facile, nous allons utiliser un plugin spécial pour WordPress appelé SeedProd. En tant que meilleur plugin de création de pages pour WordPress, SeedProd vous permet de créer des pages protégées par mot de passe qui sont superbes sans nécessiter de code !

Comment protéger une page par mot de passe dans WordPress

Avant de pouvoir personnaliser quoi que ce soit, vous avez besoin d'une page verrouillée, et WordPress l'a intégrée, vous n'avez donc pas besoin d'un plugin pour commencer.

Ouvrez la page ou l'article que vous souhaitez protéger dans l'éditeur de blocs. Dans le panneau latéral des paramètres à droite, trouvez le panneau Résumé et cliquez sur Visibilité (il est généralement indiqué Public). Choisissez Protégé par mot de passe, tapez le mot de passe que vous souhaitez utiliser, et mettez à jour la page.

Le panneau de gauche affiche "Statut et visibilité" avec les options "Brouillon", "En attente", "Privé", "Programmé" et "Publié" ; "Publié" est sélectionné ; "Protégé par mot de passe" est coché.

Toute personne qui visite cette page voit maintenant l'invite de mot de passe par défaut de WordPress, et seules les personnes possédant le mot de passe peuvent voir ce qui se trouve derrière.

Le processus est rapide et gratuit, mais l'invite elle-même est simple et ne porte aucune de vos marques. C'est exactement ce que la méthode SeedProd dans la section suivante prend en charge.

Comment personnaliser une page WordPress protégée par mot de passe avec SeedProd

Pour transformer cet écran de verrouillage simple en une page qui a l'air conçue, j'utilise SeedProd. C'est un constructeur de pages par glisser-déposer avec des contrôles d'accès intégrés, ce qui signifie que vous pouvez concevoir une page verrouillée et définir son mot de passe en un seul endroit. Les étapes ci-dessous vous guident tout au long de la configuration.

Étape 1 : Installer le plugin SeedProd

Pour commencer, installez et activez le plugin SeedProd sur votre site. Si vous débutez avec l'ajout de plugins, ce guide sur comment installer un plugin WordPress vous explique comment faire.

Une fois installé, récupérez votre clé de licence depuis votre compte SeedProd. Vous la trouverez sous l'onglet Téléchargements dans le tableau de bord de votre compte.

Licence SeedProd

Maintenant, ouvrez votre tableau de bord d'administration WordPress et accédez à SeedProd » Paramètres. Entrez ici votre Clé de licence et cliquez sur le bouton Vérifier.

Entrez la clé de licence seedprod

Génial ! Maintenant que SeedProd Pro est actif sur votre site, vous pouvez effectuer toutes sortes de personnalisations passionnantes.

Étape 2 : Créer une page "Bientôt disponible"

SeedProd dispose d'un mode "Bientôt disponible" qui comprend des paramètres de restriction d'accès. Avec ces restrictions d'accès, vous pouvez facilement définir un mot de passe pour votre page.

Pour créer une page "Bientôt disponible" avec SeedProd, cliquez sur l'élément de menu SeedProd dans la barre latérale de votre WordPress.

Pages de destination

Maintenant, cliquez sur le bouton Configurer une page "Bientôt disponible".

Ici, vous trouverez une grande variété de modèles parmi lesquels choisir. Vous pouvez en choisir un qui vous plaît, mais nous allons utiliser le modèle Page de webinaire de conférence pour cet exemple.

Modèles de bientôt disponible SeedProd

Après avoir sélectionné le thème, vous devriez maintenant voir le constructeur par glisser-déposer de SeedProd qui vous permet de personnaliser la page de toutes sortes de manières.

Étape 3 : Personnaliser la page protégée par mot de passe

Une fois que vous avez sélectionné votre modèle, vous pouvez personnaliser votre page protégée par mot de passe à l'aide de dizaines de types de blocs différents visibles dans le volet de gauche.

Vue du constructeur SeedProd

Vous pouvez simplement faire glisser et déposer ces blocs sur la droite pour ajouter un nouvel élément tel qu'un formulaire, des icônes de médias sociaux, des concours, etc.

Comme nous voulons ajouter un champ de mot de passe qui permet aux utilisateurs d'accéder au contenu verrouillé, nous allons faire glisser et déposer le bloc HTML personnalisé sur la page.

Pour ce faire, recherchez simplement HTML personnalisé dans le champ de recherche et placez ce bloc à l'endroit souhaité sur votre page protégée par mot de passe.

Bloc HTML personnalisé SeedProd

Maintenant, cliquez sur le bloc dans l'éditeur en direct pour accéder à ses paramètres. Ici, collez ce code dans le champ HTML personnalisé :

seed_bypass_form msg="Enter passcode" button-txt="Login" return="https://yourwebsite.com/welcome"

Remarque : Assurez-vous d'encadrer le code ci-dessus entre crochets lorsque vous le collez dans le champ HTML personnalisé.

Le code ci-dessus crée un champ de mot de passe standard, mais vous devrez le modifier légèrement pour qu'il fonctionne parfaitement sur votre site. Voici ce que signifient chacune des trois parties de ce code :

  • msg: Cette balise spécifie le texte qui apparaît dans le champ du mot de passe. Par défaut, il est défini sur "Entrez le code d'accès". Vous pouvez modifier ce texte si vous le souhaitez, mais ce n'est pas nécessaire.
  • button-txt: Cette balise contrôle le texte qui apparaît sur le bouton qui mène à votre page protégée par mot de passe. Encore une fois, vous pouvez modifier ce texte, mais ce n'est pas obligatoire.
  • return: Dans cette balise, vous devez fournir l'URL de la page à laquelle vous souhaitez que les utilisateurs accèdent avec un mot de passe. Assurez-vous d'entrer le bon lien.
Code HTML personnalisé

Vous ne verrez pas le champ du mot de passe réel avant d'avoir prévisualisé la page, alors ne vous inquiétez pas si cela ressemble à du texte brut dans le constructeur. Avant de prévisualiser, il reste quelques paramètres à régler, alors cliquez sur Enregistrer en haut à droite pour conserver votre travail jusqu'à présent.

Étape 4 : Paramètres de la page protégée par mot de passe WordPress

Dans cette étape, nous allons définir le mot de passe dont les utilisateurs auront besoin pour accéder réellement à votre contenu protégé. Sur votre constructeur de page SeedProd, cliquez sur l'onglet Paramètres de la page (3ème option en partant du haut à gauche).

Maintenant, sélectionnez Contrôle d'accès dans le menu de gauche. Ensuite, dans le champ URL de contournement, vous pouvez entrer n'importe quel mot de passe que vous souhaitez définir.

Paramètres de la page

Il est important de noter que le mot de passe que vous choisissez sera également votre URL de dérivation. Cela signifie que si vous souhaitez qu'un utilisateur accède directement à cette page, vous pouvez simplement lui donner l'URL de dérivation.

Vous y êtes presque ! Faites défiler vers le bas jusqu'à la section URL incluses/exclues et cliquez sur les options URL incluses. Ensuite, collez ici le lien vers la page réelle que vous souhaitez masquer derrière un mot de passe.

Inclure les URL

Et maintenant, il est temps de publier et d'activer notre nouvelle page personnalisée protégée par mot de passe !

Étape 5 : Publier votre page WordPress protégée par mot de passe

Maintenant que nous avons personnalisé la page et configuré les paramètres à notre goût, nous pouvons passer à sa publication. Cliquez sur la flèche pointant vers le bas à côté du bouton Enregistrer pour développer le menu, puis appuyez sur Publier.

Publier la page protégée par mot de passe

Vous verrez alors le message suivant apparaître.

Bouton Voir la page en direct

Maintenant, retournez à votre tableau de bord SeedProd et appuyez sur le bouton d'activation pour que le statut indique Actif sous le Mode Bientôt disponible.

Mode "En construction" actif

Votre page personnalisée protégée par mot de passe est maintenant publiée !

Page en direct

Excellent ! Si vous souhaitez personnaliser une page de formulaire protégée par mot de passe, consultez les étapes ci-dessous où nous utilisons WPForms pour y parvenir.

Comment personnaliser les pages de formulaire protégées par mot de passe

Vous pouvez également créer et personnaliser une page de formulaire protégée par mot de passe sur votre site WordPress. C'est très utile si vous souhaitez restreindre l'accès au formulaire aux seuls utilisateurs connectés ou à ceux qui ont un mot de passe. Pour plus de détails, veuillez consulter ce guide sur la création d'un formulaire protégé par mot de passe.

Page de formulaire protégée par mot de passe

FAQ sur la personnalisation des pages protégées par mot de passe

Ces questions reviennent souvent lorsque les gens cherchent à personnaliser une page protégée par mot de passe dans WordPress. Voici celles que j'entends le plus souvent.

Pouvez-vous modifier l'apparence de la page de mot de passe par défaut de WordPress ?

WordPress n'offre pas de moyen intégré pour retoucher son invite de mot de passe par défaut. La solution la plus simple est de la remplacer par une page personnalisée créée dans SeedProd, ce qui est exactement ce que la méthode SeedProd ci-dessus explique, et cela ne nécessite aucun code.

Quelle est la différence entre une page privée et une page protégée par mot de passe ?

Une page protégée par mot de passe est visible par toute personne possédant le mot de passe, tandis qu'une page privée n'est visible que par les utilisateurs connectés ayant le bon rôle, comme les éditeurs et les administrateurs. Utilisez la protection par mot de passe lorsque vous souhaitez partager l'accès avec des personnes qui n'ont pas de compte sur votre site.

Puis-je protéger l'ensemble de mon site WordPress par mot de passe ?

Oui, et c'est un cas d'utilisation courant. La méthode la plus simple consiste à utiliser le mode "Bientôt disponible" ou "Maintenance" de SeedProd, qui verrouille l'ensemble du site derrière une seule page. Nous couvrons toutes les options dans notre guide sur la façon de protéger l'ensemble de votre site WordPress par mot de passe.

Puis-je également personnaliser le formulaire de réinitialisation du mot de passe ?

Vous le pouvez. L'écran de réinitialisation du mot de passe est distinct de l'invite de mot de passe du contenu, mais il est tout aussi personnalisable. Consultez notre guide sur la façon de personnaliser le formulaire de réinitialisation du mot de passe WordPress.

Ensuite, créez votre propre thème WordPress

Vous voulez créer un thème WordPress qui ressemble exactement à ce que vous voulez ? Heureusement, vous n'avez plus besoin d'être un développeur pour créer votre propre thème WordPress. Consultez notre guide détaillé sur la création de thèmes WordPress sans code pour plus d'informations.

De plus, si vous cherchez un moyen facile d'augmenter le nombre de visiteurs sur votre site, vous pouvez envisager d' envoyer des notifications push depuis WordPress.

Créez un formulaire protégé par mot de passe dès maintenant

Prêt à créer votre formulaire ? Commencez dès aujourd'hui avec le plugin de création de formulaires WordPress le plus simple.  WPForms Pro inclut de nombreux modèles gratuits et offre une garantie de remboursement de 14 jours.

Si cet article vous a aidé, suivez-nous sur Facebook et Twitter pour plus de tutoriels et de guides WordPress gratuits.

Divulgation : Notre contenu est soutenu par nos lecteurs. Cela signifie que si vous cliquez sur certains de nos liens, nous pouvons gagner une commission. Découvrez comment WPForms est financé, pourquoi c'est important et comment vous pouvez nous soutenir.

Osama Tahir

Osama est rédacteur principal chez WPForms. Il est spécialisé dans le démontage des plugins WordPress pour les tester et partager ses idées avec le monde. En savoir plus

Le meilleur plugin de création de formulaires par glisser-déposer pour WordPress

Facile, rapide et sécurisé. Rejoignez plus de 6 millions de propriétaires de sites Web qui font confiance à WPForms.

Ajouter un commentaire

Nous sommes heureux que vous ayez choisi de laisser un commentaire. N'oubliez pas que tous les commentaires sont modérés conformément à notre politique de confidentialité, et tous les liens sont nofollow. N'utilisez PAS de mots-clés dans le champ du nom. Ayons une conversation personnelle et significative.

Ce formulaire est protégé par Cloudflare Turnstile et la politique de confidentialité et les conditions d'utilisation de Cloudflare s'appliquent.