Header Ads on Mobile Issues

Hi Umo2net. The header ad sidebar is hidden in the mobile views to make enough room for the site logo/title/description. It’s controlled by this code in the theme responsive.css file:

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

You could edit the max-width argument in the theme file itself, knowing that the next time you update the theme you’ll have to adjust it again. Or you could copy responsive.css to a child theme, then copy the theme function that enqueues the css file to a child theme functions.php file, then change that function to load the responsive.css file from your child theme instead of the parent theme.

So what should I edit the max-width to?

Thank you

Try this approach:
1. Add this to your child theme or custom css:

/* keep header ads always visible */
#header-ads {
  display:block !important
}

2. Open your site and manually adjust the browser width to see how the ads are styled at different widths.

3. Find the width at which you want to hide the ads.

4. Add this to your custom css below the above code:

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

Adjust the 800px to the desired point to hide the ads. Using this approach means you don’t have to copy responsive.css to your child theme or change the enqueue function.