Show Ads on Desktop/Tablet but not on Mobile?

[statusjpn]

Hello!

Does anyone have an idea of how i might be able to run an advertisement within the ACP under "Advertisements" for it to only show up when the user is viewing using a normal web browser and not to display anything when viewing from a mobile site?

Reason being the ad i am running is 728x90 pixels and thus makes the mobile site go out of whack.

I've read the IPS guide on advertising and it stated that i can use responsive CSS classes with the command:

<div class='ipsResponsive_showDesktop ipsResponsive_showTablet ipsResponsive_block'>
SCRIPT
</div>

So i put my code/script like this:

<div class='ipsResponsive_showDesktop ipsResponsive_showTablet ipsResponsive_block'>
<center><ins class='dcmads' style='display:inline-block;width:728px;height:90px'
data-dcm-placement='XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX'
data-dcm-rendering-mode='script'
data-dcm-https-only
data-dcm-resettable-device-id=''
data-dcm-app-id=''>
<script src='https://www.googletagservices.com/dcm/dcmads.js'></script>
</ins></center>
</div>

But what happens is the ad totally does not show up, not in web/tablet/phone/responsive.

Hope someone can help? Thanks in advance!

[Square Wheels]

Maybe not the same as what you're doing, but I use this inside a global template, and it works.

 

<div class="ipsClearfix ipsResponsive_showDesktop">

stuff

</div>

[statusjpn]

13 hours ago, Square Wheels said:

Maybe not the same as what you're doing, but I use this inside a global template, and it works.

 

<div class="ipsClearfix ipsResponsive_showDesktop">

stuff

</div>

WOW, such a simple elegant solution. Works perfect.

Thank you so much, i really appreciate this and it will be helpful for anyone else looking for the same solution!

P.S. I put this code straight into the code box under "Advertisements" in the ACP.

[statusjpn]

@Square Wheels, sorry to be a bother, what about for the flip side, would you happen to know the code to show on "mobile only"?

Cheers!

[DawPi]

7 minutes ago, statusjpn said:

@Square Wheels, sorry to be a bother, what about for the flip side, would you happen to know the code to show on "mobile only"?

Cheers!

 

[statusjpn]

8 hours ago, DawPi said:

 

Amazing, thank you!

[statusjpn]

On 12/11/2020 at 5:28 PM, DawPi said:

 

I tried the following code:

<div class="ipsClearfix ipsResponsive_showPhone ipsResponsive_hideDesktop ipsResponsive_hideTablet">
<script data-ad-client="ca-pub-XXXXXXXXXXXXXXXXXXX" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
</div>

But the Google ads are still showing up on desktop/tablet view. Any ideas why?

I am trying to get Google ads with the auto code to only show up when viewing from mobile.

[statusjpn]

Bump, anyone has any ideas? Thanks!

[Nathan Explosion]

On 12/22/2020 at 7:45 AM, statusjpn said:

Any ideas why?

Because the CSS classes can't hide JavaScript code...CSS controls the display of html content.

The JS code you have called is going to run regardless of what CSS you put around it. To hide it then you will need to use JS code to detect when/when not to load it.

[statusjpn]

9 minutes ago, Nathan Explosion said:

Because the CSS classes can't hide JavaScript code...CSS controls the display of html content.

The JS code you have called is going to run regardless of what CSS you put around it. To hide it then you will need to use JS code to detect when/when not to load it.

Thank you! That is very precise and straight to the point! Much appreciated. I'd do some Googling in the meantime but do you know any JS code which i might be able to run in "Advertisements" so that Google Auto Ads only show up in mobile?

Cheers!

[Nathan Explosion]

Can't fully verify as I don't use Google Ads - but add an alert("TEST") inside the if statement and you'll verify that my surrounding test is fine:

<script>
  var width = Math.max(document.documentElement.clientWidth || 0, window.innerWidth || 0);
  if(width<=767){
    document.write("<script data-ad-client=\"ca-pub-XXXXXXXXXXXXXXXXXXX\" async src=\"https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js\"><\/script>");
  }
</script>