La page d’accueil utilise un élément d’en-tête très spécifique. Il profite de presque toutes les fonctionnalités de l’élément d’en-tête. Cela inclut l’arrière-plan de l’image en vedette, la fusion avec l’en-tête du site et l’emplacement et les couleurs de navigation personnalisés. Pour en savoir plus sur l’élément d’en-tête, cliquez ici :
L’élément d’en-tête du site fusionné
Pour éditer l’en-tête allez à : Apparence > Elements -> Home Page Hero - Merged. A noter que cet en-tête a été conçu spécifiquement autour de l’image. Nous couvrons maintenant les différents paramètres et leur but. Cela devrait vous fournir suffisamment de compréhension sur la façon de manipuler l’en-tête pour votre propre contenu.
Paramètres de l’onglet Page Hero
- Hero Content > Balisage HTML de base composé d’un sous-titre de balise span, d’une balise H1 pour l’en-tête principal et d’une balise d’ancrage utilisant la classe GP Button.
- Classes d’éléments > None
- Conteneur > Set to contained
- Padding Desktop > Notable le 30% RHS padding est la création d’une zone de sécurité pour empêcher le contenu de la page héros de chevaucher le RHS de l’image.
- Padding Mobile > Mettre un padding séparé pour permettre au texte de s’étendre sur l’élément d’en-tête.
- Background Image > Utilise l’image en vedette et la met au centre. The featured images is disabled in the page content.
- Colors > pas de couleur d’arrière-plan ou de superposition. Les couleurs du texte ont été ajustées pour l’en-tête. Toutes les couleurs sont laissées par défaut dans les paramètres de personnalisation.
Paramètres de l’onglet En-tête du site
- Fusionner avec le contenu > Fusionner
- Décaler la hauteur de l’en-tête du site > à 169px sur ordinateur et 50px sur mobile. Ces valeurs sont la hauteur brute de l’en-tête du site et de l’en-tête mobile. Cela empêche notre contenu de se déplacer sous la navigation et l’en-tête du site.
- Couleurs > L’arrière-plan est défini sur un blanc transparent et le titre du site et la ligne de balises restent par défaut et respectent les couleurs définies dans le Customizer.
- Navigation Location > Défaut
- Couleurs de navigation > Vérifié et l’arrière-plan est défini sur transparent.
Règles d’affichage
Cet en-tête est défini pour s’afficher sur la page d’accueil. Il s’agit du terme par défaut pour la page qui a été attribuée dans Dashboard > Settings > Reading -> Your Home Page Displays.
Foire aux questions
Comment changer l’image d’arrière-plan ?
L’élément d’en-tête utilise l’arrière-plan de l’image en vedette. Il suffit de changer l’image en vedette dans l’éditeur de message sur la page d’accueil.
Comment modifier l’en-tête et le sous-en-tête ?
Éditez les éléments d’en-tête du contenu héroïque. Les styles et tailles de police sont définis dans les paramètres du Customizer > Typograpghy
Comment ajuster le contenu du texte ?
L’en-tête et le sous-en-tête actuels sont contenus, de sorte qu’ils ne chevauchent pas la partie plus sombre de l’image sur le côté droit de la main. Pour ce faire, ajoutez un padding supplémentaire sur le côté droit de l’élément d’en-tête. Supprimez ou modifiez le remplissage en fonction de vos besoins.
Comment changer les couleurs de navigation ?
Dans l’onglet En-tête du site, vous disposez de contrôles de couleur pour l’en-tête et la navigation. Celles-ci remplacent les couleurs définies dans le customizer. Note : les couleurs dans le customizer s’appliqueront toujours à la navigation collante.
Comment utiliser cet élément d’en-tête sur d’autres pages ?
Si vous voulez une copie exacte de cet en-tête, vous pouvez simplement ajouter plus de pages, de posts ou de modèles aux règles d’affichage. Mais comme la page d’accueil mériterait des en-têtes très spécifiques, vous voudrez probablement en faire une copie et modifier le contenu en fonction de vos besoins. Bien sûr, vous pouvez le faire manuellement ou utiliser le plugin Duplicate Post - assurez-vous juste de modifier les paramètres du plugin et d’inclure des éléments.