Si vous avez téléchargé votre logo sur WordPress mais qu’il semble trop grand ou trop petit, lisez la suite.

Parce que dans cet article, je vais vous guider à travers comment redimensionner le logo WordPress dans n’importe quel thème WordPress.

Même si vous utilisez un thème qui ne vous permet pas d’ajuster la taille du logo dans le personnalisateur, cet article vous aidera.

Allons-y dans un instant!

Modifiez la taille de votre logo si les paramètres de votre thème ne le permettent pas

Si vous utilisez un thème comme Divi, GeneratePress, Astra ou tout autre thème qui vous permet de modifier la taille du logo dans les paramètres de personnalisation, félicitations!

Faites défiler ci-dessous pour un tutoriel sur tous ces sujets.

Si vous avez déjà vérifié vos paramètres et que votre thème ne le permet pas, voici comment modifier la taille du logo à l’aide de CSS. Ne vous inquiétez pas, c’est facile si vous suivez mes étapes ci-dessous.

Comment redimensionner le logo WordPress à l’aide de CSS

CSS signifie feuille de style en cascade. Fondamentalement, c’est un langage qui indique au navigateur comment formater divers éléments sur une page.

Utilisons CSS pour changer le style de la taille du logo.

Étape 1: vérifier l’article

Élément d'inspection 1.css

Faites un clic droit n’importe où dans votre navigateur et vous verrez quelque chose comme «inspecter» ou «inspecter l’élément». Cliquez dessus pour afficher le code source de la page.

Étape 2: Cliquez sur le surligneur d’élément

2. Mettez en surbrillance les éléments css

Une fenêtre apparaîtra avec une icône qui ressemble à ceci. Clique dessus. Cela mettra en évidence tous les éléments de la page lorsque vous les survolerez.

Étape 3: remarquez l’élément du logo

3.css trouver la classe css

Déplacez la souris sur le logo et notez le texte qui apparaît. C’est la classe CSS que nous devons cibler pour redimensionner le logo.

Étape 4: Ouvrez le personnalisateur de thème

4.css Cliquez sur CSS supplémentaire

Ensuite, ouvrez le personnalisateur de thème et cliquez sur CSS supplémentaire.

Étape 5: ajoutez du code CSS

5.css Entrez l'extrait de code CSS

Ajoutez maintenant le code CSS suivant pour ajuster la taille de votre logo:

.my-css-class img { 
  max-height: 65px !important;
}

Et remplacer Classe .my-css avec votre propre classe CSS que vous avez trouvée dans l’élément surligneur.

Comme vous pouvez le voir dans l’image ci-dessus, ma classe est CSS .site-title-wrapper Cependant, le vôtre peut être différent selon le thème utilisé.

Une fois que vous avez ajouté le code, le logo devrait changer de taille. Vous pouvez ajuster la valeur de hauteur maximale pour obtenir la taille de votre logo souhaitée.

Cliquez sur publier et vous avez terminé!

Les didacticiels ci-dessous vous guideront à travers la modification de la taille du logo dans plusieurs thèmes WordPress populaires, bien que cela soit assez similaire pour tout thème qui le permet dans le personnalisateur.

Suivez ces étapes pour redimensionner le logo GeneratePress.

Étape 1: Ouvrez le personnalisateur de thème

1. Tous les sujets cliquez sur Personnaliser

Cliquez sur le thème Customizer sur votre tableau de bord WordPress.

Étape 2: Cliquez sur Identité du site

Étape 2 - Générer une identité de site Press-Click-Site

Ouvrez l’option Identité du site dans le personnalisateur.

Étape 3: modifiez ces paramètres

Étape 3 - Générez les paramètres pour le logo d'impression

Cachez le titre du site, téléchargez votre logo et utilisez le curseur pour choisir la largeur de votre logo.

Étape 4: Vous pouvez utiliser ou entrer le curseur

Étape 4 - Générer la largeur du logo de la presse

