• Caractéristiques
  • Modèles
  • Tarification
  • French
  • Caractéristiques
  • Modèles
  • Tarification
  • French
Ops ! Votre widget recherché n'a pas été trouvé ! Avez-vous une idée ? Si c'est le cas, Soumettre ici

Comment personnaliser la page de connexion de WordPress sans installer de plugin

Ce que vous ne savez peut-être pas à propos de WordPress, c'est qu'il est possible de personnaliser la page de connexion de WordPress. C'est une chose à laquelle peu de gens s'intéressent, mais c'est une fonction importante que vous devriez examiner.

Dans cet article, nous allons mettre en évidence l'application de la page de connexion de WordPress, pourquoi elle est importante et comment la personnaliser. Cet article sera à la fois amusant et instructif pour vous.

Alors, commençons !

Qu'est-ce que la page de connexion de WordPress ?

Customize WordPress Login Page

Une page de connexion est une page à laquelle l'administrateur du site web ou les utilisateurs accèdent pour accéder aux services de backend du site. WordPress a une interface de connexion par défaut pour la même raison.

Pour accéder à cette page, vous devez ajouter des mots spécifiques à la fin de l'adresse du lien de votre site web. Par exemple, www.mysite.com/wp-admin.

Normalement, cette page ne devrait être accessible qu'à l'administrateur. Dans le cas d'un site web multi-utilisateurs, cette page peut être accessible à un plus grand nombre d'utilisateurs.

Quoi qu'il en soit, il devrait y avoir deux raisons de personnaliser la page de connexion :

  • Pour des raisons de sécurité : La page de connexion de tout site web est un point d'accès direct pour n'importe qui. Bien entendu, il s'agit d'une interface protégée par un mot de passe. Ainsi, quelle que soit la personne, elle ne peut y accéder que si elle connaît les codes de sécurité. Mais une fois que les pirates commencent à les deviner, votre site web peut se retrouver dans une situation très dangereuse. Il est donc important de couvrir cette partie.
  • Pour l'image de marque : Un site web présente l'image même d'une entreprise. Plus la marque est importante, plus la structure du site est soignée. Ainsi, un site web de marque sous WordPress peut choisir de personnaliser la page de connexion à des fins d'image de marque.

En fait, vous pouvez personnaliser la page de connexion sans aucun plugin tiers. C'est une tâche qui incombe aux développeurs. Mais vous pouvez le faire si vous savez exactement ce qu'il faut faire. C'est ce que nous allons vous montrer ici.

Quelques exemples de pages de connexion

La plupart des sites web de marque ont des interfaces de connexion personnalisées. Chacune d'entre elles a sa propre personnalité et son propre style.

Amazon login page

Jetez un coup d'œil à la page de connexion d'Amazon. Elle présente le logo de la marque, les interfaces de connexion et d'inscription, ainsi que quelques informations. Elle présente le même arrière-plan blanc que le site web principal.

Facebook Login page

Dans le cas de Facebook, la page de connexion comporte un en-tête et un corps de texte. La page indique aux visiteurs de quoi il s'agit exactement.

Vous savez maintenant ce que les grandes marques font avec leur page de connexion. Entrons dans le vif du sujet de la personnalisation.

Personnaliser pour la sécurité

Bien qu'un pirate ne puisse pas pénétrer sur votre site web sans le code d'accès, cela ne signifie pas que les attaques cesseront.

Lorsque quelqu'un tente d'accéder à la page de connexion du site, celle-ci génère et exécute plusieurs scripts dans le backend. Un pirate informatique peut déclencher plusieurs demandes d'accès en l'espace d'une seconde. En conséquence, votre site risque de s'étaler et de devenir lent.

Bien que la plupart des sites disposent d'un système de bannissement d'IP pour empêcher cela, ce n'est pas suffisant contre une attaque distribuée. Pour éviter cela, vous devez donc personnaliser la page de connexion de WordPress.

Vous pouvez changer l'URL de la page de connexion de wp-admin à anything-login. De cette façon, vous produirez une URL unique que les pirates ne pourront pas deviner.

Je vais vous montrer comment faire.

Suivre le processus

Aller à Tableau de bord> Apparence> Editeur de thème

Sélectionnez votre thème de travail et cliquez sur le bouton Thème Fonction fichier.

