[Resolved] Adding a 728×90 banner to the header ?

[David]

Hello,

I’m stumped on trying to add a 728×90 banner (ad code) – in the top header, can anyone assist please?

See screen shot: https://cl.ly/1044a266545d

I only need this to display on Desktop…

Thank you!

Dave

[David]

Hi there,

you can add the code using a HTML Widget in the Customizer > Widgets > Header.
By default the header widget only takes up 50% of the inside header so it needs a little CSS to open that up:

.header-widget {
    max-width: 100%;
    margin-top: 1em;
}

You may need to reduce the max-width depending on how much space you have inside the header.

[David]

Cool, almost! I tried to reduce the 100 and also tried 150 … but nothing…

Part of the banner is cut off, any tips?

See screen shot: https://cl.ly/53705f96e302

By far the best support I’ve had for a theme over the years… high five!

P.S – For future sites I build, would using Elementor Pro make this easy ?

thanks,
Dave

[David]

Where did you add the CSS? Can you add it back in so i can see what the issue is.
You will need to increase the Container Width or reduce your logo size as the banner is going to be too wide for the header otherwise.

Glad you’re enjoying the service.

Elementor can make it easier if you want to avoid code but for blogs and the type of Site you’re building i would probably not bother 🙂

[David]

Hi,

I added your CSS to: Widgets / Header – The made a custom HTML and here is what is inside that:

.header-widget {
max-width: 100%;
}

<iframe src=”//rcm-na.amazon-adsystem.com/e/cm?o=1&p=48&l=ur1&category=mostwishforitem&banner=08P8C0W2PBMTSKB5RT82&f=ifr&linkID=26ed31dbf9b371a015e9075ed5203380&t=clumsycrooks-20&tracking_id=clumsycrooks-20″ width=”728″ height=”90″ scrolling=”no” border=”0″ marginwidth=”0″ style=”border:none;” frameborder=”0″></iframe>

Screen shot… https://cl.ly/d39617a547b4

Looks like plenty of room for the 728, if I can just push it over to the left like 2 1/2″ more inches.

(If I make the container width 1485 px) then the banner fits, but makes the site way too large

thanks,
Dave

[David]

The CSS i provided needs to go in Customizer > Additional CSS.

[David]

Boom, that worked!

See screen shot: https://cl.ly/de713a482651

Any chance we can nudge it down to the center of that header section? That will then wrap up this thread!

thanks,
Dave

[David]

CSS edited here:
https://generatepress.com/forums/topic/adding-a-728×90-banner-to-the-header/#post-880976

this will push the banner down.

[David]

Awesome, that worked!

[David]

You’re welcome

[Author]

Posts