Separate header title and picture?

Hey.

Lookin’ to try out your awesome Rocked theme, but it seems as though the header area (text, button and picture) are static - is there any way to change these settings on underlying pages?

Best regards,
Jesper

Hello Jesper,

I’m not sure what exactly you want to achieve, can you please provide more details?

Kind Regards, Roman.

Hey Roman. Thanks for taking the time to write. My problem is that the header image on the front page is the same on the underlying pages - I would like to have different header images for the different pages on my website.

Front page:

Underlying page (same picture):

… or at least, if I can be able to change the text on top of the picture on each underlying page, so it doesn’t say “VELKOMMEN” on every page…

Hello Jesper,

  1. Please try to use Unique Headers plugin.

  2. What exactly you want to do with header text?

Kind Regards, Roman.

Yay! Thanks a bunch for the link, Roman :slight_smile: That fixed it, so I can change header image for each individual page.

I would like to do the same with the header text, so that it says something different on every page. Right now it all just says:

VELKOMMEN
Klik på knappen og læs mere om hvad du kan finde på hjemmesiden
HVAD KAN DU FINDE PÅ SIDEN?

I would like it to, for example read “1850-1860” on the page that deals with 1850-1860 and so on and so on with the other pages. I don’t really need the button, so that is not a must.

Hope it’s understandable :slight_smile:

Hello Jesper,

Please provide a link to some page and the text that you want to use there.

Kind Regards, Roman.

the website is www.eventyrglansbilleder.dk and I would like to be able to use other text on top of the header on each individual page.

Hello Jesper,

You can try to do this with jQuery.

  1. Please install and activate Insert Headers and Footers plugin that will allow you to insert JavaScript (jQuery) code.

  2. Go to your Dashboard → Settings → Insert Headers and Footers → add the following code to Scripts in Header section, and click Save button.

<script>
    jQuery(document).ready(function(){
        jQuery('body.page-id-18 .header-info .header-title').html('Header Title');
        jQuery('body.page-id-18 .header-info .header-text').html('Header Text');
        jQuery('body.page-id-18 .header-info .roll-button').attr('href', 'http://example.com').html('Button Text');
    });
</script>

That code is for your 1850-1860 page.

This code is for both, 1850-1860 and 1870-1900 pages:

<script>
    jQuery(document).ready(function(){
        jQuery('body.page-id-18 .header-info .header-title').html('Header Title');
        jQuery('body.page-id-18 .header-info .header-text').html('Header Text');
        jQuery('body.page-id-18 .header-info .roll-button').attr('href', 'http://example.com').html('Button Text');

        jQuery('body.page-id-20 .header-info .header-title').html('Header Title');
        jQuery('body.page-id-20 .header-info .header-text').html('Header Text');
        jQuery('body.page-id-20 .header-info .roll-button').attr('href', 'http://example.com').html('Button Text');
    });
</script>

As you can see, you should change accordingly to your needs only page ID part and text/link parts. You can check this link if you want to learn more about how to find a page ID:

Kind Regards, Roman.

This works like a charm! Thank you so much for your help, Roman - you saved my bacon :wink:

Great! You are welcome Jesper!

By the way, it would be nice if you leave your feedback for Rocked theme on WordPress.org, here is a quick link :slight_smile:

Kind Regards, Roman.

Done! Thanks again :slight_smile:

Thank you very much Jesper! ?

Kind Regards, Roman.

Hey Roman :slight_smile: I hate to refresh an old thread, but I have a question that relates to this… What do I do if I would like to remove the button that is on every header page? I’ve tried removing the code, eg. called:

But that doesn’t remove the button. Any ideas?

Hello,

If this issue is still actual, try to remove Button text and Button URL in Customize > Header area > Header text section. Also you can remove button rows from the code mentioned above.

Kind Regards, Roman.