function redirect_to_null_page(){
$new_login= 'logmein';
if(strpos($_SERVER['REQUEST_URI'], $new_login) === false){
wp_safe_redirect( home_url( 'Not Found' ), 302 );
exit(); } }
add_action( 'login_head', 'redirect_to_null_page');
function redirect_to_actual_login(){
$new_login = 'logmein';
if(parse_url($_SERVER['REQUEST_URI'],PHP_URL_QUERY) == $new_login&& ($_GET['redirect'] !== false)){
wp_safe_redirect(home_url("wp-login.php?$new_login&redirect=false"));
exit(); } }
add_action( 'init', 'redirect_to_actual_login');

Ajoutez ces lignes dans le fichier function.php pour terminer la personnalisation de la page de connexion de WordPress.

Les utilisateurs peuvent maintenant accéder à la page de connexion en cliquant sur le lien : yourwebsite.com/wp-admin.php?logmein au lieu de yourwebsite.com/wp-admin.

Le code redirigera l'interface de connexion vers le chemin nouvellement ajouté et renverra le lien précédent vers une page vierge. De cette manière, votre page de connexion est à l'abri des attaques DDoS.

Personnaliser la page de connexion de WordPress pour le branding

L'interface de la page de connexion par défaut convient à tout site web normal. Mais un site web de marque qui accueille fréquemment des utilisateurs a besoin d'une interface de connexion personnalisée.

Il y a plusieurs choses que vous pouvez personnaliser sur la page de connexion sans aucun plugin tiers. Vous pouvez changer le logo, l'arrière-plan de la page, les champs de saisie, ajouter des liens d'information, etc. Ici, nous allons vous montrer comment insérer le logo et changer l'image de fond de la page de connexion.

function wpb_login_logo() { ?>

#login h1 a, .login h1 a {
background-image : url(http://logo.png) ;
height:100px ; width:300px ;
background-size : 300px 100px ;
background-repeat : no-repeat ;
padding-bottom : 10px ; }
 <?php }
add_action( 'login_enqueue_scripts', 'wpb_login_logo' ) ;

Ajoutez ces lignes de code à l'intérieur du fichier thème function.php fichier. Sélectionnez le fichier PNG du logo et téléchargez-le dans le média de fichiers de votre tableau de bord. Copiez ensuite l'URL de ce fichier et collez-la dans le champ background-image : url(http://logo.png) ; URL du logo.

Vous verrez maintenant le logo par défaut de WordPress disparaître au profit du logo de votre marque.

Modifier l'image de fond

function login_background_image() {
echo '
body.login{
background-image : url("http://bgimage.png" )important ;
}
' ;
}
add_action('login_head', 'login_background_image') ;

De la même manière que pour le logo, vous pouvez modifier l'image d'arrière-plan en ajoutant les lignes suivantes dans ce fichier function.php fichier. Comme précédemment, téléchargez l'image dans la bibliothèque multimédia et collez son lien dans le code. Le tour est joué !

Ainsi, vous pouvez créer une page de connexion WordPress personnalisée par vous-même. D'ailleurs, si vous souhaitez créer une page de connexion personnalisée, vous pouvez vous aider de ce blog. ici. Il contient les mots des développeurs qui ont mis au point WordPress.

Bonus : Si vous n'êtes pas non plus à l'aise avec de tels codes personnalisés, vous pouvez simplement utiliser Elementor addons pour personnaliser toutes vos pages WordPress comme la page d'accueil, les produits, la caisse en utilisant des widgets et des modèles pré-conçus avancés.

Conclusion

Personnaliser un site web n'est pas très difficile avec WordPress. Nous faisons partie de la communauté qui aide les nouveaux utilisateurs à mieux comprendre WordPress. C'est pourquoi nous publions ces blogs d'astuces et de réglages pour le bénéfice de nos chers visiteurs.

Merci de rester avec nous et de nous soutenir avec votre opinion honnête. Si vous avez une minute de libre, n'hésitez pas à visiter nos Element Pack qui est conçu pour les Elementor Page builder. Il comprend plus de 180 widgets essentiels pour concevoir le site Web de vos rêves.

Merci encore d'avoir lu ce blog.

Laisser une réponse

Table des matières

Copyright © 2025 BdThemes. Tous droits réservés.

Money Transfer Logo