Récemment un de nos lecteurs nous a demandé s’il était possible de changer la taille de votre logo dans WordPress ?

Le logo de votre site Web est une partie importante de votre marque. Selon le thème WordPress que vous utilisez, il n’est parfois pas clair comment modifier la taille de votre logo pour l’agrandir ou le réduire.

Dans cet article, nous allons vous montrer comment changer facilement la taille du logo WordPress, étape par étape.

Pourquoi changer la taille du logo dans WordPress ?

Lorsque vous téléchargez votre logo sur WordPress, il se peut qu’il ne soit pas toujours de la bonne taille.

Un logo trop petit ne se démarquera pas. Alors qu’un logo trop grand peut finir par avoir un impact négatif sur la conception de votre site Web.

Si vous avez investi dans une conception de logo personnalisée, vous voulez vous assurer que votre logo apparaît à la bonne taille dans l’en-tête de votre site Web.

Pour ceux qui sont encore dans le processus de conception de logo, consultez notre sélection des meilleurs créateurs de logo gratuits.

Cela étant dit, nous allons vous montrer différentes manières que vous pouvez utiliser pour modifier la taille du logo dans WordPress.

La méthode que vous choisirez dépendra du thème WordPress que vous utilisez et de votre niveau de confort avec l’édition de code CSS.

  • Modifier la taille du logo WordPress avec le personnalisateur WordPress
  • Modifier la taille du logo WordPress en modifiant le code CSS
  • Modifier la taille du logo WordPress sans modifier le code CSS

Méthode 1. Modifier la taille du logo WordPress avec WordPress Customizer

Le moyen le plus simple et le plus simple de modifier la taille du logo dans WordPress consiste à utiliser le personnalisateur de thème. Cependant, cette méthode ne fonctionne que si votre thème WordPress la prend en charge.

De nombreux thèmes populaires comme Divi, Astra, Ultra et d’autres ont un outil de changement de taille de logo intégré.

Lorsque vous téléchargez votre logo dans WordPress, ces thèmes facilitent l’ajustement du logo avec un simple curseur que vous pouvez utiliser pour ajuster la largeur et la hauteur.

Noter: la taille de votre logo sera seulement aussi grande que l’image que vous téléchargez, vous voulez donc vous assurer de télécharger une image de logo plus grande, si votre objectif est de l’agrandir.

Pour les besoins du didacticiel, nous montrerons comment modifier votre logo dans les thèmes Divi, Astra et Ultra, mais la méthode est similaire pour les thèmes WordPress les plus populaires. Si votre thème n’a pas cette option, alors vous devez utiliser la méthode 2 ou 3 de ce tutoriel.

Modifier la taille du logo WordPress dans le thème Divi WordPress

Tout d’abord, accédez à Divi » Personnalisateur de thème et cliquez sur l’option de menu « En-tête et navigation ».

Sélectionnez le personnalisateur de thème Divi

Après cela, cliquez sur l’option déroulante « Barre de menu principale ».

Ici, vous pouvez modifier la taille de votre logo.

Sélectionnez la barre de menu principale de Divi

Tout d’abord, vous devez régler le paramètre « Hauteur du menu ». Cela contrôle la hauteur de l’ensemble de votre menu de navigation et définira la taille de votre logo.

Après cela, vous pouvez modifier le paramètre « Logo Max Height », qui correspond à un pourcentage de la hauteur totale du menu.

Ajuster la hauteur du logo

Vous pouvez ajuster le curseur « Logo Max Height » de haut en bas jusqu’à ce que vous trouviez la taille de logo parfaite pour votre blog WordPress.

Assurez-vous de cliquer sur le bouton « Publier » pour enregistrer vos modifications avant de quitter l’écran.

Modifier la taille du logo WordPress dans le thème Astra WordPress

La première chose que vous devez faire est de naviguer vers Apparence » Personnaliser puis cliquez sur l’option de menu « En-tête ».

Personnaliser le thème Astra

Après cela, cliquez sur l’option de menu « Identité du site ».

Ici, vous pouvez facilement ajuster la taille de votre logo.

Cliquez sur l'identité du site dans Astra

Tout ce que vous avez à faire est de déplacer le curseur « Largeur du logo » vers la gauche ou vers la droite.

Vous pouvez automatiquement voir les changements de taille de votre logo en temps réel, lorsque vous déplacez le curseur.

Curseur de largeur du logo Astra

Une fois que vous êtes satisfait de la taille de votre logo, assurez-vous de cliquer sur « Publier » avant de quitter la page.

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 » Personnaliserpuis cliquez sur l’élément de navigation « Logo du site et slogan ».

Logo et slogan du site Ultra Click

Après cela, cliquez sur le menu déroulant « Logo du site ».

Ensuite, sélectionnez le bouton radio « Image du logo » qui apparaît.

Bouton logo du site ultra-clic

Maintenant, vous pouvez modifier la taille du logo en entrant de nouvelles dimensions dans les cases à droite de l’image de votre logo. Si vous souhaitez que l’image soit mise à l’échelle en fonction de la taille d’origine, saisissez uniquement les nouvelles dimensions du logo dans une seule case.

Vous pouvez modifier la largeur avec la case à gauche et la hauteur avec la case à droite.

Modifier la hauteur et la largeur du logo

Lorsque vous entrez de nouvelles dimensions, vous verrez la taille de votre logo changer en temps réel.

Une fois que vous avez fini de personnaliser la taille de votre logo, assurez-vous de cliquer sur le bouton « Publier ».