J’ai choisi la taille de mon logo à 250 pixels, mais vous pouvez décider de ce qui convient le mieux à votre site Web.

Étape 5: options d’espacement

Étape 5 - Exemple de création d'un logo de presse

Voici un exemple de ce à quoi ressemble mon logo. Si vous avez GeneratePress Pro, vous avez également des options d’espacement au-dessus et en dessous du logo.

Étape 6: cliquez sur Publier

Étape 6 - Générer Appuyez sur Publier pour publier

Cliquez sur Publier et vous pouvez modifier la taille du logo dans GeneratePress.

Comment redimensionner le logo WordPress dans Astra

Voici comment redimensionner le logo du design Astra.

Étape 1: Cliquez sur le personnalisateur

Étape 1 - Tous les thèmes cliquez sur Personnaliser

Cliquez sur le thème Customizer sur votre tableau de bord WordPress.

Étape 2: Cliquez sur Disposition

Étape 2 - Mise en page Astra Click

Cliquez ensuite sur disposition dans le personnalisateur.

Étape 3 - En-tête Astra Click

Cliquez ensuite sur Entête.

Étape 4: Cliquez ensuite sur Identité du site

Étape 4 - Identité du site Astra-Click

Et puis cliquez sur Identité du site pour accéder aux paramètres du logo dans Astra.

Étape 5: modifiez ces options

Étape 5 - Paramètres du logo Astra

Vous verrez alors les paramètres du logo. Téléchargez votre logo, choisissez la largeur de votre logo et décochez la case Afficher le titre du site.

Étape 6: curseur pour la largeur du logo dans Astra

Étape 6 - Largeur du logo Astra

Vous pouvez utiliser le curseur Largeur du logo ou saisir le numéro dans le champ. J’ai défini la largeur de mon logo sur 245 px.

Étape 7: c’est tout!

Étape 7 - Exemple de logo Astra

Voici à quoi ressemble mon logo après avoir défini la largeur. Cliquez sur Publier pour enregistrer vos modifications, et vous avez terminé.

Comment redimensionner le logo WordPress dans Divi

Et enfin, voici comment changer la taille du logo du thème Divi.

Étape 1: Cliquez sur Options du thème

Étape 1 - Options du thème Divi-Click

Dans le tableau de bord WordPress sous les paramètres Divi, cliquez sur Options du thème.

Étape 2 - Ajoutez le logo Divi et cliquez sur Enregistrer

Vous verrez alors les paramètres Divi où vous pouvez télécharger votre logo. N’oubliez pas d’enregistrer vos modifications.

Étape 3: Accédez au personnalisateur de thème

Étape 3 - Personnalisateur de thème Divi Click

Cliquez ensuite sur ‘Personnalisateur de thème’.

Étape 4

Étape 4 - Paramètres du logo Divi

Cliquez ensuite sur ‘En-tête et navigation’> ‘Barre de menu principal’ pour afficher les paramètres du logo Divi.

Divi est un peu différent ici.

Sélectionnez d’abord la hauteur de l’en-tête en sélectionnant l’option ‘HAUTEUR DU MENU’. J’ai mis le mien à 65px, puis le ‘HAUTEUR MAXIMALE DU LOGO’ est un pourcentage de la hauteur du menu.

Donc, si vous choisissez 100, ce sera la hauteur totale de l’en-tête sans espaces au-dessus et en dessous. J’ai mis le mien à 80% pour qu’il y ait un peu d’espace.

Étape 5: et vous avez terminé!

Étape 5 - Exemple de logo Divi

Voici à quoi ressemble mon logo avec ces paramètres. Cliquez sur Publier pour enregistrer vos modifications.

Conclusion

Comme vous pouvez le voir, changer la taille du logo pour WordPress est facile, et la plupart des thèmes accomplissent cela de la même manière.

Vous pouvez également utiliser le code CSS si votre conception ne dispose pas des paramètres de taille du logo dans le personnalisateur de conception.



Source link

Recent Posts