Changed Size of Right Header Widget and Now It's No Longer Responsive on Mobile

[sawsonskates]

I used this tutorial to change the logo size and the size of the right header widget in my Metro Pro theme and it worked great! I used the right side to post a responsive Google Adsense code. The ad looks great on the desktop, but doesn't render properly on tablets or mobile. The ad goes off the screen on tablet/mobile - almost like the widget area is too large for these devices.

The author of the tutorial suggested I "wrap (the right header widget) in a media query" so it changes at a specific screen width. This is waaay over my head and he suggested I post here for help. Can anyone help me with this please? I'd really appreciate it! Here's the link to my site. Thank you in advance - Scott

http://sawsonskates.com/

[Victor Font]

The first thing I'd like to offer is this brief explanation about how the Genesis header areas work. Ignore the part about centering the logo. https://victorfont.com/understanding-genesis-framework-site-header-layout/

Second, you may not be able to do anything about the ad except find a different location. The ad sizes are hard coded inline by the adsense code. When you set up the add in the first place, you should have selected responsive as the ad type instead of using a fixed grid size. I suggest you go back to your adsense account and generate the code for responsive ads.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[sawsonskates]

Thank you Victor - I appreciate your help. I was hoping I just picked up an old ad code, but the code in my header widget is for a responsive ad.

What's strange is I have a responsive ad code in the sidebar and that ad is responsive on desktop, tablet and mobile. It's just the header ad that isn't responsive.

Do you have any other thoughts or suggestions? Thank you - Scott

[Author]

Posts