Voulez-vous apprendre comment changer la taille de votre logo WordPress ?
Le logo de votre site web est une partie importante de votre marque, vous voudrez donc vous assurer qu'il est beau. Cependant, il n'est parfois pas clair comment agrandir ou réduire le logo.
Dans cet article, nous allons vous montrer comment changer facilement la taille du logo WordPress dans n'importe quel thème.

Pourquoi changer la taille du logo dans WordPress ?
Que vous engagiez quelqu'un pour concevoir un logo personnalisé pour votre site WordPress ou que vous en conceviez un vous-même à l'aide d'un créateur de logos gratuit, les logos sont une partie importante de tout site web.
Cependant, les tailles d'images WordPress par défaut peuvent ne pas convenir à votre logo.
Un logo trop petit ne ressortira pas, tandis qu'un logo trop grand peut détourner les visiteurs du reste de votre contenu.
Bien que vous puissiez effectuer des modifications d'images de base dans WordPress, le logo de votre site est une partie importante de votre image de marque, vous voudrez donc vous assurer qu'il est superbe. Cela dit, voyons comment vous pouvez correctement changer la taille du logo dans WordPress. Utilisez simplement les liens rapides ci-dessous pour accéder à la méthode que vous souhaitez utiliser :
- Méthode 1 : Modifier la taille du logo avec le personnalisateur WordPress (recommandé)
- Méthode 2 : Modifier la taille du logo WordPress à l'aide de l'éditeur de site complet (thèmes basés sur des blocs uniquement)
- Méthode 3 : Modifier la taille du logo WordPress en modifiant le CSS (fonctionne avec la plupart des thèmes)
- Méthode 4 : Modifier la taille du logo WordPress sans modifier le CSS (sans code)
Méthode 1 : Modifier la taille du logo avec le personnalisateur WordPress (recommandé)
La manière la plus simple et la plus facile de modifier la taille du logo dans WordPress est d'utiliser le personnalisateur de thème. Cependant, cette méthode ne fonctionne que si votre thème prend en charge des tailles d'image supplémentaires dans WordPress.
La bonne nouvelle est que de nombreux thèmes populaires sont dotés d'outils intégrés pour redimensionner le logo, notamment Divi, Astra et Ultra.
Remarque : Votre logo ne sera jamais plus grand que l'image que vous téléchargez, alors assurez-vous de télécharger une image plus grande si vous souhaitez agrandir le logo.
Dans ce guide, nous vous montrerons comment modifier votre logo dans les thèmes Divi, Astra et Ultra, mais la méthode est similaire pour la plupart des thèmes WordPress populaires.
Même si nous ne couvrons pas votre thème spécifique, il vaut toujours la peine de voir si vous pouvez modifier la taille du logo en utilisant le personnalisateur WordPress.
Allez simplement dans Apparence » Personnaliser et recherchez tous les paramètres intitulés En-tête, Identité du site, Logo ou similaire.
Si vous ne voyez pas ces paramètres, vous pouvez toujours consulter la documentation de votre thème ou contacter le développeur pour obtenir de l'aide. Pour plus d'informations sur ce sujet, veuillez consulter notre guide sur comment demander correctement le support WordPress et l'obtenir.
Si votre thème n'a pas d'éditeur de logo intégré, vous devrez utiliser la méthode 2 ou 3.
Modifier la taille du logo WordPress dans le thème WordPress Divi
Tout d'abord, allez dans Divi » Personnaliseur de thème et cliquez sur « En-tête et navigation ».

Après cela, sélectionnez « Barre de menu principal ».
Ici, vous pouvez modifier la taille de votre logo. Par exemple, vous pourriez l'afficher comme une image en taille réelle.

Tout d'abord, vous devez ajuster le paramètre « Hauteur du menu ». Cela contrôle la hauteur de l'ensemble de votre menu de navigation, ce qui définira la taille que vous pouvez donner à votre logo.
Après cela, vous pouvez modifier le réglage « Hauteur max du logo », qui est un pourcentage de la hauteur totale du menu.

Vous pouvez faire glisser le curseur « Hauteur max du logo » vers le haut ou vers le bas jusqu'à ce que vous trouviez la taille parfaite pour votre blog WordPress.
Lorsque vous êtes satisfait de l'apparence du logo, assurez-vous de cliquer sur « Publier » avant de fermer le personnalisateur WordPress.
Modifier la taille du logo WordPress dans le thème Astra WordPress
Si vous utilisez le thème Astra, accédez à Apparence » Personnaliser et cliquez sur l'option de menu « Constructeur d'en-tête ».

Après cela, cliquez sur l'option de menu « Titre du site et logo ».
Ici, vous pouvez facilement modifier la taille de votre logo.

Faites simplement glisser le curseur « Largeur du logo » vers la gauche ou la droite pour agrandir ou réduire le logo.
Le personnalisateur WordPress affichera ces modifications dans son aperçu en direct, vous pouvez donc essayer différentes tailles pour voir ce qui convient le mieux à votre site Web WordPress.

