Comment personnaliser les en-têtes dans WordPress (4 façons simples)

Publié: 2022-02-07

Vous cherchez un moyen simple de personnaliser votre en-tête WordPress ?

L'en-tête WordPress se trouve en haut de chaque page de votre site Web. En tant que tel, il joue un rôle essentiel dans l'image de marque de votre site, en aidant les visiteurs à naviguer et en mettant en valeur vos pages les plus importantes.

Mais pour adapter votre en-tête aux besoins de votre entreprise, vous aurez besoin d'un moyen de le personnaliser, ce que de nombreux thèmes WordPress ne permettent pas.

Cet article vous montrera comment personnaliser les en-têtes dans WordPress à l'aide d'éditeurs visuels et de code personnalisé. L'option la plus simple consiste à utiliser SeedProd avec son générateur de thème par glisser-déposer, mais nous partagerons également plusieurs autres solutions qui fonctionnent avec n'importe quel thème.

Qu'est-ce que l'en-tête WordPress ?

L'en-tête WordPress est une partie de votre site Web qui s'affiche en haut de chaque page. Au strict minimum, votre en-tête comprendra :

  • Titre ou logo du site
  • Le menu de navigation

Par exemple, voici à quoi ressemble l'en-tête sur le site Web de SeedProd.

SeedProd website header

Comme vous pouvez le voir, il a le logo SeedProd, un menu de navigation et un bouton d'appel à l'action pour démarrer avec SeedProd.

Si votre site Web a d'autres besoins, vous pouvez ajouter des éléments supplémentaires à l'en-tête de votre site WordPress. Comme SeedProd, vous pouvez ajouter des boutons d'appel à l'action ou inclure un champ de recherche, des icônes de médias sociaux et d'autres contenus.

Vous pouvez trouver les détails de votre en-tête WordPress dans le fichier header.php de votre thème WordPress. Mais nous ne suggérons de modifier le fichier header.php que si vous êtes un utilisateur avancé et comprenez ce que vous faites.

Table des matières
  1. 1. Comment personnaliser les en-têtes dans WordPress avec SeedProd
  2. 2. Modifier les en-têtes WordPress avec le personnalisateur de thème
  3. 3. Personnalisez les en-têtes dans WordPress avec le plugin d'en-tête
  4. 4. Personnaliser le code d'en-tête WordPress (avancé)

1. Comment personnaliser les en-têtes dans WordPress avec SeedProd

Si vous voulez un contrôle complet sur votre en-tête WordPress, SeedProd est la meilleure solution. C'est le meilleur plugin de création de thème WordPress qui vous permet de créer un thème WordPress personnalisé sans écrire de code facilement.

SeedProd WordPress theme builder plugin

SeedProd est un constructeur de pages WordPress par glisser-déposer pour les entreprises, les blogueurs et les propriétaires de sites Web. Mais il est également livré avec un concepteur de thème personnalisé qui vous permet de pointer et de cliquer pour modifier n'importe quel élément.

Par exemple, la création d'un en-tête personnalisé pour votre site Web WordPress ne prend que quelques clics et vous pouvez ajouter des options d'en-tête populaires par glisser-déposer.

La meilleure chose à propos du générateur de thèmes de SeedProd est qu'il est indépendant du thème. Cela signifie qu'il ne dépend pas de votre thème WordPress existant pour le style ou la fonctionnalité, vous donnant une liberté et un contrôle complets sur la conception de votre site Web.

Cela dit, voici les étapes pour personnaliser les en-têtes dans WordPress avec SeedProd.

Étape 1. Installez le plugin SeedProd Theme Builder

La configuration du générateur de thème SeedProd est relativement simple car il fonctionne avec n'importe quel site Web WordPress utilisant n'importe quel thème.

Tout d'abord, installez et activez SeedProd sur votre site WordPress.

Commencez avec SeedProd aujourd'hui

Pour obtenir de l'aide à ce sujet, consultez ce guide étape par étape sur la façon d'installer un plugin WordPress.

Remarque : vous aurez besoin au moins du plan Pro ou Elite pour déverrouiller le créateur de thème.

Après avoir activé le plugin, rendez-vous sur la page SeedProd » Paramètres pour entrer votre clé de licence de plugin. Vous pouvez trouver ces informations sous votre compte sur le site Web de SeedProd.

Enter your SeedProd license key

Une fois que vous avez entré votre clé de licence et cliqué sur Vérifier la clé , vous êtes prêt à créer un en-tête WordPress personnalisé à l'aide du générateur de thème SeedProd.

Étape 2. Choisissez un modèle de thème de démarrage

Pour créer un en-tête de thème personnalisé avec SeedProd, vous devez d'abord créer un thème personnalisé. Ne vous inquiétez pas; créer un thème WordPress personnalisé avec SeedProd est assez simple.

Tout d'abord, rendez-vous sur la page SeedProd » Theme Builder . Vous verrez la liste des modèles pour votre thème personnalisé SeedProd actuel sur cette page.

SeedProd theme builder

Comme nous n'avons pas encore commencé, nous n'avons qu'un modèle CSS global.

