Archived topic
Post image in header
9 replies · Started by Brigitte on August 31, 2022
hello Generate Press team,
I would like to have a different image in the header on each page. But the featured image is displayed in the content. Unfortunately, I couldn't do it with CSS.
https://webdesign-brigitte-riedel.de/impressum/
.page-id-184 .header-image{
background-image: url(https://webdesign-brigitte-riedel.de/wp-content/uploads/2022/08/Impressum.jpg);
}
Thank you for your help.
Regards, Brigitte
Hi there,
just so i answer correctly. are you wanting to show the Featured Image in the Site Header ( ie. above the Navigation ) ?
Let me know
Hallo David,
schön, dass ich auch in deutsch schreiben kann :-)
Ja, ein verschiedenes Beitragsbild möchte ich auf den verschiedenen Seiten im Header angezeigt bekommen. Z.B. Seite Impressum - das Bild mit der Schrift IMPRESSUM soll oben im Header über der Navigation angezeigt werden. Ich vermute, dass dies mit CSS gelöst werden kann. Ich möchte auf jeder Seite ein Anderes Bild verwenden. Alle Seiten sind noch im Aufbau.
Die CSS Anweisung funktioniert leider nicht
.page-id-184 .header-image{
background-image: url(https://webdesign-brigitte-riedel.de/wp-content/uploads/2022/08/Impressum.jpg);
Danke für deine Hilfe.
Grüße
Brigitte
Are you using GenerateBlocks ?
Für den Content verwende ich Blöcke.
Als Theme GP Premium
The image above the navigation is actually the logo image, so do you want to use different logos for different pages?
If so, I don't think that's a good idea.
I would recommend installing the GenerateBlocks plugin, and use a block element - page hero: https://docs.generatepress.com/article/block-element-page-hero/
Then you can enable the dynamic background option for the containerblock, and make it use the featured image as the background image.
You can add different featured images for different pages in the page editor.
Viele Dank, Ying
werde ich morgen gleich ausprobieren und hoffe, dass ich zurecht kommen.
Grüße
Brigitte
I hope so :)
Let us know if you need further assistance.
problem gelöst, war ganz einfach mit php
add_filter( 'generate_logo','tu_custom_about_logo' );
function tu_custom_about_logo( $logo )
{
if ( is_page( 'kontakt' ) )
return 'https://webdesign-brigitte-riedel.de/wp-content/uploads/2022/09/Kontakt_1024.jpg';
if ( is_page( 'impressum' ) )
return 'https://webdesign-brigitte-riedel.de/wp-content/uploads/2022/09/Impressum_1024.jpg';
return $logo;
}
This will work, I just don't think using those images as logos is a good idea, it might confuse the search engine.
But anyway, as long as you are ok with it :)