Les widgets sont l'un des meilleurs moyens d'ajouter du contenu ou des fonctionnalités supplémentaires en haut de votre site WordPress. Ces blocs de contenu pratiques vous permettent de placer facilement des flux de médias sociaux, des formulaires d'inscription par e-mail ou même des articles récents dans des zones désignées de votre thème.
Mais nous avons rencontré pas mal de thèmes WordPress qui n'incluent pas de zone de widget intégrée pour l'en-tête. Certains de nos lecteurs nous ont interrogés sur la meilleure façon de gérer cela.
Dans cet article, nous vous montrerons comment ajouter facilement un widget WordPress à l'en-tête de votre site, en en faisant une partie précieuse et attrayante de votre présence en ligne.
Pourquoi ajouter un widget d'en-tête à votre site WordPress ?
L'en-tête de votre site est l'une des premières choses que vos visiteurs verront lorsqu'ils visiteront votre site Web WordPress. En ajoutant un widget WordPress à votre en-tête, vous pouvez optimiser cette zone pour aider à capter l'attention du lecteur.
La plupart des en-têtes de site Web incluent un logo personnalisé et un menu de navigation pour aider les visiteurs à naviguer sur votre site.
Vous pouvez également ajouter un widget d'en-tête au-dessus ou en dessous de cette zone pour présenter du contenu utile, des bannières publicitaires, des offres à durée limitée, des formulaires sur une seule ligne, et plus encore.
Chez WPBeginner, nous avons un appel à l'action dans l'en-tête appel à l'action juste en dessous du menu de navigation.
La plupart des thèmes WordPress ont des zones prêtes pour les widgets dans la barre latérale et les zones de pied de page du site, mais tous les thèmes n'ajoutent pas de zones prêtes pour les widgets dans l'en-tête.
Note de l'éditeur : Si votre thème n'a pas de zone d'en-tête prête pour les widgets, vous pouvez maintenant créer des thèmes WordPress entièrement personnalisés à partir de zéro (sans aucun codage).
Mais d'abord, examinons étape par étape comment ajouter un widget WordPress à l'en-tête de votre site Web dans votre thème existant. Utilisez simplement les liens rapides ci-dessous pour accéder directement à la méthode que vous souhaitez utiliser :
- Ajouter un widget WordPress à l'en-tête de votre site Web dans les paramètres du thème WordPress
- Ajouter un widget WordPress à l'en-tête de votre site Web en ajoutant du code à WordPress
Méthode 1 : Ajouter un widget WordPress à l'en-tête de votre site Web dans les paramètres du thème WordPress
Beaucoup des meilleurs thèmes WordPress incluent une zone de widget d'en-tête que vous pouvez personnaliser à votre guise.
Tout d'abord, vous voudrez voir si votre thème WordPress actuel prend en charge une zone de widget WordPress dans l'en-tête.
Vous pouvez trouver cela en allant dans le personnalisateur de thème WordPress ou la zone de widgets de votre panneau d'administration WordPress. Pour ce faire, accédez à Apparence » Personnaliser et voyez s'il existe une option pour modifier l'en-tête.
Note : Si vous utilisez un thème bloc, vous ne verrez pas cette option dans la barre latérale de votre administration. Au lieu de cela, vous devriez consulter notre guide sur comment personnaliser votre en-tête en utilisant l'éditeur complet du site WordPress.
Dans cet exemple, le thème gratuit Astra propose une option appelée « Constructeur d'en-tête ». Nous allons vous montrer comment utiliser cette fonctionnalité dans Astra, mais gardez à l'esprit que cela sera différent selon le thème que vous utilisez.
Si vous cliquez dessus, cela vous amène à un écran pour modifier votre en-tête et ajouter des widgets.
En bas de l'écran, vous pouvez personnaliser entièrement l'en-tête, ainsi que les zones situées au-dessus et en dessous de l'en-tête. Survolez simplement une des zones vides et cliquez sur l'icône « Plus ».
Cela ouvre un menu contextuel où vous pouvez sélectionner « Widget 1 ».
Il existe des options supplémentaires parmi lesquelles choisir, mais vous devrez sélectionner l'une des options « Widget » pour que l'en-tête soit prêt pour les widgets.
Pour ajouter une zone de widget à votre en-tête, cliquez sur la case « Widget 1 » qui se trouve dans la section de personnalisation de l'en-tête.
Cela ouvre l'option pour ajouter un widget.
Ensuite, cliquez sur l'icône « Plus » pour ajouter un bloc dans le menu de gauche.
Cela ouvre une fenêtre contextuelle où vous pouvez sélectionner un widget à ajouter à votre en-tête.
Vous pouvez continuer à personnaliser votre en-tête et ajouter autant de widgets que vous le souhaitez.
Une fois que vous avez terminé, assurez-vous de cliquer sur le bouton « Publier » pour enregistrer vos modifications.
Vous pouvez maintenant voir votre zone d'en-tête avec le ou les widgets que vous avez ajoutés.
Voici une capture d'écran de son apparence sur notre site de démonstration.
Vous n'utilisez pas Astra ?
Une autre façon de savoir si votre thème possède déjà un widget d'en-tête WordPress est de naviguer vers Apparence » Widgets dans votre panneau d'administration WordPress.
Ensuite, voyez s'il existe une section de widget intitulée « En-tête » ou quelque chose de similaire.
S'il y en a une, cliquez simplement sur l'icône « Plus » pour ajouter un bloc afin d'ouvrir le menu des widgets.
Ensuite, vous pouvez ajouter le widget de votre choix en cliquant dessus.
Assurez-vous de cliquer sur le bouton « Mettre à jour » pour enregistrer vos modifications apportées à la zone de widget de l'en-tête.
Méthode 2 : Ajouter un widget WordPress à l'en-tête de votre site Web en ajoutant du code à WordPress
Si votre thème WordPress n'a pas de zone de widget WordPress dans l'en-tête, vous devrez l'ajouter manuellement en ajoutant du code à WordPress.
Si vous ne l'avez jamais fait auparavant, consultez notre guide sur comment copier et coller du code dans WordPress.
Ensuite, vous pouvez ajouter le fragment de code suivant à votre fichier functions.php ou en utilisant un plugin de snippets de code tel que WPCode (recommandé) :
function wpb_widgets_init() {
register_sidebar( array(
'name' => 'Custom Header Widget Area',
'id' => 'custom-header-widget',
'before_widget' => '<div class="chw-widget">',
'after_widget' => '</div>',
'before_title' => '<h2 class="chw-title">',
'after_title' => '</h2>',
) );
}
add_action( 'widgets_init', 'wpb_widgets_init' );
Pour plus de détails, vous pouvez consulter notre guide sur comment ajouter du code personnalisé dans WordPress sans casser votre site.
Il vous guidera à travers la méthode WPCode.
Ce code enregistre une nouvelle barre latérale ou une zone prête pour les widgets pour votre thème.
Si vous allez dans Apparence » Widgets, vous verrez alors une nouvelle zone de widgets intitulée « Zone de widgets d'en-tête personnalisée ».
Maintenant, vous pouvez ajouter vos widgets à cette nouvelle zone. Pour plus de détails, consultez notre guide sur comment ajouter et utiliser des widgets dans WordPress.
Cependant, votre widget d'en-tête ne s'affichera pas encore en direct sur votre site web. Nous allons vous montrer comment faire ensuite.
Afficher votre widget d'en-tête personnalisé dans WordPress
Maintenant que vous avez créé la zone de widgets d'en-tête, vous devez indiquer à WordPress où l'afficher sur votre site web.
Pour ce faire, vous devez modifier le fichier header.php de votre thème. Ensuite, vous devez ajouter le code suivant là où vous souhaitez que le widget s'affiche :
<?php
if ( is_active_sidebar( 'custom-header-widget' ) ) : ?>
<div id="header-widget-area" class="chw-widget-area widget-area" role="complementary">
<?php dynamic_sidebar( 'custom-header-widget' ); ?>
</div>
<?php endif; ?>
Ce code ajoutera la zone de widget personnalisée que vous avez créée précédemment à la zone d'en-tête de votre site web.
Vous pouvez maintenant visiter votre blog WordPress pour voir votre zone de widget d'en-tête en direct.
Stylisez votre zone de widget d'en-tête WordPress à l'aide de CSS
Selon votre thème, vous devrez peut-être également ajouter du CSS à WordPress pour contrôler la façon dont la zone de widget d'en-tête et chaque widget qu'elle contient sont affichés. Cela peut être fait de plusieurs manières :
- Si vous utilisez un ancien thème, vous pouvez utiliser le personnaliseur de thème en visitant Apparence » Personnaliser dans votre tableau de bord WordPress.
- Si vous utilisez un thème basé sur des blocs, vous pouvez corriger le personnaliseur de thème manquant dans l'administration WordPress.
- Si vous utilisez un thème basé sur des blocs, vous pouvez ajouter du CSS supplémentaire à l'aide de l'éditeur complet du site en visitant Apparence » Éditeur dans votre tableau de bord.
- Vous pouvez ajouter du CSS personnalisé en utilisant le plugin WPCode (recommandé).
- Si vous ne connaissez pas le CSS, vous pouvez utiliser un plugin comme CSS Hero à la place.
Pour en savoir plus, consultez notre guide sur comment ajouter facilement du CSS personnalisé à votre site WordPress.
Pour cet article, nous allons examiner rapidement comment ajouter du CSS personnalisé à l'aide du plugin WPCode et du personnalisateur de thème WordPress.
Dans la méthode 2 ci-dessus, nous vous avons montré comment utiliser WPCode pour ajouter un extrait de code à votre fichier functions.php. Vous pouvez également utiliser ce plugin pour ajouter du CSS personnalisé.
Lorsque vous créez un nouvel extrait dans WPCode, assurez-vous de sélectionner le type de code « Extrait CSS » dans le menu déroulant à droite et que l'option « Insertion automatique » est sélectionnée.
Dans la section d'aperçu du code, vous devez ajouter le CSS pour styliser votre widget d'en-tête.
Voici un exemple de code CSS pour vous aider à démarrer :
div#header-widget-area {
width: 100%;
background-color: #f7f7f7;
border-bottom:1px solid #eeeeee;
text-align: center;
padding: 20px;
}
h2.chw-title {
margin-top: 0px;
text-align: left;
text-transform: uppercase;
font-size: small;
background-color: #feffce;
width: 130px;
padding: 5px;
}
Après cela, vous devez vous assurer que le paramètre « Actif » est activé, puis cliquer sur le bouton « Enregistrer l'extrait » en haut à droite de l'écran.
Pour utiliser le personnalisateur de thème à la place, vous devez naviguer vers Apparence » Personnaliser dans votre panneau d'administration WordPress. Cela ouvre le panneau du personnalisateur de thème WordPress. Vous devez cliquer sur l'onglet « CSS additionnel ».
Cela vous permet d'ajouter du CSS supplémentaire directement à votre thème et de voir les changements en temps réel.
Ajoutez simplement le code CSS que nous vous avons montré ci-dessus dans la boîte « CSS additionnel ».
Une fois que vous avez terminé d'ajouter votre CSS, assurez-vous de cliquer sur le bouton « Publier » pour enregistrer vos modifications.
Voici à quoi ressemble le widget d'en-tête personnalisé avec les modifications CSS en direct.
Nous espérons que cet article vous a aidé à apprendre comment ajouter un widget WordPress à l'en-tête de votre site Web. Vous voudrez peut-être aussi consulter notre guide sur comment ajouter du code d'en-tête et de pied de page dans WordPress et nos sélections d'experts des meilleurs outils de développement 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.
Curtis
Quelle option de widget avez-vous sélectionnée pour créer une « bannière » comme celle violette dans l'exemple (c'est-à-dire Demo Inc) ? Je veux créer une simple « bannière » (si c'est le terme correct) qui a un bouton qui renvoie vers notre site web sœur qui vend des produits.
Support WPBeginner
La bannière dans l'exemple est une image unique liée à une URL spécifique. La plupart des bannières sont actuellement une image créée à cet effet et l'image est créée avec un outil d'édition d'images.
Admin
Rob Hartman
Ce tutoriel était PARFAIT et j'ai réussi à créer le widget d'en-tête, super léger et sans impact sur la vitesse de chargement de la page. J'espérais pouvoir utiliser la même approche pour ajouter une zone de widget à mon pied de page, et remplacer toutes les références liées à l'en-tête dans le fichier Functions et footer.php – mais dans ce cas, la zone de widget n'a pas été enregistrée.
Cette approche s'applique-t-elle UNIQUEMENT à la zone d'en-tête ?
Quoi qu'il en soit, merci pour ce tutoriel très concis.
Support WPBeginner
Le code devrait fonctionner même dans un pied de page, mais votre thème peut ne pas afficher le pied de page sur toutes les pages, ce qui est une raison courante.
Admin
Sjoerd
Salut ! Merci pour le tutoriel. Et si je veux afficher la zone de widget au-dessus du menu principal au lieu de juste en dessous ?
Support WPBeginner
Vous placeriez alors le code au-dessus du menu au lieu de dessous.
Admin
Gaston
Thank you!!! I was looking for this
Support WPBeginner
Glad our guide was helpful
Admin
Ranjit
Merci pour le tutoriel, j'ai une question : comment ajouter des colonnes (2 ou 3) dans le widget d'en-tête ?
Support WPBeginner
Cela dépendrait de votre thème spécifique. Nous vous recommandons d'abord de contacter le support de votre thème spécifique pour voir s'ils ont une méthode intégrée pour ce que vous souhaitez faire ou s'ils ont des paramètres recommandés.
Admin
Muhammad Kashif
Bonjour, j'ai ajouté le widget d'en-tête personnalisé avec succès, mais après la mise à jour du thème, mon widget d'en-tête personnalisé ne fonctionne plus ? S'il vous plaît, dites-moi la solution ! J'attends votre réponse avec impatience. Merci
Support WPBeginner
Lorsque vous avez mis à jour votre thème, vous avez probablement supprimé le code de header.php. Pour éviter cela à l'avenir, vous pouvez envisager de créer un thème enfant en suivant notre guide ci-dessous :
https://www.wpbeginner.com/wp-themes/how-to-create-a-wordpress-child-theme-video/
Admin
Sophia
Merci beaucoup ! C'était exactement ce que je cherchais. Ça fonctionne parfaitement.
Support WPBeginner
You’re welcome
Admin
Inayatali
Merci beaucoup pour cet excellent article, ce code fonctionne parfaitement comme je le voulais.
Support WPBeginner
You’re welcome, glad our article was helpful
Admin
Jim Rolt
D'excellents extraits de code que j'ai pu adapter et styliser pour faire le travail que je voulais. Merci beaucoup pour cela
Support WPBeginner
Glad our guide could be helpful
Admin
Vildan
Salut WP Beginner,
Comment puis-je obtenir la zone de widget dans l'en-tête sur le côté droit du menu ? Je veux y ajouter l'icône AJOUTER AU PANIER.
Support WPBeginner
Pour le placement, cela dépendrait du thème spécifique que vous utilisez. Si vous contactez le support de votre thème, ils devraient être en mesure de vous indiquer dans quelle partie de votre fichier header.php ajouter le code ou s'ils ont une méthode intégrée pour le faire.
Admin
Bathri Vijay
Merci à l'équipe éditoriale de WPBeginner pour avoir offert un blog parfait aux débutants et aux codeurs de niveau intermédiaire. C'est une grande plateforme pour apprendre et exécuter WordPress. Vous avez été une raison majeure du succès de nombreux blogueurs et propriétaires d'entreprises.
Support WPBeginner
You’re welcome, glad you’ve been finding our content helpful
Admin
zambol
Merci pour le tutoriel. ça marche mais le problème que j'ai c'est qu'il n'est pas responsive pour les appareils mobiles. est-il possible de rendre la barre latérale responsive ?
Support WPBeginner
Je pense que vous voulez dire responsive, auquel cas nous n'avons malheureusement pas de méthode recommandée pour rendre ce widget responsive pour le moment.
Admin
Gen
Merci,
ça marche. Maintenant, je peux ajouter des widgets ou des publicités sans ajouter de plugins.
Support WPBeginner
You’re welcome
Admin
anju
comment afficher un en-tête personnalisé avant l'en-tête créé
Support WPBeginner
Selon votre thème spécifique, s'il y a du contenu avant le contenu de header.php, vous devriez contacter le support du thème.
Admin
dav
Bonjour,
Je voudrais faire un en-tête comme celui de la première image en haut de cette page (la liste 25 sites web).
Comment puis-je le faire ?
S'il vous plaît, aidez-moi !
Support WPBeginner
Cela dépendrait de ce que vous entendez par là, vous pouvez ajouter des icônes d'image à vos éléments de menu en utilisant : https://www.wpbeginner.com/plugins/how-to-add-image-icons-with-navigation-menus-in-wordpress/
Admin
dav
En fait, je parle d'ajouter des widgets d'en-tête du milieu et de droite.
Support WPBeginner
Cela dépendrait fortement de votre thème, vous pourriez envisager un plugin de constructeur de pages pour créer facilement quelque chose comme ce que vous souhaitez.
Tehreem
Eh bien, je ne peux pas accéder à mon header.php ! y a-t-il un autre moyen d'afficher mon en-tête ? comme depuis le CSS !
Support WPBeginner
Le CSS vous permettrait de styliser la zone une fois ajoutée, mais vous devriez modifier le fichier php pour ajouter le code de placement de la section, ou vous pourriez utiliser un plugin de constructeur de pages comme autre option : https://www.wpbeginner.com/beginners-guide/best-drag-and-drop-page-builders-for-wordpress/
Admin
GoosePT
Bonjour !
Tutoriel parfait.
Je l'utilise pour créer une barre supérieure, mais je rencontre un problème : les widgets (dans mon cas 2) sont l'un en dessous de l'autre.
Comment puis-je faire pour qu'ils s'affichent côte à côte ?
Lori
Super tutoriel, ça marche parfaitement. J'aimerais aussi avoir la réponse à cette question, je l'utilise pour une configuration similaire et j'aimerais afficher les widgets côte à côte.
PS – super site au passage, chaque fois que j'ai besoin d'ajouter des fonctionnalités supplémentaires ou que j'ai un problème avec quelque chose, je commence par wpbeginner.
Support WPBeginner
Malheureusement, pour une question comme celle-ci, cela nécessiterait des modifications CSS spécifiques au thème quant à la manière dont les widgets sont ajoutés. Vous auriez probablement besoin d'utiliser l'outil d'inspection pour trouver l'option CSS à modifier : https://www.wpbeginner.com/wp-tutorials/basics-of-inspect-element-with-your-wordpress-site/
Admin
J M Das
Ce tutoriel est très utile.
Comment supprimer l'espace blanc au-dessus de cette zone de widgets dans les articles ? Merci pour toute aide.
Mikhail Koval
Que devrais-je mettre dans le header.php pour qu'il s'affiche UNIQUEMENT sur la page d'accueil mais pas sur les autres pages ?
Support WPBeginner
Salut Mikhail,
Vous pouvez utiliser des balises conditionnelles comme is_home ou is_front_page pour afficher des éléments sur certaines pages dans WordPress. Par exemple :
If ( is_front_page() ) { // code you want to display on the homepage }1-click Use in WordPress
Admin
Anna
Salut, c'est vraiment ce que je cherche et ce serait génial si je pouvais le faire fonctionner ! La création de la zone de widget fonctionne bien, son affichage malheureusement pas. Je voudrais aussi l'afficher uniquement sur la page de démarrage.
Je ne suis pas sûr
1) où dans le fichier d'en-tête mettre le code d'affichage
2) où mettre ce code "uniquement sur la page de démarrage" et quel code va à la ligne 2
Je comprends si mes questions sont trop basiques pour vous déranger, mais je serais vraiment reconnaissant si quelqu'un avait le temps et la patience pour cela quand même..:-) Merci d'avance !!
Support WPBeginner
Salut Anna,
Ce sont des questions tout à fait raisonnables.
1. Vous devez placer le code d'affichage en fonction de l'endroit où vous souhaitez afficher le widget d'en-tête. Par exemple, le fichier header.php de votre thème peut avoir une section pour afficher le titre du site, le logo, la description et les menus de navigation. Ils seront probablement encapsulés dans des balises div. Vous placerez votre code de widget d'en-tête avant ou après ces zones. Si vous n'êtes pas sûr, vous pouvez placer le code à la fin du fichier header.php.
2. Si vous souhaitez afficher la zone de widget uniquement sur la page d'accueil de votre site Web, vous pouvez utiliser des balises conditionnelles comme celles-ci :
if ( is_front_page() ) { // your widget display code goes here }1-click Use in WordPress
Anna
OK, j'ai triché et mis le code du widget dans front-page.php à la place, ça a marché ! Merci :-) !
Anna
Salut encore, il est devenu visible sur la page de démarrage avec le positionnement CSS !
Il ne reste plus qu'à savoir comment assembler le code « uniquement sur la page de démarrage » avec le code de visibilité…
Merci encore pour votre gentillesse et votre patience..)
Bruce Pratt
Excellent tutoriel ! Cela m'a aidé à accomplir exactement ce que je voulais. Fantastique !
Paul Johnson
Excellent tutoriel, merci. J'essaie d'implémenter le widget JetPack Cookie Consent et malgré vos instructions, la barre de consentement aux cookies apparaît toujours en bas de la page.
Est-il possible que le widget remplace le code ?
Keu
Cela fonctionne-t-il toujours pour Twentyseventeen ? La partie functions.php fonctionne bien, mais la partie header.php ne fonctionne pas.
thomas evans
Bonjour
S'il vous plaît, quelqu'un peut-il m'aider à rendre cela réactif sur n'importe quel appareil mobile ?
Je veux insérer un code Google AdSense ici pour des publicités de taille bannière 728 x 90, mais à chaque fois que je le fais, cela s'affiche parfaitement sur les ordinateurs de bureau, mais sur les appareils mobiles, cela devient bizarre.
Merci
Anubhav Bhatt
J'ai créé avec succès un widget d'en-tête et c'était vraiment facile, grâce à vous tous. Mais je le voulais en fait dans les ARTICLES, pas sur la page d'accueil car j'utilise le thème Nikko Portfolio et cela a l'air horrible.
S'il vous plaît, aidez-moi.
Soren
Wow, j'ai réussi à faire ça... ?! Merci beaucoup pour ce guide génial !
Jeffrey
J'ai placé le code dans mon fichier functions.php et ajouté mon code de widget dans le fichier header.php et ajouté mon texte de widget et enregistré.
Lorsque je passe à la modification des pages, en cliquant sur Mettre à jour, j'obtiens un écran blanc et je ne peux pas voir ma page.
Je dois ensuite revenir à /wp-admin pour voir le tableau de bord. Il n'y a pas d'erreurs de console lorsque je clique sur mettre à jour, juste un écran blanc.
Jeffrey
Après le dépannage, j'ai une syntaxe incorrecte dans le fichier functions.php.
Merci !
Derek
C'est génial pour cette publicité d'en-tête, mais ce que je veux faire, c'est ajouter un bouton de don PayPal à mon en-tête. (Côté droit) Je n'arrive pas à croire qu'il n'y ait pas de tutoriels vidéo sur la façon de créer un espace d'en-tête personnalisable pour y glisser votre widget PayPal afin qu'il apparaisse sur le côté droit de votre en-tête. J'imagine que beaucoup de gens pourraient bénéficier d'une instruction à ce sujet.
Stephen Crawford
C'est un excellent tutoriel, mais j'aimerais créer une zone de widgets qui pourrait être placée au-dessus de la zone d'en-tête, serait-ce également possible ?
Joey
Je viens de tout mettre à jour et ça fonctionne très bien sur mon ordinateur de bureau. Maintenant, si vous pouviez me dire comment faire pour que le widget s'affiche sur mon appareil mobile, ce serait formidable ! Ai-je fait une erreur en cours de route ?
Kushal
Merci beaucoup pour cette publication ! J'ai résolu ce que je cherchais !
Mark
Bonjour, merci beaucoup pour cet article, il m'a énormément aidé. Cependant, avec mon site web : comment faire pour que le widget apparaisse tout à droite. Lorsque j'utilise l'option pour afficher le champ de recherche dans l'en-tête, c'est là que je veux qu'il aille ?
Thanks in advance!
Linda Holiner
Je suis confus. Je ne comprends pas comment insérer une image dans le widget et laisser l'utilisateur changer l'image. Je ne vois pas d'où vient votre image.
Thomas
Serait-il possible de faire un tutoriel sur la façon de créer une barre supérieure avec des sections (icônes de médias sociaux, avis, recherche, panier Woocommerce).
Aucun plugin ne fait vraiment cela bien
Merci
Liam
Comment faire pour que le widget ne s'affiche que sur les appareils de bureau ?
Tim
Si je veux ajouter plusieurs zones de widgets personnalisées, dois-je ajouter une nouvelle fonction à functions.php pour chacune ? ou simplement les ajouter dans la zone que je veux ?
fahad
J'ai réussi à utiliser le widget dans la barre de navigation au lieu de la zone d'en-tête, car je voulais ajouter une option de basculement de langue à cette section. J'ai un petit problème où je ne peux pas déplacer les deux drapeaux de langue à n'importe quel endroit horizontal. J'ai essayé d'ajouter margin-right: 100px; à la section CSS avancée mais cela n'a pas changé. Il se peut que quelque chose d'autre centre tout le contenu de la navigation, mais je veux m'assurer si cela peut être résolu avec le widget.
Courtney
Salut, comment avez-vous modifié le code pour le mettre dans la barre de navigation ? J'essaie actuellement de faire la même chose sans succès.
Leanore
Lorsque j'essaie d'ajouter plus d'une zone de widget personnalisée, je reçois une erreur 500 sur mon site web. Y a-t-il une raison à cela ? Est-il possible de créer plus d'une zone de widget personnalisée pour un thème ?
Support WPBeginner
Salut Leanore,
Oui, vous pouvez créer plusieurs zones de widgets personnalisées pour votre thème.
Admin
Antonis
Bonjour,
Est-il possible de décrire brièvement comment en créer plusieurs ? J'ai essayé de copier la fonction et de renommer les éléments mais ça ne fonctionne pas..
P.S. Code très pratique, merci !!
nina
Salut ! Lorsque j'essaie de mettre à jour le fichier function.php, j'obtiens cette erreur fatale :
Erreur fatale : Impossible de redéclarer wpb_widgets_init()
Je ne suis pas sûr d'avoir fait une mauvaise modification. Pourriez-vous m'aider
Support WPBeginner
Salut Nina,
Cela signifie que la fonction wpb_widgets_init existe déjà dans votre fichier functions.php. Vous devrez la remplacer par quelque chose comme wpb2_widgets_init pour la rendre unique ou supprimer le code précédent que vous avez ajouté.
Admin
Sam
Bonjour,
Merci beaucoup pour cela, c'est vraiment utile.
Un problème que je rencontre : mon widget est juste un menu de quelques liens textuels vers des pages. Voici mon site :
Voyez comment le texte est tout à droite de la zone d'en-tête ? Je voudrais utiliser une marge droite pour le placer sous « Contact » sans rendre la zone de marge blanche.
Also, would love to make the text black.
Merci beaucoup si vous pouvez aider avec ces ajustements !
Sam
Tommy
Votre blog est très utile. Merci de nous aider à apporter des modifications à Twenty Seventeen. Des personnes comme vous rendent l'utilisation d'un nouveau thème WordPress comme Twenty-seventeen beaucoup plus facile.
Je suis relativement nouveau sur WordPress et j'aimerais essayer quelques modifications supplémentaires pour Twenty Seventeen.
Je voudrais créer un nouveau widget pour les pages wp. J'essaie de comprendre comment je peux utiliser les informations de votre blog sur la façon de créer un nouveau widget pour l'en-tête et l'appliquer à une page wp dans le thème twenty seventeen. Je suis bloqué.
Pourriez-vous nous montrer comment créer un nouveau widget pour une page ? Ce serait génial.
Merci
Tommy
Support WPBeginner
Salut Tommy,
Veuillez consulter comment créer un widget WordPress personnalisé.
Admin
Tom
dans le thème Twenty Twelve, il l'a mis sous mon menu et non dans la zone d'en-tête.
liz
pareil pour moi – as-tu trouvé une solution Tom ?
Bobby_qw
Merci beaucoup Monsieur l'Administrateur. Vous nous apprenez 'comment créer notre propre site web. Je suis toujours vos publications et je crée mon propre site web. Merci beaucoup.
Shane Cunningham
Je l'ai utilisé et bien qu'il ait fonctionné pour ajouter une zone de widget personnalisée en haut de ma page, je n'ai pas réussi à l'aligner avec les autres éléments de l'en-tête (logo de l'entreprise et menu de navigation) dans Cherry. Peu importe où je l'ai placé dans header.php, il apparaissait soit au-dessus, soit en dessous des autres éléments. Je voulais l'utiliser pour créer un bloc de numéro de téléphone entre le logo et le menu de navigation. Bien que j'aie réussi à le centrer horizontalement à l'endroit correct, je n'ai pas réussi à le faire apparaître entre eux. Pour vous donner une meilleure idée de ce dont j'ai besoin, imaginez que sur l'en-tête de cette page même, vous vouliez déplacer le menu de navigation justifié à droite et placer votre numéro 800 entre lui et le logo « wpbeginner ». Comment pourrais-je utiliser ce code (ou une de ses variations) pour faire cela ?
Kristin
Merci beaucoup pour ce (et tous vos) tutoriels détaillés ! Pourriez-vous s'il vous plaît me dire comment implémenter un widget d'en-tête, à l'exception de la page d'accueil ?
Massimo
Dans le code que vous avez ajouté à header.php, remplacez la première ligne :
if ( is_active_sidebar( 'custom-header-widget' ) ) : ? >par celle-ci :
if ( is_active_sidebar( 'custom-header-widget' ) && ! is_front_page ) : ?Massimo
Désolé, j'ai oublié quelque chose !
La ligne que vous devez ajouter est :
if ( is_active_sidebar( 'custom-header-widget' ) && ! is_front_page() ) : ?>Kristin
Merci beaucoup !
reus
thank men, more power
Nirmal Kumar
Merci pour ce tutoriel ☺ J'ai utilisé ce code pour créer un en-tête pour mon site web.
Support WPBeginner
You are welcome
Admin
Mihaita Vulpe
Wow, et je pensais que j'étais limité à l'ajout de widgets uniquement dans la barre latérale, merci pour les astuces.
Mihaita,
Yukio
Wow, cela semble vraiment intéressant et très utile ; je vais l'essayer et j'espère que ça marche.