Pour commencer, vous avez deux options.

  1. Utilisez l'un des thèmes SeedProd prêts à l'emploi comme point de départ
  2. Créer manuellement des modèles de thème à partir de zéro

Nous vous suggérons de commencer avec un thème existant. Cela permet à SeedProd de générer automatiquement tous les fichiers modèles. Les thèmes de SeedProd sont des thèmes complets de qualité professionnelle, qui vous donnent une longueur d'avance dans l'édition des modèles selon vos besoins.

Cliquez simplement sur le bouton Thèmes et choisissez l'un des thèmes disponibles. Il existe différents thèmes pour différents sites Web, alors choisissez celui qui correspond le mieux à vos besoins.

choose a seedprod theme template

Après avoir choisi un thème, SeedProd créera automatiquement tous les modèles de thème. À partir de là, vous pouvez modifier chaque modèle individuellement dans l'éditeur par glisser-déposer.

Seedprod theme builder template files

Étape 3. Personnalisez la section d'en-tête

Pour personnaliser votre en-tête avec SeedProd, recherchez le modèle d'en- tête et cliquez sur le lien Modifier le design .

Customize WordPress header seedprod

Cela lancera le fichier de modèle dans le générateur de thème de SeedProd. Vous verrez un aperçu en direct de votre modèle d'en-tête dans la colonne de droite avec un panneau d'édition dans la colonne de gauche.

Drag and drop header builder WordPress

Pour modifier un élément dans votre fichier de modèle d'en-tête, vous pouvez simplement pointer et cliquer pour le modifier.

how to edit header in WordPress

Selon le type d'élément, vous verrez différentes options d'édition dans la colonne de gauche. Vous pourrez modifier les polices, les couleurs, l'arrière-plan, l'espacement, etc.

Drag and drop items to your WordPress header

Pour ajouter des éléments d'en-tête personnalisés, vous pouvez ajouter des blocs SeedProd à partir de la colonne de gauche. Il est livré avec un tas de types de blocs que vous pouvez ajouter à votre modèle :

  • Balises de modèle - Blocs qui vous permettent de générer des éléments de thème à partir de votre base de données WordPress tels que des articles de blog, des commentaires, des images en vedette, etc.
  • Blocs standard – Ce sont des éléments de conception Web courants qui vous permettent d'ajouter de nouvelles images, des boutons, du texte, des séparateurs, etc. Vous pouvez même ajouter une vidéo pour plus d'engagement.
  • Blocs avancés – D'autres blocs avancés vous permettent d'ajouter des formulaires de contact, des profils sociaux, des boutons de partage, des codes abrégés WordPress, Google Maps, etc.
  • WooCommerce – Si vous gérez une boutique en ligne, vous pouvez utiliser des blocs WooCommerce dans votre thème pour afficher des produits, des paniers d'achat et même créer une page de paiement personnalisée.

Utiliser des sections pour personnaliser votre en-tête WordPress

Outre les blocs, vous pouvez également ajouter des sections complètes au modèle d'en-tête de votre thème.

Passez simplement à l'onglet Sections sous le panneau Conception.

Add sections to your WordPress header

Les sections sont des groupes de blocs pour différents domaines de la conception de votre site Web. Par exemple, vous pouvez trouver des sections prêtes à l'emploi pour votre en-tête, votre pied de page, vos appels à l'action, vos fonctionnalités, etc.

Cliquez simplement sur une section d'en-tête pour l'ajouter à votre modèle de thème et modifiez-la selon vos besoins.

Edit WordPress header section

Lorsque vous êtes satisfait de l'apparence de votre en-tête, cliquez sur le bouton Enregistrer dans le coin supérieur droit.

Répétez maintenant ce processus pour les autres modèles de votre thème afin de créer un thème WordPress entièrement personnalisé.

Étape 4. Publiez votre en-tête WordPress personnalisé

Lorsque vous êtes satisfait de votre en-tête WordPress personnalisé, la dernière étape consiste à l'activer sur votre site WordPress.

Dans SeedProd, vous pouvez appliquer votre en-tête WordPress personnalisé avec un simple commutateur.

Allez simplement sur la page SeedProd » Theme Builder et basculez le commutateur à côté de l'option « Activer le thème SeedProd » sur « Oui ».

Enable seedprod theme

SeedProd remplacera désormais votre conception existante par le nouveau thème et l'en-tête WordPress.

Vous pouvez maintenant visiter votre site Web pour voir votre en-tête WordPress personnalisé en action.

custom header example WordPress

Création de plusieurs en-têtes personnalisés avec SeedProd

Maintenant que vous avez un en-tête WordPress personnalisé, vous pouvez toujours le modifier, mais vous pouvez également créer plusieurs en-têtes pour différentes sections de votre site Web.

Par exemple, vous pouvez ajouter un nouveau modèle d'en-tête à votre thème qui ne s'affiche que sur des catégories spécifiques.

Pour ce faire, créez simplement un nouveau modèle et modifiez les conditions d'affichage en fonction de vos besoins.

add multiple custom headers in WordPress