Lorsque vous êtes satisfait de l'apparence du logo, cliquez sur « Publier » pour le rendre visible sur votre site Web.
Modifier la taille du logo WordPress dans le thème Ultra WordPress
Pour personnaliser la taille du logo dans le thème Ultra, accédez à Apparence » Personnaliser, et cliquez sur « Logo du site et slogan » dans le menu de gauche.

Après cela, cliquez sur la liste déroulante « Logo du site ».
Lorsqu'il apparaît, sélectionnez le bouton radio « Image du logo ».

Maintenant, vous pouvez agrandir ou réduire le logo en saisissant de nouvelles tailles dans les cases.
Vous pouvez modifier la largeur à l'aide de la case de gauche et la hauteur à l'aide de la case de droite.

Si vous souhaitez redimensionner le logo en fonction de sa taille d'origine, ne modifiez les dimensions que dans une seule case.
Au fur et à mesure que vous saisissez de nouvelles dimensions, la taille du logo changera en temps réel.
Lorsque vous êtes satisfait de l'apparence du logo, cliquez sur « Publier » pour rendre vos modifications publiques.
Méthode 2 : Modifier la taille du logo WordPress à l'aide de l'éditeur de site complet (thèmes basés sur des blocs uniquement)
Si vous utilisez un thème basé sur des blocs comme Hestia Pro, vous pouvez alors redimensionner les images sans perdre en qualité, en utilisant l'éditeur de site complet.
modifier la taille du logo à l'aide de l'éditeur de site complet.
Pour commencer, allez simplement dans Apparences » Éditeur dans le tableau de bord WordPress.

Par défaut, l'éditeur de site complet affichera le modèle de page d'accueil de votre thème.
Pour redimensionner le logo de votre site, vous sélectionnerez généralement « Motifs ».

L'éditeur affichera maintenant une liste de tous les motifs et parties de modèle qui composent votre thème.
Cliquez simplement sur l'option En-tête, qui contrôle la mise en page de l'en-tête de votre blog.

WordPress affichera maintenant toutes les parties du modèle d'en-tête qui composent le thème actuel. Trouvez simplement l'en-tête que vous souhaitez modifier et cliquez dessus.
Vous verrez maintenant un aperçu de ce modèle d'en-tête. Pour continuer et modifier le modèle, cliquez sur la petite icône en forme de crayon.

Une fois cela fait, cliquez pour sélectionner le logo de votre site.
Dans le menu de droite, sélectionnez l'onglet « Bloc ».

Ensuite, sélectionnez l'onglet « Paramètres ».
Vous pouvez maintenant agrandir ou réduire le logo en faisant glisser le curseur « Largeur de l'image ».

Lorsque vous êtes satisfait de l'apparence du logo, cliquez sur le bouton « Enregistrer ».
Maintenant, si vous visitez votre site Web, vous verrez le nouveau logo en action.
Méthode 3 : Modifier la taille du logo WordPress en modifiant le CSS (fonctionne avec la plupart des thèmes)
Si votre thème WordPress n'a pas de prise en charge intégrée pour modifier la taille du logo, une autre option consiste à ajouter du CSS personnalisé. Cela vous permet de redimensionner votre logo sans utiliser de plugin d'optimisation d'images distinct.
Pour commencer, vous devrez connaître la classe CSS du logo de votre site Web. Pour obtenir cette information, accédez à n'importe quelle page qui affiche le logo, telle que la page d'accueil de votre site.
Ici, faites un clic droit n'importe où sur cette page et sélectionnez l'option « Inspecter ».

Cela ouvrira un menu d'inspection qui affiche tout le code de la page d'accueil.
Après cela, cliquez sur l'icône « Sélectionner un élément », qui ressemble à un pointeur de souris.

Ensuite, placez simplement la souris sur le logo de votre site Web jusqu'à ce que la classe CSS apparaisse.
Cela ressemblera à l'image ci-dessous.

Vous utiliserez cette classe CSS pour personnaliser la taille de votre logo WordPress, alors notez la classe dans un éditeur de texte comme le Bloc-notes.
Dans le tableau de bord WordPress, allez dans Apparence » Personnaliser. Ensuite, cliquez sur l'option « CSS additionnel ».

Vous pouvez maintenant ajouter du code CSS personnalisé dans le petit éditeur de code.
Ajoutez simplement la classe CSS que vous avez trouvée précédemment, puis spécifiez les nouvelles dimensions du logo que vous souhaitez utiliser.
Voici un exemple de l'apparence du code :
img.custom-logo {
max-height: 100px !important;
}
Assurez-vous de modifier la classe CSS img.custom-logo et la valeur max-height.