Si votre thème n’est pas mis en évidence ci-dessus, il est toujours possible que vous puissiez personnaliser la taille de votre logo en utilisant le personnalisateur WordPress.

Allez simplement sur Apparence » Personnaliser quel que soit le thème que vous utilisez et voyez quelles options de personnalisation sont disponibles pour votre logo ou votre en-tête.

Méthode 2. Modifier la taille du logo WordPress en modifiant le CSS

Si votre thème WordPress ne prend pas en charge la modification de la taille du logo à l’aide du personnalisateur de thème WordPress, vous pouvez modifier la taille en ajoutant du CSS personnalisé.

La première chose que vous devez faire est de naviguer vers la page d’accueil de votre site Web.

Ensuite, faites un clic droit n’importe où sur la page et sélectionnez l’option « Inspecter ». Cela fera apparaître un menu Inspecter qui affiche tout le code de la page.

Clic droit inspecter

Après cela, vous devez cliquer sur l’icône « Sélectionner un élément » qui ressemble à un pointeur de souris.

Cela vous permettra de sélectionner l’élément de logo de votre site Web et d’afficher le code.

Cliquez sur sélectionner une icône d'élément

Ensuite, survolez simplement le logo de votre site Web jusqu’à ce que la classe CSS apparaisse. Il ressemblera à l’image ci-dessous.

Vous utiliserez cette classe CSS pour personnaliser la taille de votre logo WordPress. Alors, écrivez ceci dans un éditeur de texte comme le Bloc-notes.

Logo classe CSS

Vous pouvez maintenant revenir à votre tableau de bord d’administration WordPress et accéder à Apparence » Personnaliser. Vous devez cliquer sur l’option de menu « CSS supplémentaire ».

Cela fera apparaître une liste déroulante dans laquelle vous pourrez ajouter du code CSS personnalisé.

Sélectionnez CSS supplémentaire

Ajoutez simplement la classe CSS que vous avez trouvée précédemment et spécifiez les nouvelles dimensions de l’image. Vous pouvez utiliser le code CSS ci-dessous comme exemple.

1
2
3
img.custom-logo {
     max-height: 100px !important;
}

Vous devez changer le img.custom-logo Classe CSS ci-dessus à la classe CSS utilisée par votre thème.

Vous pouvez également modifier le max-height à la taille que vous souhaitez.

Voici à quoi cela ressemble dans le personnalisateur WordPress.

Personnalisateur WordPress CSS supplémentaire

Une fois que vous avez effectué vos modifications, cliquez simplement sur le bouton « Publier » pour mettre vos modifications en ligne.

Méthode 3. Modifier la taille du logo WordPress sans modifier le CSS

Si vous n’êtes pas à l’aise pour éditer des fichiers de thème ou ajouter du CSS personnalisé, cette méthode est faite pour vous.

En utilisant un plugin de style WordPress, vous pouvez apporter des modifications visuelles à votre site comme si vous utilisiez un générateur de page par glisser-déposer.

Nous vous recommandons d’utiliser CSS Hero. C’est un plugin de styler qui vous permet de modifier presque tous les styles CSS de votre site WordPress sans écrire une seule ligne de code CSS.

Accord: Les lecteurs WPBeginner peuvent obtenir une réduction de 34% grâce à notre code promo 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 la façon d’installer un plugin WordPress.

Lors de l’activation, vous devez cliquer sur le bouton « Passer à l’activation du produit » pour activer le plugin. Il est situé juste au-dessus de votre liste de plugins installés.

Activer le plugin CSS Hero

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 et vous serez redirigé vers votre site une fois votre compte vérifié.

Après cela, cliquez sur le bouton « Personnaliser avec CSS Hero » en haut de votre barre d’outils d’administration WordPress.

Personnaliser avec CSS Hero

Cela vous mènera à votre site Web avec CSS Hero exécuté dessus. CSS Hero utilise un éditeur WYSIWYG (What You See Is What You Get).

Lorsque vous cliquez sur n’importe quel élément de votre page, une barre d’outils apparaîtra à gauche pour effectuer des personnalisations.

Aperçu CSS Hero

Ensuite, cliquez sur votre logo WordPress en haut de la page.

Après cela, cliquez sur le lien « Afficher les accessoires avancés ».

Cliquez sur Afficher les accessoires avancés

Cela vous donne encore plus d’options de personnalisation CSS.

Ensuite, localisez la case « Mesures ». Vous trouverez ici des options appelées « Largeur max » et « Hauteur max ».

Vous souhaitez les modifier à la taille d’image que vous préférez. Si vous souhaitez que l’image conserve les mêmes dimensions, modifiez uniquement la hauteur ou la largeur.

Définir la largeur et la hauteur du logo

Les modifications que vous apportez apparaîtront automatiquement sur votre page.

Une fois que vous avez terminé de modifier la taille de votre logo, vous devez cliquer sur « Enregistrer et publier » pour appliquer vos modifications.

Nous espérons que cet article vous a aidé à changer la taille de votre logo WordPress. Vous pouvez également consulter nos choix d’experts pour le meilleur logiciel de chat en direct pour les petites entreprises, et notre liste des plugins WordPress indispensables pour les sites Web d’entreprise.

Si vous avez aimé cet article, veuillez vous abonner à notre chaîne YouTube pour les didacticiels vidéo WordPress. Vous pouvez également nous retrouver sur Twitter et Facebook.

LAISSER UN COMMENTAIRE

S'il vous plaît entrez votre commentaire!
S'il vous plaît entrez votre nom ici