La page de connexion par défaut de WordPress fonctionne bien, mais elle ne représente pas complètement votre marque. Pour créer une expérience plus engageante, il est important de mettre en valeur votre marque et votre entreprise sur cette page.
Un design personnalisé de la page de connexion est particulièrement impactant pour les sites d’adhésion ou les magasins en ligne, où les utilisateurs/utilisatrices interagissent fréquemment avec la page de connexion.
Chez WPBeginner, nous avons mis en place une page de connexion personnalisée pour notre site de formation vidéo WordPress gratuit. Cela nous a aidés à mettre notre marque plus en évidence tout en améliorant l’expérience des utilisateurs/utilisatrices.
Dans ce guide, nous allons vous afficher comment créer une page de connexion WordPress personnalisée. Nous explorerons plusieurs méthodes afin que vous puissiez choisir celle qui correspond le mieux aux besoins de votre entreprise.
Voici ce que vous apprendrez dans ce guide :
- Why Create a Custom WordPress Login Page?
- WordPress Login Page Design Examples
- Creating a WordPress Login Page Using Theme My Login (Free)
- Creating a Custom WordPress Login Page Using WPForms
- Creating a Custom WordPress Login Page Using SeedProd (Recommended)
- Change the WordPress Login Logo and URL
- Disabling the WordPress Login Page Language Switcher
Pourquoi créer une page de connexion WordPress personnalisée ?
Votre site WordPress est doté d’un puissant système de gestion des utilisateurs/utilisatrices. Il permet aux utilisateurs/utilisatrices de créer des comptes dans les boutiques e-commerce, les sites d’adhésion et les blogs.
Par défaut, la page de connexion affiche la marque et le logo de WordPress. Cela convient si vous êtes la seule personne à disposer d’un accès administrateur ou si vous avez très peu d’utilisateurs/utilisatrices.
Cependant, si votre site permet aux utilisateurs/utilisatrices de s’inscrire et de se connecter, une page de connexion personnalisée offre une meilleure expérience aux utilisateurs/utilisatrices.
Certains utilisateurs/utilisatrices peuvent être méfiants si votre écran de connexion WordPress ne ressemble en rien à votre site. Ils se sentiront plus à l’aise si vous utilisez le logo et le design de votre entreprise.
Dernier point, l’écran de connexion par défaut ne contient rien d’autre que le formulaire de connexion. En créant une page de connexion personnalisée, vous pouvez utiliser cet espace pour promouvoir d’autres pages ou des offres spéciales.
C’est pourquoi nous utilisons une page de connexion personnalisée pour tous nos sites où les utilisateurs/utilisatrices doivent interagir avec un formulaire de connexion.
Par exemple, voici la page de connexion personnalisée que nous utilisons pour le site de vidéos de formation WPBeginner Videos.
Ceci étant dit, voyons quelques autres exemples de conceptions de pages de connexion WordPress personnalisées.
Exemples de pages de connexion WordPress
Les propriétaires de sites web peuvent personnaliser la page de connexion de WordPress en utilisant différents styles et techniques.
Certains créent une page de connexion personnalisée qui reprend le thème et les couleurs de leur site. D’autres modifient la page de connexion par défaut en y ajoutant un arrière-plan, des couleurs et un logo personnalisés.
Voici quelques exemples de ce qui est possible.
WPForms est la meilleure extension de formulaire de contact WordPress sur le marché. Leur extension comprend également un module complémentaire pour créer de magnifiques formulaires de connexion et d’Inscription WordPress, que nous vous afficherons ultérieurement dans cet article.
Leur page de connexion personnalisée utilise une mise en page en deux colonnes. La colonne de gauche contient le formulaire de connexion, et la colonne de droite est utilisée pour mettre en évidence les promotions et autres appels à l’action.
La page de connexion affichée ci-dessus informe les utilisateurs/utilisatrices des nouvelles fonctionnalités. Elle utilise une marque personnalisée, une illustration d’arrière-plan et les couleurs de la marque pour créer une expérience de connexion unique.
Jacquelynne Steeves est un site d’art et d’artisanat où l’auteur/autrice publie du contenu sur la décoration des maisons, la fabrication de quilts, les compositions, la broderie, et plus encore.
Leur page de connexion utilise une image d’arrière-plan personnalisée qui correspond au thème de leur site, et le formulaire de connexion se trouve sur la droite.
La page de connexion de cette entreprise de conception de graphismes animés présente un arrière-plan coloré à l’image de son activité.
Il utilise le même en-tête de site, le même pied de page et les mêmes menus de navigation sur l’écran de connexion. Le formulaire de connexion lui-même est assez simple, avec un arrière-plan clair.
Avis de la direction de MITSloan
L’Avis sur la gestion des prêts aux entreprises utilise une fenêtre surgissante pour afficher un formulaire de connexion et d’inscription.
L’avantage d’une fenêtre surgissante est que les utilisateurs/utilisatrices peuvent se connecter sans quitter la page. Cela leur enregistre le chargement d’une nouvelle page et offre une expérience plus rapide aux utilisateurs/utilisatrices.
Êtes-vous prêt à apprendre comment créer une page de connexion personnalisée dans WordPress ?
Créer une page de connexion WordPress en utilisant le thème My Login (Gratuit)
Theme My Login est une extension gratuite qui modifie votre page de connexion en fonction de votre thème WordPress. Il n’est pas très personnalisable, mais il remplacera la page de connexion par défaut marquée WordPress et lui donnera un aspect plus professionnel.
La première chose à faire est d’installer et d’activer l’extension Theme My Login. Pour plus de détails, consultez notre guide étape par étape sur l’installation d’une extension WordPress.
Dès qu’il est activé, Theme My Login crée automatiquement des URL pour vos actions personnalisées de connexion, déconnexion, inscription, mot de passe oublié et réinitialisation du mot de passe.
Vous pouvez personnaliser ces URLs de connexion WordPress en visitant la page » Theme My Login » General. Défilez vers le bas jusqu’à la section ‘Slugs’ pour modifier les URLs utilisées par l’extension pour les actions de connexion.
Theme My Login vous permet également d’utiliser des codes courts pour créer des pages de connexion et d’inscription personnalisées. Vous pouvez simplement créer une page pour chaque action, puis ajouter le slug de la page ici afin que le plugin puisse trouver et rediriger les utilisateurs/utilisatrices correctement.
Commençons par la page de connexion.
Dirigez-vous vers Page » Ajouter nouveau pour créer une nouvelle page WordPress. Ensuite, vous devez donner un titre à votre page, puis saisir le code court suivant [theme-my-login]
dans la page.
Vous pouvez maintenant publier votre page et la prévisualiser pour voir votre page de connexion personnalisée en action.
Voici ce que cela donne sur notre site WordPress de test.
Répétez le processus pour créer d’autres pages en utilisant le code court suivant :
[theme-my-login action="register"]
Pour le formulaire d’Inscription
[theme-my-login action="lostpassword"]
Pour la page du mot de passe perdu
[theme-my-login action="resetpass"]
Pour la page de réinitialisation du mot de passe
Créer une page de connexion WordPress personnalisée à l’aide de WPForms
WPForms est la meilleure extension de constructeur de formulaires WordPress sur le marché. Il vous permet de créer facilement des formulaires de connexion et d’Inscription personnalisés pour votre site.
WPForms est une extension WordPress premium, et vous aurez besoin au moins de leur offre pro pour accéder au module complémentaire d’Inscription des utilisateurs. Les utilisateurs/utilisatrices de WPBeginner peuvent bénéficier d’une remise de 50% en utilisant notre code promo WPForms: SAVE50
La première chose à faire est d’installer et d’activer l’extension WPForms. Pour plus de détails, consultez notre guide étape par étape sur l’installation d’une extension WordPress.
Lors de l’activation, vous devez vous rendre sur la page WPForms » Réglages pour saisir votre clé de licence. Vous pouvez trouver cette information dans votre compte sur le site de WPForms.
Après avoir saisi/saisi la clé de licence, vous pourrez installer des modules complémentaires.
Rendez-vous sur la page WPForms » Addons et localisez l’Addon Inscription des utilisateurs/utilisatrices.
Cliquez ensuite sur le bouton « Installer le module » pour télécharger et activer le module. Vous êtes maintenant prêt à créer vos formulaires de connexion personnalisés.
Titre de la page WPForms » Ajouter une nouvelle. Il vous sera demandé de » Sélectionné un Modèle » pour votre formulaire. Recherchez le modèle » User Login Form » et cliquez sur le bouton » Use Modèle » pour continuer.
WPForms chargera le formulaire de connexion de l’utilisateur avec les champs obligatoires.
Vous pouvez cliquer sur les champs pour ajouter votre propre description ou texte autour d’eux.
Vous pouvez également modifier d’autres réglages.
Par exemple, le titre du bouton par défaut est « Envoyer ». Vous pouvez cliquer sur le bouton et modifier le texte en « Connexion ».
Vous pouvez également décider de ce qui se passe une fois qu’un utilisateur est bien connecté.
Vous devez vous rendre dans l’onglet Réglages » Confirmation et sélectionner une action. Vous pouvez rediriger l’utilisateur vers n’importe quelle autre URL, le rediriger vers la page d’accueil ou simplement lui afficher un message indiquant qu’il est désormais connecté.
Une fois que vous êtes satisfait des réglages du formulaire, cliquez sur le bouton « Enregistrer » dans le coin supérieur droit de l’écran et fermez le constructeur de formulaires.
Ajout d’un formulaire de connexion personnalisé à une page WordPress
WPForms rend super facile l’ajout de votre formulaire de connexion personnalisé sur n’importe quelle publication ou page WordPress.
Il suffit de modifier la page où vous souhaitez ajouter le formulaire de connexion ou d’en créer une nouvelle. Ensuite, dans l’écran de modification de la page, ajoutez le bloc WPForms à votre zone de contenu.
Ensuite, sélectionnez le formulaire de connexion que vous avez créé plus tôt, et le bloc WPForms le chargera automatiquement à l’intérieur de la zone de contenu.
Vous pouvez maintenant continuer à modifier la page du formulaire de connexion. N’hésitez pas à ajouter du texte ou des blocs promotionnels. Une fois que vous avez terminé, n’oubliez pas d’enregistrer et de publier vos modifications.
Vous pouvez maintenant visiter votre site pour voir votre page de connexion en action.
Créer une page de connexion personnalisée pour WordPress en utilisant SeedProd (Recommandé)
Par défaut, votre page de formulaire de connexion WordPress personnalisé utilisera le modèle de page et les styles de votre thème. Elle aura les menus de navigation, l’en-tête, le pied de page et les widgets de la colonne latérale de votre thème.
Si vous souhaitez prendre en charge l’intégralité de la page et concevoir quelque chose à partir de zéro, vous pouvez utiliser une extension de constructeur de page WordPress.
SeedProd est le meilleur constructeur de page d’atterrissage pour WordPress. Il est convivial pour les débutants et offre un constructeur drag-and-drop pour vous aider à créer n’importe quel type de page d’atterrissage, y compris une page de connexion, une page coming soon, une page de mode de maintenance, et plus encore.
Pour cet article, nous utiliserons la version SeedProd Pro car elle inclut un modèle de page de connexion et des blocs de page avancés pour la personnalisation.
Il existe également une version gratuite de SeedProd, mais elle n’inclut pas la faculté de créer une page de connexion pour votre site WordPress.
Tout d’abord, vous devrez installer l’extension SeedProd sur votre site. Pour plus de détails, vous pouvez suivre notre guide sur l’installation d’une extension WordPress.
Une fois l’extension activée, vous serez redirigé vers SeedProd dans votre zone d’administration WordPress.
Ici, vous devrez saisir votre clé de licence, que vous pouvez facilement obtenir à partir du compte SeedProd. Si vous avez saisi/saisie la clé, cliquez sur le bouton ‘Verify key’.
Après cela, vous êtes prêt à créer votre page de connexion dans SeedProd.
Pour commencer, rendez-vous sur le site SeedProd » Landing Pages « et sélectionnez l’option » Page de connexion » en cliquant sur le bouton » Configurer une page de connexion « .
Dans l’écran suivant, vous pouvez sélectionner un Modèle pour votre page de connexion. Vous pouvez également créer une page à partir de zéro en utilisant le Modèle vierge.
Cependant, nous suggérons d’utiliser un Modèle car il est plus facile et plus rapide de personnaliser la page de connexion.
Lorsque vous sélectionnez un Modèle, une fenêtre surgissante apparaîtra pour saisir un Nom de page pour votre page de connexion. SeedProd utilisera le nom de la page comme URL pour votre page d’atterrissage.
Une fois ces modifications saisies, cliquez sur le bouton « Enregistrer et commencer à modifier la page ».
Maintenant, vous pouvez modifier votre page de connexion en utilisant le constructeur de SeedProd dans l’onglet Design. Le constructeur vous permet d’ajouter facilement n’importe quel module de page à la page en le faisant simplement glisser depuis le menu de gauche et en le plaçant n’importe où sur la page.
Par exemple, vous pouvez ajouter du texte, une vidéo ou un nouveau bouton à votre page de connexion. Il y a plus d’options de personnalisation dans la section des blocs avancés, où vous pouvez ajouter un compte à rebours, des icônes de partage social, et plus encore.
SeedProd vous permet même de retirer des blocs de page existants dans le Modèle. Il vous suffit de cliquer sur l’icône de la corbeille pour supprimer le bloc de page.
Ensuite, si vous cliquez sur n’importe quelle section de la page de connexion, vous verrez d’autres options de personnalisation.
Par exemple, vous pouvez modifier le texte et la couleur des champs, choisir une police différente, modifier la couleur du bouton, etc.
Lorsque vous êtes satisfait de la conception de la page de connexion, cliquez sur l’onglet « Connexion » en haut de la page.
Vous pouvez désormais connecter différents services de marketing e-mail tels que Constant Contact, Drip, et plus encore.
Ensuite, vous devez vous rendre dans l’onglet Réglages de la page. Dans les Réglages généraux, SeedProd vous permet de modifier le titre de la page et de modifier l’état de la page de brouillon à publier.
Vous pouvez également sélectionner l’option d’utiliser un lien SeedProd et ajouter votre lien d’affilié SeedProd pour gagner plus d’argent en ligne.
Si vous souhaitez optimiser votre page de connexion pour les moteurs de recherche, rendez-vous dans les Réglages SEO. Vous y trouverez un bouton qui vous permettra d’installer l’extension All In One SEO.
All in One SEO for WordPress (AIOSEO) est la meilleure extension SEO WordPress qui vous permet d’optimiser votre site WordPress pour les moteurs de recherche et les plateformes de réseaux sociaux.
Vous pouvez apprendre la meilleure façon de l’utiliser dans notre guide sur la façon de config urer correctement All In One SEO pour WordPress.
Ensuite, vous pouvez également ajouter différents extraits de code à votre page de connexion dans l’onglet Paramètres des scripts.
Par exemple, vous pouvez ajouter ici le code de Google Analytics, le pixel Facebook ou tout autre code de suivi.
Maintenant que vous avez modifié les Réglages de la page, cliquez sur le bouton « Enregistrer » en haut de la page.
Ensuite, vous devrez faire en sorte que votre page de connexion soit activée. Pour cela, vous pouvez quitter le constructeur de page d’atterrissage puis aller dans SeedProd » Landing Pages.
Une fois sur place, vous devez cliquer sur le bouton pour modifier l’état de la page de « Inactive » à « Active ».
Vous pouvez maintenant vous rendre à l’URL de votre page de connexion et la voir à l’œuvre.
Voici une capture d’écran de la connexion sur notre site de démonstration.
Alternative : Vous pouvez également utiliser Thrive Architect pour concevoir une page de connexion attrayante. C’est une autre excellente extension de constructeur de page par glisser-déposer que nous recommandons pour créer des pages personnalisées.
Il comprend plus de 300+ modèles conçus par des professionnels qui vous permettent de réaliser une page de connexion qui pourrait ressembler à celle ci-dessous.
Si les extensions de constructeurs de pages WordPress ne vous conviennent pas, vous pouvez utiliser des CSS personnalisés pour styliser le formulaire et la page de connexion elle-même.
Modifier le logo et l’URL de connexion de WordPress
Il n’est pas toujours nécessaire de créer une page de connexion WordPress personnalisée pour votre site web. De nombreux sites remplacent le logo WordPress et l’URL du logo tout en continuant à utiliser la page de connexion par défaut.
Si vous souhaitez remplacer le logo WordPress sur l’écran de connexion par votre propre logo, alors vous pouvez facilement utiliser une extension WordPress ou ajouter un code personnalisé. Nous allons vous afficher les deux méthodes, et vous pouvez utiliser celle qui vous convient le mieux.
Méthode 1 : Modifier le logo et l’URL de connexion de WordPress à l’aide d’une extension
La première chose à faire est d’installer et d’activer l’extension Colorlib Login Outil de personnalisation. Pour plus de détails, consultez notre guide étape par étape sur l’installation d’une extension WordPress.
Dès qu’elle est activée, l’extension ajoute un nouvel élément de menu au personnalisateur de thème WordPress. Il suffit de naviguer dans Apparence » Personnaliser et de cliquer sur le nouvel article » Colorlib Login Outil de personnalisation » pour lancer le personnalisateur de connexion.
Note : cette option n’est pas disponible si vous utilisez un thème sur blocs, nous vous recommandons donc d’utiliser la méthode du code si c’est le cas.
L’Outil de personnalisation de la connexion chargera votre écran de connexion WordPress par défaut avec des options de personnalisation sur la gauche et une Prévisualisation en direct sur la droite.
Pour remplacer le logo WordPress par le vôtre, cliquez sur l’onglet « Options du logo » à droite.
À partir de là, vous pouvez masquer le logo WordPress, téléverser votre propre logo personnalisé et modifier l’URL et le texte du logo.
Vous pouvez également personnaliser la taille et la couleur du texte ainsi que la largeur et la hauteur du logo personnalisé.
Le plugin vous permet également de personnaliser complètement la page de connexion par défaut de WordPress. Vous pouvez ajouter des colonnes, des images d’arrière-plan, modifier les couleurs du formulaire de connexion, et plus encore.
Modifié, vous pouvez créer une page de connexion WordPress personnalisée sans modifier l’URL de connexion par défaut de WordPress.
Une fois que vous avez terminé, il vous suffit de cliquer sur le bouton » Publier » pour enregistrer vos modifications. Vous pouvez maintenant visiter la page de connexion de WordPress pour voir votre formulaire de connexion personnalisé en action.
Méthode 2 : Modifier le logo et l’URL de connexion de WordPress à l’aide d’un code
Cette méthode vous permet de remplacer manuellement le logo WordPress sur l’écran de connexion par votre propre logo personnalisé sans avoir recours à une extension. Elle convient également aux thèmes en bloc.
Tout d’abord, vous devez téléverser votre logo personnalisé dans la médiathèque. Outil de personnalisation » Outil de télé versement des médias » et téléverser votre logo personnalisé.
Une fois l’image téléversée, cliquez sur le lien « Modifier » situé à côté. Cela ouvrira la page Modifier le média, où vous devrez copier l’URL du fichier et la coller à un endroit pratique, par exemple dans un fichier texte vierge sur votre ordinateur.
Ensuite, vous devez ajouter l’extrait de code suivant au fichier functions.php de votre thème ou utiliser l’extension WPCode pour ajouter facilement du code personnalisé sans casser votre site (recommandé) :
function wpb_login_logo() { ?>
<style type="text/css">
#login h1 a, .login h1 a {
background-image: url(http://path/to/your/custom-logo.png);
height:100px;
width:300px;
background-size: 300px 100px;
background-repeat: no-repeat;
padding-bottom: 10px;
}
</style>
<?php }
add_action( 'login_enqueue_scripts', 'wpb_login_logo' );
N’oubliez pas de remplacer l’URL de l’image d'arrière-plan
à la ligne 4 par l’URL du fichier que vous avez copié précédemment. Vous pouvez également ajuster d’autres propriétés CSS pour qu’elles correspondent à l’image de votre logo personnalisé.
Vous pouvez maintenant visiter la page de connexion de WordPress pour voir votre logo personnalisé.
Cependant, ce code remplace uniquement le logo WordPress. Il ne modifie pas le lien du logo, qui pointe vers le site WordPress.org.
Modifions cela.
Ajoutez simplement le code suivant au fichier functions.php de votre thème ou au WPCode. Vous pouvez le coller juste en dessous du code que vous avez ajouté précédemment :
function wpb_login_logo_url() {
return home_url();
}
add_filter( 'login_headerurl', 'wpb_login_logo_url' );
function wpb_login_logo_url_title() {
return 'Your Site Name and Info';
}
add_filter( 'login_headertitle', 'wpb_login_logo_url_title' );
N’oubliez pas de remplacer « Nom de votre site et informations » par le nom de votre site. Le logo personnalisé de votre écran de connexion pointera désormais vers la page d’accueil de votre site.
Désactiver le sélecteur de langue de la page de connexion de WordPress
La version 5.9 de WordPress a introduit une nouvelle option de connexion déroulante qui permet aux utilisateurs/utilisatrices de sélectionner une nouvelle langue lorsqu’ils/elles se connectent à un site.
S’il y a plus d’une langue active sur le site, cette option apparaîtra.
Cela fonctionne bien pour les sites multilingues et les équipes avec différents utilisateurs/utilisatrices qui pourraient vouloir accéder au Tableau de bord WordPress dans une autre langue.
Mais si vous souhaitez que votre page de connexion reste simple et que vos utilisateurs/utilisatrices n’aient pas besoin de changer de langue fréquemment, retirer le sélecteur de langue peut aider à la désencombrer. Vous pouvez le faire à l’aide d’une extension ou d’un code.
Méthode 1 : Désactiver le sélecteur de langue à l’aide d’une extension
Tout ce que vous avez à faire est d’installer et d’activer l’extension Disable Login Language Switcher. Une fois activé, l’option de changement de langue sera automatiquement retirée. Il n’y a aucun réglage supplémentaire à définir.
Désormais, lorsque vous accéderez à votre écran de connexion, vous verrez l’écran de connexion standard sans l’option de changement de langue.
Méthode 2 : Désactiver le sélecteur de langue à l’aide d’un code
Une autre façon de désactiver le sélecteur de langue est d’ajouter du code à WordPress.
Il suffit d’ajouter l’extrait de code suivant à votre fichier functions.PHP ou dans les extraits de code WPCode. Pour plus de détails, consultez notre module sur l’ajout d’extraits de code personnalisés dans WordPress:
add_filter( 'login_display_language_dropdown', '__return_false' );
Pour plus de détails, consultez notre guide sur la désactivation du sélecteur de langue sur l’écran de connexion de WordPress.
C’est tout. Nous espérons que cet article vous a aidé à apprendre différentes façons de créer une page de connexion WordPress pour votre site. Vous pouvez également consulter notre tutoriel sur l’ajout d’une connexion Google en un clic dans WordPress ou notre guide sur le choix du jeu de couleurs parfait pour votre site.
Si vous avez aimé cet article, veuillez alors vous abonner à notre chaîne YouTube pour obtenir des tutoriels vidéo sur WordPress. Vous pouvez également nous trouver sur Twitter et Facebook.
Mrteesurez
As you have said in this article that many people used the default WordPress login page, but I want ask if it is safe ?, because that is the sample page admin also used to login.
Hope to there will not a hacking attempt ??
WPBeginner Support
For security concerns we would recommend taking a look at our guide below. There is no new security concerns added with a custom login page vs the standard login page.
https://www.wpbeginner.com/wordpress-security/
Administrateur
Jiří Vaněk
This article will be a great use for websites I make for other people, so I can also make a login screen for them according to their wishes. Websites that are then managed by their owners can have a little something extra, which the competition usually does not, and that is always a big advantage. Moreover, I did not expect that it could be this simple.
Moinuddin Waheed
Thanks for this helpful guide as I have thought many times over to have different login page than the one comes default with WordPress.
I was not aware this is this much easy to get without having to do with complex set of code and thinking.
I will be using seedprod to get the beautiful login page for my websites.
KateOsborn
Thank you for your helpful videos. I have successfully installed TML and like the look of the login page. If not logged in, though, and an attempt is made to access different pages from the header, such as a product page, the user is taken to a default login page, not the TML one. How do I fix this? Thank you.
WPBeginner Support
That would depend on your specific site and if you have a membership plugin or a coming soon plugin that is redirecting your users that could be part of the issue.
Administrateur
Ashok Pandit
Confused about login url after we use the last method. What would be the login url if we use, « Change WordPress Login Logo and URL without Plugin (Code) ». I want to only to change login url though.
WPBeginner Support
The third method is for changing the logo URL not the login URL. The login URL would not change with that method.
Administrateur
Aidin Mohajer
Hi,
Thanks for all the information about wordpress. Very useful.
Best Regards
Aidin
WPBeginner Support
You’re welcome
Administrateur
kato d
Oh also, could you also show us how to use css to change the button color and text color on the login screen? I would like to make a fancy custom login page but at least changing away from the wordpress blue would look better with our black, white and red logo. thank you, helpful article, appreciate it!
WPBeginner Support
You would need to use CSS to edit the styling of your site like that, for a starting point you would want to take a look at our article below:
https://www.wpbeginner.com/wp-tutorials/basics-of-inspect-element-with-your-wordpress-site
Administrateur
kato d
Will check that out, thank you!
kato d
Thank you, very helpful, i used the code method to change the functions.php in my child theme to replace the wordpress logo with our own and it looks better now.
WPBeginner Support
Glad our guide could help you
Administrateur
Andanu
Its nice plugin
WPBeginner Support
Glad you like our recommendation
Administrateur
Hasibul Islam
Hello there, How can I edit the login page without any plugin!??? With HTML and CSS…and in theme file..where is the login file… which I have to edit!!! Please help me.. thanks
WPBeginner Support
For that kind of customization, you would want to look at the WordPress codex for examples: https://codex.wordpress.org/Customizing_the_Login_Form
Administrateur
S.kamal
My problem is when a user login, he or she will be directed to WP admin dashboard.. How do I fixed that?
WPBeginner Support
You would want to take a look at our article on how to redirect users on login here: https://www.wpbeginner.com/plugins/how-to-redirect-users-after-successful-login-in-wordpress/
Administrateur
David DLima
I do not see the screens as shown in the article. Is there a paid version of this plugin?
All I can see is the Settings and Extensions options in the TYL admin menu.
David
WPBeginner Support
The Theme My Login plugin had a large overhaul after we created this article, we will certainly look into updating this article.
Administrateur
David DLima
Hi,
This is an awesome article. I have one doubt in this whole process. How do I validate the username and password ? I do not see anything on that in the article.
For e,g, how does the form know whether the username and password is valid?
Regards
David DLima
WPBeginner Support
It would check your WordPress database to see if the user is valid
Administrateur
kris
I’m new to Wordpress and am trying to set up a small blog on my own.
I’m toying with the idea of having readers ‘sign or log in’ to be able to gain access to extra features.
From what I understand in this thread is how to create the log in form and apply it to your site, but how do you adjust the access to features or essentially what the are logging in for?
WPBeginner Support
For what it sounds like you’re looking for, you may want to look into a membership plugin depending on the features you’re wanting them to have access to: https://www.wpbeginner.com/plugins/5-best-wordpress-membership-plugins-compared/
Administrateur
Ahsan
This plugin is not available in this time. So, how can i create login page?
WPBeginner Support
While theme my login was updated after this article was created, both plugins should still be available to use to create a login page.
Administrateur
suresh
Hi ,
Thanks for all your replies and videos. Great help! I have three questions, would highly appreciate, if you answer.
(i)I am also puzzled what could be the use of « login widget », if it does not include an option for sign-up. So the users, who are not registered, will have to be directed to some other page.
(ii) How to integrate social login, with the « elementor login wigdget »?
(iii) Is there no way for creating » registration form » using elementor.
Thanks
suresh
Josh
I’m blown away!
I’m not a « tech » guy, but I own 6 or 7 badly, barely managed websites. I have huge aspirations, but not the talent or team to go with it. I may take me until I’m 100, but eventually I’ll build out my vision. I working on it. Regardless, that’s not the point of this post. It’s just to describe me.
I’m looking for more automation, and specifically was looking for a way to create/buy/obtain a pop-up with social logins (FB & Google) to build my list, which, if you can recommend one, I’d be most appreciative.
I read one of your articles and as I was leaving, saw you Ultimate toolkit. In just briefly skimming through it, I found answers to several things I’ve wanted to know about and 2 or 3 questions I didn’t even know I had. I know a truly valuable lead magnet when I see one, and I just wanted to take a second to commend you on this one. FREE VALUE!
Thank you
Joshua Houston
Martin
A really great article, easy to understand and Implemented on my site in minutes. Thank you.
TJ
Theme My Login is no longer an option. They went to an all paid model and rewrote their entire plugin.
Kareem
Hello,
When users try to register through TML they don’t receive activation e-mail .. how can i solve that !?
WPBeginner Support
Hey Kareem,
Please see our article on how to fix WordPress not sending email issue.
Administrateur
Mukesh Patel
Can I customise my default WordPress login page without any plugin. Actually I need only to change WordPress logo on /wp-login page.
Eymiel
Can I use these forms for a modal? Because im trying to make a modal log in.
WPBeginner Support
Hi Eymiel,
If your modal accepts shortcodes then you can add form shortcode in there.
Administrateur
Karrie Daze
Is there a way to send members to a login specific page after they have logged in? TIA
WPBeginner Support
Hi Karrie,
Yes both Theme My Login and WPForms allow you to choose where to send users after they have logged in.
Administrateur
BricABrac
What I would actually like to do is get users to land on a certain page on my website no matter where they come from or which link they use – even if ti is to one of the other pages on my site.
Once they have landed, i want to redirect them to the page they chose to visit.
Can we do this and how?
Nick
I want a section where staff can log in to a single page where there will be a form for them to log in their daily work.
Is this possible and if so which plugin would best suit my needs?
Sierra
Hello!
I’ve created a free resource library for my website and I want to collect emails in exchange for the password in order to grow my email list. I am having such a hard time finding a way to customize a password-entry page because I don’t want anyone to have their own account or anything, I just want them to enter a password that I’ve set so they can gain access to the library. I don’t like the WP password protection feature because I want to be able to collect emails on the same page that they enter the password on so it’s like « If you have the password, enter it here. If you don’t have the password, enter your email and I’ll send it to you. » Would I be able to do something like that here? Do you have any suggestions? I would so greatly appreciate it because I’ve been stuck on this issue for like 3 days now!
Thanks so much,
Sierra
WPBeginner Support
Hi Sierra,
If you are using WPForms, then you can redirect users to the download page. You can also send them an email notification with the download link or password. Another solution could be sending the link or the password in an auto reply using your email marketing software. This way you will also be able to verify their email address.
Hope this helps
Administrateur
Robert
Hi Sierra, I have come across your post. I have just started building my blog, and I am facing the same issue as you have had. Would you mind sharing your advice on how to create a password protected page for users and obtain their email address for the newsletter? Thank you in advance, Rob
Rahul Tyagi
Thanks for the tutorial really its an awesome plugin..
solomon
I have one customized page for specific user, do you have any plugin for that ?
Mridul
how to add social media login ? i want to add social media login but i cant use any thirdparty plugin. how to do
Alex
This is a great article but how can we do what you currently have at wpbeginner.com/wp-admin
It asks for a password before loading the page. How can we achieve this?
Arize
That’s some bullet proof sh*t going on there.
mike
need to pay $ 199/yeart for having login form addon in WP forms!!!!!!
dean wilson
I am using plugin ‘Admin Custom Login’ and would like this page for normal subscriber login/register. Can I make a menu page in WP with this address?
Thank you.
WPBeginner Support
Hi Dean,
Yes you can add it to the navigation menu and your users will be able to login through this page.
Administrateur
Chaz H
Hi,
I’d just like to create a login page and link so users can upload posts and photo’s. I tried TML but nothing seems to happen when I refresh my home page. And my version of WPForms is lite. I don’t have money to purchase the full version if thats what is necessary. Just want my users to have a log in page! And tips
WPBeginner Support
Hey Chaz,
Please check your theme my login settings. You can also try updating WordPress permalinks. Simply visit Settings » Permalinks and then click on the save changes button without changing anything.
Administrateur
numan malik
hi
i’m trying to find the coding for customize the wrodpress login page using my own custom fields. can u help me what is the code for it?
kris
I need help, so I need to be able to add a client login to my website but just for a few pages, I can’t remember how to do this. I don’t build site all the time. I want the site to be free so everyone can look at it I just need a few pages to be for my clients and agents.
WPBeginner Support
Hey Kris,
Please take a look at our article on how to add temporary login in WordPress.
Administrateur
siri
the username and password for the login page, is that the same for accessing the admin area, or do we need to create a new username and password for the custom login area?
Roger Thomas
TML is a nice plugins that’s we are using on our website. However, login page sometimes redirected to home page on our travel website, but whenever cache are deleted, it’s working fine…
Thanks for your suggestions..
Nishant
I was looking for creating own login page template with all the functionalities. Is there any way of creating our own login page template without plugin. Or codex section where we can learn and create our own login template.
clever ubiagege
Hi,
I tried implementing the theme my login plugin to my website, but now I can not even login as an admin. What could be the problem?
Saurabh Saneja
Hi,
just you can open from yousite/wp-login.php
Replace yoursite with whatever is the name of your website.
If you want to remove the plugin change it name to something else by accessing the plugin through filezilla/winscp or from your cpanel .
Adi Prabhune
Hello, just wanted to know if when you create a login like this, if the members of the site are redirected to their own account. I run a tax company and I want my clients to be able to access their account and then upload files through there, as well as see the status of their specific tax return. Their account would have to be linked to their login IDs that way they can see what is specific to them. Please let me know, thank you.
veer choudhary
Good wordpress theme for developing
RUPESh
Plug-in is amazing,but i it is showing RERGISTRATION NOT ALLOWED
Saurabh Saneja
Same here!! I wish I could find a solution to this!!
Saurabh Saneja
From wordpress backend settings ->general
allow users registration. It will be something like that:
Registration Settings
Allow new registrations New registrations settings Registration is disabled.
User accounts may be registered.
Logged in users may register new sites.
Both sites and user accounts can be registered.
Prasad
Hi, I have installed the TML plugin but I couldn’t find any shortcodes for ‘Registration’ & ‘Login’ pages to show them on the front-end. Please help me. Thanks.
Ewan
Installed TML but no Login showing on the website. ( Latest update of WP
No Page ID available in General settings. so TML does not work.
WPBeginner Support
We tested it with the latest version of WordPress, and we were unable to confirm your report. The plugin works fine at our test sites.
Administrateur
Tom
You might want to edit the article. TML no longer appears in ‘settings’ but in the main dashboard menu as ‘TML’… Took me ages to realise as there are old issues around it needing you to disable other plugins etc. So I’d gone through a lot of troubleshooting, when it was staring me in the face!
WPBeginner Support
Please take a look at our new article How to add front end login page and widgets in WordPress
Steven Denger
I have been trying for god knows how many days and today several hours installing and uninstalling login/registration plugins. I have followed every lesson along the way and followed yours closely. But – another total failure. This did not work. It created all the pages but put the profile/registration form on all of them. I give up! How do all of these sites get logins? Because nothing what-so-ever works for me. I can write a book on all the plugins and programs that I have tried. I am not going to hire a web developer to put one in because this task should not be that hard. But I can tell you it must be .
I will just have to do without like a lot of things in wordpress that are just not accessable to all – just web developers. It is too bad that one cannot have a decent normal site like the web developers can. Doing without a lot of functions is getting to be a real problem with me and wordpress. When the forums do not help – and the plugins don’t work – I just just have to give up and do without.
kris
it is not hard nor did I use a plugin last time, it is on the menu page but I forgot how to do this, a guy wanted to charge me $80 to do this and I won’t pay either. it is easy I can’t remember how to do it, I have been looking for days.
kathy
Go t fed up trying with this., I’m sure it’s a great plugin but it is inconsistent. I cannot find the login page – it appears intermittently and then I cannot get a registration page to work properly.
Pfft! Tired
Joe Barrett
Is there a way/ any documentation to do this with out a plugin? Please help.
nate
http://www.paulund.co.uk/create-your-own-wordpress-login-page#
Anna
waw, thanks for the video, very helpful.
one further question: I am building a site with a paid membership. I want to customize not only the login page but also the WP default page you get when your are logged in (i.e. with the dashboard on the left etc,…) is there a plugin for that?or coding is necessary?
Thanks
Anna
jonny
Does anybody know how to move a site that has this plugin installed? When I try to move the site, the login page completely stops working.
Thanks for any suggestions.
Raina
Custom login form is the best of all the plugins that i have tried.
Martin
Hi, there could be a few reasons why this could happen.
Try disabling the plugin, then move the site,
Refresh your permalinks, then enable it again.
kkramer2195
I came across this plugin recently and LOVE IT!!!! I am trying to figure out how to verify a person is logged in prior to allowing them to write a post using Gravity Forms.
All forms work properly, I found generic code to redirect to wp-login.php but since I am using the plugin, I want it to redirect to the same as the theme my login screen does.
Here is sample code: (setup as page_loggedin.php)
<?php else:
wp_die('Sorry, you must first log in to view this page. You can register free here.');
endif; ?>
I don’t want hard coded site references, so any help with the PHP code will be appreciated! Preferred choice would be if user not logged in the redirect like the plugin does (but I can’t find how it does it yet)
Ken
WPBeginner Staff
Seems like the code you wanted to share is stripped out by Disqus. Please refer to Syntax Highlighting in Disqus.