How get individual image-headers for each page, with special title-effect

[Dan-cer]

Hi,
after installing Lifestyle Pro Theme in my test-site, I modified the header as an image. See here.
My goal is to relaunch my entire website, that is made with Avada Theme, with using Genesis + Lifestyle.
As You can see when visiting my website, there are several pages with individual image-headers. Click on each menu-item, and You see what I mean.

My 1. question is: How and where can I customize the Child theme - code to get individual headers with Genesis for each page?
2. question: The used Avada "Fusion Slider" provides an effect for flowing-in of the header-title, optionally with semi-transparent background, as You can see on my website. How can I reproduce that with Genesis-code?

Thank You in advance!

kind regards
Rainer

http://www.genesis.jungvital.com

[Brad Dalton]

1. You can use a plugin like WP Display Header or custom PHP code.

---

Tutorials for StudioPress Themes.

[Dan-cer]

Thank You for Your reply, Brad!

I installed the plugin but can't see it. May be because my Child Theme has no header.php. Only function.php, frontpage.php, theme-defaults.php and page_landing.php.

In plugin-FAQ we read:

What do I need in the header.php file to make the plugin work seamlessly?
To make it work in your header.php file all you need is a header_image() call like so:
<img src="<?php header_image(); ?>" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="" />

Can I put this code into the custom css? Or where to put in?

kind regards
Rainer

[Brad Dalton]

No need. Just add an image on the Edit Page/Post screen

---

Tutorials for StudioPress Themes.

[Dan-cer]

May be it is not working here?
See screenshot

[Dan-cer]

Hi Brad,
sorry but I can't get it. To add an image into the content from a post or page doesn't provide a header as I want to have.
Maybe because the item 'header' is used in different modes there is a misunderstanding?
Look here: [img]http://up.picr.de/27835954uj.jpg[/img] at the screenshot, what kind of header-image I mean. Size is 1200x328 px.
In Lifestyle Pro Child Theme there is an option for 'header-image'. But with smaller size: 320x110 px. That isn't what I want.
In custom css I inserted this code:
.site-header {background:url("http://www.genesis.jungvital.com/wp-content/uploads/2016/12/orange-rose.jpg"); height: 328px;margin-top: -55px; no-repeat;}
And the URL of this background should be changeble. All other header-images are of the same size: 1200x328 px, as You can see on my website.

[bluebird]

Hi Rainer,

(Brad, tell me if this is the wrong approach, as I am still new to Genesis and its child themes)....

Another avenue to explore would be to add a custom body class to each page (via a custom template for each custom page) that you want to apply custom styles to like so:

add_filter( 'body_class', 'childthemeprefix_new_body_class' );
function childthemeprefix_spotify_body_class( $classes ) {
	$classes[] = 'new-page';
	return $classes;
}

Then select each header like so:

.new-page .site-header{
  //your styles here.....
}

I guess it all depends on how much customization you plan on implementing.

Cheers:-)

[Brad Dalton]

@bluebird That's one way to do it or you could use the page/post id

@Dan-cer You may need to modify the CSS under the Site Header section of the child theme's style.css file. Example

Another method is to use Backstretch with custom fields for the input of the image URL

---

Tutorials for StudioPress Themes.

[Dan-cer]

Thank You for Your answers, bluebird and Brad!
I will have a look on it in 3 days because now I'm going on a trip.

kind regards
Rainer

[Dan-cer]

@braddalton
I can't modify the CSS by editing the child theme's style.css file. I tried to exchange my inline custom css for the new header-image with editing ".site-header", but although Í saved and updated the file, nothing happened.
Also the "Design Palette Pro"-plugin can't save anything. Saving is hanging. I gave the plugin support access to admin-panel and hope to clear that.
At the moment I would prefer to get a freelancer to do the whole job.
Could You recommend one?
A worked already with a freelancer who is used to Genesis but he is on holidays...

kind regards
Rainer

[Brad Dalton]

Yes, contact me please and clarify exactly what you want [email protected]

As i understand it, you want to add different site headers for all single posts and single pages?

---

Tutorials for StudioPress Themes.

[Dan-cer]

Yes, I want.
As I wrote You a few minutes ago via email, I have hired a freelancer now to do the main jobs.
If there are any questions left, I'll come back in a few days.

[earthatoz]

You can also use the siteorigin plugin in wordpress. I used it, really helpful to design your webpage

[Dan-cer]

Thank You, I will check that.
One important question:
Is it possible to edit the "style.css" of my "LifeStyle Pro Theme" directly? I couldn't do that as I wrote above, but the "Rainmaker Digital Support" told me:

Hi Rainer,
You can edit the child theme directly. The child theme is never upgraded.
Parent theme updates should not affect styling of the child theme as the parent theme css is not imported into the child theme.

Who can give me an answer to this topic?

Thank You very much in advance!

kind regards
Rainer

[Brad Dalton]

Yes, you can edit the original CSS rule in the style.css file or copy it to the end of the same file and modify it there.

---

Tutorials for StudioPress Themes.

[Dan-cer]

Thank You for this quick reply!

And - by the way - all the best for the new year. This is to You and all others who read this!!!

[Dan-cer]

Update: Now I am fine with individual headers. With Brads suggestion to use the WP-Display-Header - plugin I could manage it, and with the tutorial from Brad.

Thank You!!!

There are 2 questions left:
1. Display of header-title individually - for each post/page a different title
2. Special header-title - effects:
2a. The title is sliding in from any direction
2b. there is a half-transparent background for the title

You can see both sliding-in and (on some of the pages/posts) on my website (that is still running with Avada theme until all topics are cleared),

Who can give me another hint, or even a tutorial, to get this work?

thank you again in advance!

[Brad Dalton]

1. for each post/page a different title

Do you want to add the title manually for each single post/page or use the post/page title as the site title?

---

Tutorials for StudioPress Themes.

[Dan-cer]

I want to add the title manually as it is different from the post/page title.

[Brad Dalton]

So you want to display both an image and title over the image in the header?

---

Tutorials for StudioPress Themes.

[Author]

Posts