Après avoir effectué vos modifications, cliquez simplement sur le bouton « Publier » pour les rendre visibles.
Méthode 4 : Modifier la taille du logo WordPress sans modifier le CSS (sans code)
Si vous n'êtes pas à l'aise avec la modification des fichiers de thème ou l'ajout de CSS personnalisé, vous pouvez utiliser un plugin CSS WordPress à la place. Ces plugins vous permettent d'apporter des modifications visuelles à votre site, similaires à l'utilisation d'un constructeur de pages glisser-déposer.
Nous recommandons d'utiliser CSS Hero car il vous permet d'optimiser les images et de personnaliser presque tous les styles CSS sans écrire une seule ligne de code CSS.
Offre : Les lecteurs de WPBeginner peuvent bénéficier d'une réduction de 40 % grâce à notre code de coupon CSS Hero.
La première chose à faire est d'installer et d'activer le plugin. Pour plus de détails, consultez notre guide étape par étape sur comment installer un plugin WordPress.
Après l'activation, cliquez sur le bouton « Procéder à l'activation du produit » pour activer le plugin. Vous le trouverez juste au-dessus de votre liste de plugins installés.

Cela vous amènera à un écran où vous pourrez entrer votre nom d'utilisateur et votre mot de passe. Suivez simplement les instructions à l'écran pour vérifier votre compte, et vous serez renvoyé au tableau de bord WordPress une fois terminé.
Après cela, cliquez sur le bouton « Personnaliser avec CSS Hero » dans la barre d'administration WordPress.

Vous verrez maintenant votre site Web avec CSS Hero en cours d'exécution par-dessus.
CSS Hero utilise un éditeur WYSIWYG (What You See Is What You Get), il suffit donc de cliquer sur n'importe quel élément de la page pour voir apparaître une barre d'outils avec toutes les personnalisations possibles.

Cliquez simplement sur votre logo WordPress en haut de la page.
Ensuite, sélectionnez le lien « Afficher les propriétés avancées » pour voir toutes les modifications que vous pouvez apporter à votre logo WordPress.

Dans la boîte « Mesures », vous trouverez les options « Largeur maximale » et « Hauteur maximale ».
Pour modifier la taille du logo, tapez simplement de nouveaux nombres dans ces champs. Si vous souhaitez conserver les dimensions d'origine de l'image, ne modifiez que la hauteur ou la largeur.

L'aperçu en direct affichera vos modifications automatiquement. Cela signifie que vous pouvez essayer différentes tailles pour voir ce qui rend le mieux.
Lorsque vous êtes satisfait de l'apparence de votre logo, cliquez sur « Enregistrer et publier » pour rendre le logo redimensionné visible.
Nous espérons que cet article vous a aidé à modifier la taille de votre logo. Vous voudrez peut-être aussi consulter notre sélection d'experts des meilleurs plugins WordPress pour la gestion des images, ou consulter notre guide sur la façon de choisir le meilleur format d'image pour WordPress.
Si cet article vous a plu, abonnez-vous à notre chaîne YouTube pour des tutoriels vidéo WordPress. Vous pouvez également nous retrouver sur Twitter et Facebook.

Jiří Vaněk
Merci pour ce tutoriel. J'avais l'habitude de lutter avec des logos complexes qui se déformaient lors du redimensionnement de l'écran sur différents appareils s'ils n'étaient pas au format SVG. Les images PNG ne conviennent pas bien à cela. Ce guide m'a aidé à comprendre comment mieux prévenir ce problème.
Dennis Muthomi
ET qu'en est-il de l'utilisation de logos comme vecteurs SVG au lieu d'utiliser des PNG ? Ou l'utilisation de logos SVG nécessite-t-elle des étapes spéciales par rapport aux formats d'image standard ?
Support WPBeginner
Vous devrez activer les SVG en suivant notre guide ci-dessous !
https://www.wpbeginner.com/wp-tutorials/how-to-add-svg-in-wordpress/
Admin
Dennis Muthomi
Je vous remercie d'avoir mis le lien vers ce tutoriel SVG !
Je l'ai lu et il semble assez facile d'ajouter la prise en charge des SVG en ajoutant cet extrait de code.
Merci encore WPBeginner
Ossama Alnuwaiser
J'ai un problème avec Google PageSpeed Insights, le redimensionnement approprié des images suggère que cela ralentit le site Web car il doit redimensionner l'image lors du chargement, ce qui affecte le temps de chargement. J'ai trouvé votre article très utile. Cependant, j'ai une question. Comment connaître la taille réelle de mon logo en fonction de mon thème. Grâce à vous, je sais maintenant comment le redimensionner, mais j'ai du mal à trouver la taille réelle du logo car, selon un autre article, la taille réelle du logo diffère selon le thème.
Support WPBeginner
Vous devrez vérifier auprès du support spécifique de votre thème car ils seraient les principaux à connaître la taille de l'image si elle ne figure pas dans la documentation de votre thème.
Admin
Mohammed Ghaleb
Si je change la taille du logo en modifiant le CSS, restera-t-elle telle que je l'ai modifiée en cas de mises à jour du thème ?