- WordPress :5.8
- Statut : résolu
- Ce sujet contient 24 réponses, 4 participants et a été mis à jour pour la dernière fois par
MMartine, le il y a 1 année et 8 mois.
-
AuteurMessages
-
6 janvier 2022 à 18 h 53 min #2392505
Bonjour,
Ma configuration WP actuelle
- Version de PHP/MySQL : je ne sais pas
- Thème utilisé : Fooding
- Extensions en place : unserconstruction
- Nom de l’hébergeur : privé
- Adresse du site : pas encore en ligne
Problème(s) rencontré(s) :
Bonjour,
j’utilise le thème fooding qui correspond bien à la mise en page que je veux pour un site de recettes de cuisine : une grande image en haut, avec le titre de la recette et les explications en-dessous.
Pour l’instant, l’image du header se retrouve à l’identique sur toutes les nouvelles pages. Moi je voudrais pouvoir changer cette image à chaque nouvelle page, pour qu’elle illustre la recette de la page.
Voilà ce que j’ai fait :
– J’ai créé un nouveau modèle de page que je nomme page de recette.
– Partant du principe que ma page pouvait commencer directement par une bannière en haut de page, j’ai supprimé le <?php get_header() ; ?> et là, toute la structure s’est effondrée, je m’y attendais 🙂
Donc je pense qu’il faut que je duplique header.php, que je le renomme en header2.php, et que ma page de recette contienne <?php get_header2() ; ?>.
Mais je ne sais pas du tout ce qu’il faudrait que je modifie ou rajoute pour que ce header2 aille chercher une image de ma médiathèque.
Alors je viens demander votre aide !
Merci d’avance, bien cordialement.
6 janvier 2022 à 19 h 13 min #2392507Bonjour.
Tes recettes sont des articles ou des pages ?
Sinon tu peux mettre une image en avant pour chaque page/article.
🙂
6 janvier 2022 à 19 h 18 min #2392510Bonsoir, je partais plutôt pour des pages avec photo en haut, explications en milieu-bas et sur le côté, un diaporama vertical qui défile avec d’autres recettes du même genre.
J’ai tenté un article, mais c’est pareil
J’ai essayé de mettre une image en avant, mais elle apparait dans le bloc sous la fameuse image de header, qui me colle à la peau !
Merci de cette réponse rapide, ça me redonne espoir 🙂
6 janvier 2022 à 19 h 44 min #2392511Bonjour,
Vous êtes sur la bonne voie, mais pour appeler le header 2, ce sera <?php get_header(2) ; ?>
Si vous l’appelez header-recette.php, ce sera <?php get_header(recette) ; ?>Ensuite, il faudra trouver à quel endroit ajouter ce genre de code :
// Check if page is displayed and featured header image is used
if( is_page() && has_post_thumbnail() ) :
?>
<div id="custom-header">
<?php the_post_thumbnail('frontpage_image'); ?>
</div>
<?php
// Check if there is a custom header image
elseif( get_header_image() ) :
?>
<div id="custom-header">
<img src="<?php echo get_header_image(); ?>" />
</div>
<?php
endif;
Je n’ai pas retesté, mais cette fonction était utilisée sur mon ancien thème.
A la ligne
<?php the_post_thumbnail('frontpage_image'); ?>
, il faudra remplacer ‘frontpage_image’ par le nom de taille d’image utilisée pour votre header. (et si elle n’existe pas, il faut la définir dans le fichier functions de votre thème-enfant)Bon, c’est un premier jet, à vous d’adapter.
6 janvier 2022 à 19 h 53 min #2392512Bonsoir,
je crois comprendre le principe, je vais creuser ça demain.
Merci beaucoup.
Bonne soirée à vous, cordialement.
7 janvier 2022 à 19 h 37 min #2392614Bonsoir,
je suis en échec 🙂
Voilà ce que j’ai fait :
- dans le fichier functions.php, il y a bien :
add_theme_support( ‘post-thumbnails’ );
add_image_size( ‘fooding-default’, 338, 210, true ); et 2 autres lignes du genre;
- dans le fichier WP-includes/theme.php, je crois avoir trouvé la fonction header-image où je pense qu’il faut écrire les lignes que vous m’avez données. Mais est-ce bien là qu’il faut les placer?
- je joins une copie d’écran, il est clair que j’ai des fautes (j’ai 2 messages de syntaxe error, unexpected'<‘ ), mais je ne vois pas ces erreurs. Pourtant toute la suite du fichier est passée en blanc.. mauvais signe !
Serait-ce les lignes en php ? c’est vrai qu’il n’y en a aucune dans ce fichier.
Merci si vous pouvez m’éclairer.
Bonne soirée, cordialement.
Fichiers joints :
Vous devez être connecté pour voir les fichiers joints.7 janvier 2022 à 20 h 18 min #2392619J’annule mon message précédent, je crois que je viens de comprendre un truc important ! Désolée d’avoir encombré cette page.
7 janvier 2022 à 22 h 53 min #2392622Bonjour,
Vous avez trouvé vos erreurs?
- l 1363 enlever <?php
- l 1366 remplacer le > bleu par ?>
7 janvier 2022 à 23 h 52 min #2392627dans le fichier functions.php, il y a bien :
add_theme_support( ‘post-thumbnails’ );
add_image_size( ‘fooding-default’, 338, 210, true ); et 2 autres lignes du genre;Ça, c’est OK. Juste pour savoir : c’est dans le functions.php du thème-parent ou du hème-enfant ? (mais a priori, ça ne change rien, il faut que la taille d’image soit définie dans l’un des deux)
dans le fichier WP-includes/theme.php, je crois avoir trouvé la fonction header-image où je pense qu’il faut écrire les lignes que vous m’avez données. Mais est-ce bien là qu’il faut les placer?
Non, pas du tout. La fonction est à placer dans le fichier header.php du thème-enfant ou dans header-recette.php
je joins une copie d’écran, il est clair que j’ai des fautes (j’ai 2 messages de syntaxe error, unexpected'<‘ ), mais je ne vois pas ces erreurs. Pourtant toute la suite du fichier est passée en blanc.. mauvais signe !
Les indications de @ferman sont fiables. 🙂
En fait, au vu de votre post initial, si cette fonction est utilisée uniquement sur le modèle page-recette, elle peut être totalement simplifiée en enlevant déjà toute la partie elseif (lignes 1369 à 1372 incluses)
Par ailleurs, j’avais oublié de préciser hier que l’id « custom-header » est à adapter selon votre CSS, ça peut être autre chose. Ou alors il faudra définir ce #custom-header dans le CSS du thème-enfant
10 janvier 2022 à 18 h 45 min #2392833Bonsoir,
Et je rame, je rame …
ce que j’ai fait : dans le header-recette.php, j’ai intégré les lignes que vous m’aviez données, en tâtonnant pour trouver dans quelle div déjà existante les placer. Ensuite je n’arrive pas à paramétrer la div (id custom header par ex), pour qu’elle s’intègre bien dans le header existant, quelle que soit la taille de l’écran. Mon image perso se superpose bien à celle par défaut, mais dès que je rétrécis l’écran, c’est fichu. J’ai beau jouer du min-height, du @media etc, Il y a beaucoup de paramètres et de classes css concernant ce header, je ne maîtrise pas du tout, je jette l’éponge.
Je me suis donc dit que le mieux serait tout-de-même que l’image chargée par la fonction header_image soit la « thumbnail » si la page en a une, et l’image par défaut sinon. Au moins je garderais toutes les fonctions responsives et de mise en page, inhérentes au thème.
Je vous joins ce que j’ai tapé dans WP-includes/theme.php. J’ai l’impression que je ne suis pas loin car :
le if et le else sont bien compris : ma page sans vignette affiche bien l’image par défaut, mes pages avec vignette n’affichent pas cette image, mais n’en affichent, hélas, aucune autre ! 🙂 le ‘fooding-recette’ n’est pas à mettre en cause. Je pense que la commande get_the_post_thumbnail n’est pas bonne, mais je n’en trouve pas d’autre et elle ressemble pourtant bien au get_header_image d’origine…, mes 2 lignes $image = ont belle allure !
Donc je lance à nouveau un sos. Merci d’avance si vous pouvez m’aider.
Cordialement.
Fichiers joints :
Vous devez être connecté pour voir les fichiers joints.10 janvier 2022 à 19 h 51 min #2392838Je ne vais pas savoir vous aider plus, je ne suis pas codeuse ni développeuse, simple bidouilleuse.
Par contre, je me répète : il ne faut pas modifier wp-includes/theme.php ! Il faut uniquement modifier le fichier header.php (du thème-parent, à copier dans le thème-enfant) ou votre fichier header-recette.php (pas header2).
10 janvier 2022 à 19 h 58 min #2392840ah mince alors !
Je pense que je vais devoir changer de thème parce que je ne m’en sors pas. Dommage, celui-là me plaisait bien.
Merci beaucoup en attendant !
Bonne soirée, cordialement.
11 janvier 2022 à 0 h 08 min #2392871Bonjour,
Il y a peut-être une solution avec ce thème mais il faudrait créer un thème enfant, ce qui est facile avec child-theme configurator. Si vous voulez essayer ?(ce n’est pas garanti à 100% mais ça ne cassera rien). Testé sur mon site: ça fonctionne.
12 janvier 2022 à 9 h 12 min #2392943Bonjour,
je ne connaissais pas cet outil, j’ai découvert plein de choses !
Merci, bonne journée.
Cordialement
12 janvier 2022 à 14 h 29 min #2392957Bonjour,
je ne connaissais pas cet outil, j’ai découvert plein de choses !
Comme ça vous pouvez faire tout ce que vous voulez sans que le thème parent soit affecté.
Essayez cette procédure qui devrait permettre de changer l’image du header à chaque page:
- Copiez le fichier header.php dans votre thème enfant au même niveau que functions.php et style.css (vous gardez le même nom) . Voir pj
- Modifiez la ligne 43 (ou ligne voisine) comme indiqué ci-dessous.
// ligne 43 Code existant:
<header id="masthead" class="site-header" role="banner" data-parallax="scroll" data-image-src="<?php header_image(); ?>">
// ligne modifiee dans le theme enfant:
<header id="masthead" class="site-header">ligne modifiee dans header.php - Copiez collez le code suivant dans functions.php du thème enfant à la suite de //END ENQUEUE PARENT ACTION en modifiant bien sûr pour que ça corresponde à votre cas.
function image_header(){
if (is_page ("page-test2")) $image = "/nom_du_site/wp-content/uploads/2021/03/image_2.jpg";
elseif (is_page ("page-test1")) $image = "/nom_du_site/wp-content/uploads/2021/03/image_1.jpg";
/*répéter la ligne ci-dessus pour chaque page en changeant le nom de la page et l'adresse de l'image. Par exemple:
elseif (is_page ("page-test3")) $image = "/nom_du_site/wp-content/uploads/2021/03/image_3.jpg";
etc.
Pour la ligne ci-dessous, sélectionnez une image de votre choix qui sera affichée par défaut sur les pages où aucune autre image n'est en place; ça évite d'avoir un fond gris.
*/
else $image = "/nom_du_site/wp-content/uploads/2021/03/image_default.jpg";
?>
<header id="masthead" class="site-header" role="banner" data-parallax="scroll" data-image-src = <?php echo $image; ?>>
<?php
}
add_filter('wp_head','image_header');
Si vous avez à souvent ajouter des pages ou changer les images, il serait sans doute préférable d’utiliser l’extension » my custom functions« . Ç’est pareil que functions.php mais vous y avez accès depuis votre tableau de bord.
Pour les images, il est mieux de les recadrer pour qu’elles aient les mêmes dimensions que l’image fournie par défaut avec le thème (1500px x 600px)
-
Cette réponse a été modifiée le il y a 1 année et 8 mois par
ferman.
-
Cette réponse a été modifiée le il y a 1 année et 8 mois par
ferman.
Fichiers joints :
Vous devez être connecté pour voir les fichiers joints. -
AuteurMessages
- Vous devez être connecté pour répondre à ce sujet.