Archived topic

Question: Is it possible to add second/third image to header?

3 replies · Started by Shane on August 3, 2015

Viewing posts 1–4 of 4

August 3, 2015 at 7:13 pm #126111

Hey Tom!
So I have recently got the Premium version of Generate Press and am developing our new site using it.
I have my image header set to the left of the header section, but I had hoped to add a second image to the right alignment of the header. Is this possible?

I didn't want to make it all one large image, because i need it to scale onto mobile devices, so ideally the image on the right would slip under the image on the left as the screen scales to a smaller size.

Sorry I cant post a link to show what I mean as I haven't made the site live yet...

Cheers :)
Shane

August 3, 2015 at 11:55 pm #126201

Hi Shane,

You can use GP Hooks for this.

First, remove your logo from the Customizer.

Then, in GP Hooks, add something like this to the "Before Header Content" hook:

<div class="grid-50">
      <img src="URL TO FIRST HEADER IMAGE" alt="YOUR SITE NAME" />
</div>
<div class="grid-50 right-side-header">
      <img src="URL TO SECOND HEADER IMAGE" alt="YOUR SITE NAME" />
</div>

Then add this CSS:

@media (min-width: 769px) {
      .right-side-header {
            text-align: right;
      }
}

Let me know if that does the trick or not :)

August 4, 2015 at 10:31 pm #126603

Hi Tom
Thanks for your help on that - got it sorted!
Cheers,
Shane

August 4, 2015 at 11:47 pm #126646

Awesome, no problem! :)

This archived topic is closed to new replies.

Start building better websites today.