Header ads on mobile & center

(@pre20)

Hi,

after last theme update, the header ads don’t show on mobile devices even using the code that works before update

@media only screen and (max-width: 1200px) {
  #header-ads {
    display: inline-block !important;
  }
}

Also, the codes I used to center logo and ads don’t work

.site-title,
.site-title a,
.site-title a img { float: none; }

/* center Header Ads */
#header-ads {
  width: 100%;
}
#header-ads .textwidget img {
  margin: 0 auto;
}

Any help would be appreciated

Thanks

Viewing 10 replies - 1 through 10 (of 10 total)

MrMountain
(@mrmountain)

10 years ago
This custom css does the trick for me to keep header ads widgets on mobile view. Slightly different from yours:
```
@media only screen and (max-width: 1200px) {
  #header-ads {
    display: block !important;
  }
}
```
Thread Starter pre20
(@pre20)

10 years ago

Hi

I tried your suggestion but doesn’t word for me

MrMountain
(@mrmountain)

10 years ago

You´re right. Broken, after update from 3.1.1 to 3.1.2 – so, I guess i´ll just follow this thread

bdbrown
(@bdbrown)

10 years ago

The element name has changed from #header-ads to #header-widgets.

Deb M
(@papul)

10 years ago

Hi I checked that link and tried the codes.
What I noticed the following – in relation to ad codes

1)only 728 x 90 ad codes appear when placed alone. But they don’t obviously resize as per the device thus don’t look good.
2)then I put only the responsive ad codes – but the ads don’t appear at all.
3)then I put both the 728×90 ad code and the responsive ad code together and both ads appear but they are still not responsive.

I hope I explained the issue properly. Hoping for suggestion to sort out the issue.

Deb M
(@papul)

10 years ago

Point 2 is needed to resolve issue – The header widget doesn’t seem to support the responsive ad codes. They don’t appear at all after placing.

bdbrown
(@bdbrown)

10 years ago

@papul – You’ve already started your own topic. Please don’t double post. Thank you.

Thread Starter pre20
(@pre20)

10 years ago

Hi, I changed ads for widgets on the code but still don’t appear the ad header on mobiles, any other option? Thanks

bdbrown
(@bdbrown)

10 years ago

The header widget is hidden by default on mobile viewports to make room for the site title/logo and site description. The code @mrmountain posted, modified for the new element name, should display them. If that doesn’t work please post a link to your site so we can see the issue. Thanks.
Deb M
(@papul)

10 years ago
Hi there ,

I tried these Custom CSS codes using a Simple Custom Code Plugin. I used responsive ad codes.
Seems to be working. I hope some one from the developer team checks and verifies this.
```
#header-widgets {
    max-width: 728px;
    width: 100%;
}
@media only screen and (max-width: 728px) {
  #header-widgets {
    display: block !important;
  }
}
```
It does 2 things –
Centres the website Name
The Responsive Ads appear now in all devices.

Request – I request the developer team to verify this and also give a more easier solution to the issue.

Viewing 10 replies - 1 through 10 (of 10 total)

The topic ‘Header ads on mobile & center’ is closed to new replies.