En utilisant le générateur de thèmes par glisser-déposer de SeedProd, vous pouvez facilement créer tout type de mise en page personnalisée dont votre site Web a besoin.

Bien que l'éditeur visuel de SeedProd offre le moyen le plus simple de personnaliser votre en-tête, vous pouvez également utiliser d'autres tactiques.

Continuez à lire pour certaines des solutions les plus populaires.

2. Modifier les en-têtes WordPress avec le personnalisateur de thème

La plupart des thèmes WordPress vous donnent un certain contrôle sur l'en-tête de votre site dans le personnalisateur WordPress natif. Cela ne vous donnera peut-être pas un niveau de détail élevé, mais vous aurez quelques options pour contrôler l'apparence et le fonctionnement de votre en-tête.

Les options disponibles dépendent de votre thème, mais vous pouvez généralement les ouvrir dans le personnalisateur de thème et les modifier facilement.

Pour cela, rendez-vous dans Apparence » Personnaliser depuis votre espace d'administration WordPress. Cliquez ensuite sur l'en-tête Identité du site dans la liste de la colonne de gauche.

edit your WordPress header with theme customizer

Par exemple, dans le thème par défaut Twenty Twenty-One, l'option Site Identity vous permet de personnaliser votre :

  • Logo
  • Titre du site
  • Slogan

Vous pouvez ensuite cliquer sur l'en-tête Menus et modifier la disposition de votre menu de navigation.

edit header menu in WordPress theme customizer

Si vous avez besoin de plus d'aide avec cette méthode, vous pouvez consulter la documentation de votre thème WordPress.

Remarque : Dans l'exemple ci-dessus, nous utilisions le thème WordPress par défaut de Twenty Twenty-One. Si vous utilisez le thème Twenty Twenty-Two, le personnalisateur s'appellera "Editor". Vous pouvez le trouver en allant dans Apparence » Éditeur .

customize header with WordPress block editor

Avec le nouvel éditeur WordPress, vous pouvez personnaliser votre en-tête avec l'éditeur de blocs comme n'importe quel autre article ou page. Il n'offre pas autant de fonctionnalités de personnalisation que SeedProd, mais il vous permet d'adapter rapidement la mise en page.

3. Personnalisez les en-têtes dans WordPress avec le plugin d'en-tête

Un autre moyen simple de modifier l'en-tête dans WordPress consiste à utiliser un simple plugin d'en-tête. C'est une bonne option si vous n'êtes pas à l'aise pour éditer directement votre fichier d'en-tête de thème.

Bien qu'il existe des centaines de plugins parmi lesquels choisir, le plugin gratuit Insert Headers and Footers est l'option la plus populaire.

Après avoir activé le plugin sur votre site Web, vous pouvez le trouver sous Paramètres » Insérer des en-têtes et des pieds de page.

Insert headers and footers WordPress plugin

À partir de là, vous pouvez coller n'importe quel code que vous souhaitez ajouter ou supprimer de l'en-tête de votre site Web.

insert headers and footers

Tous les scripts que vous ajoutez dans cette zone sont automatiquement ajoutés à la balise d'en-tête de votre site WordPress. N'oubliez pas de cliquer sur le bouton Enregistrer pour enregistrer vos modifications.

4. Personnaliser le code d'en-tête WordPress (avancé)

Si vous êtes un utilisateur avancé, vous pouvez personnaliser les en-têtes dans WordPress en utilisant votre propre code personnalisé. Vous aurez besoin de connaissances pratiques en HTML, PHP et CSS pour cette méthode, elle ne convient donc pas aux utilisateurs non techniques.

Pour modifier le code de votre en-tête, allez dans Apparence » Éditeur de thème et ouvrez le fichier Style.css .

Use WordPress theme editor to customize WordPress header

À partir de là, vous pouvez faire défiler jusqu'à la section En- tête du site et ajouter ou supprimer du code pour personnaliser le style.

Vous pouvez également apporter des modifications à votre fichier header.php . Cependant, ce code traite des fonctions plutôt que du style.

La plupart des personnes qui souhaitent personnaliser leurs en-têtes sont plus intéressées par la mise à jour de l'apparence de leurs sites que par ce qui se passe dans les coulisses. Vous concentrerez donc probablement la majeure partie de votre attention sur le CSS de votre en-tête.

Personnalisez votre en-tête WordPress aujourd'hui

Nous espérons que cet article vous a aidé à apprendre à modifier les en-têtes dans WordPress.

Le moyen le plus simple d'obtenir un contrôle complet sur votre en-tête est avec SeedProd. Il offre un générateur d'en-tête visuel par glisser-déposer, vous n'avez pas besoin de modifier directement le code ou les fichiers de thème, et vous pouvez personnaliser votre en-tête directement dans le tableau de bord WordPress.

Commencez avec SeedProd aujourd'hui

Vous aimerez peut-être aussi ce guide sur la façon de modifier le pied de page dans WordPress.

Merci d'avoir lu. Veuillez nous suivre sur YouTube, Twitter et Facebook pour plus de contenu utile pour développer votre entreprise.