Template logic for mobile devices

[Randy Calvert]

Is there a way we can trigger template logic for mobile devices?  

Something like:

{{If mobile}}
do this
{{endif}}

[Martin A.]

No, there's no proper way to tell what device is being used on server side. You should use the responsive CSS classes for this instead.

 

[Randy Calvert]

Thank you for the reply!  I appreciate you jumping in with ideas!  🙂

I had thought to use that, but my problem was that I'm trying to display some ad code....  

<div class='ipsResponsive_showDesktop ipsResponsive_showTablet'> **ADCODE FOR DESKTOP** </div>

<div class='ipsResponsive_showMobile'> **ADCODE FOR MOBILE** </div>

Will this cause the code to be actually loaded twice (meaning the ad network will actually send two different ads but only one would display to the actual user which would skew conversions?

I thought about trying to figure out something in javascript to look at the browser width and say if less than 425px, write mobile code.  If bigger than 425 write desktop code.  

Edited July 14, 2022 by Randy Calvert

[Martin A.]

I don't think that will cause issues. I do the same for my mobile ads. Google will not load ads in containers that are hidden.

{{$guestAdvert = \IPS\core\Advertisement::loadByLocation( "index_970x250" );}}
{{if $guestAdvert !== NULL}}
    <div class="ipsResponsive_showDesktop">
        {$guestAdvert|raw}
    </div>
{{endif}}
{{$guestAdvertMob = \IPS\core\Advertisement::loadByLocation( "index_970x250_mobile" );}}
{{if $guestAdvertMob !== NULL}}
	<div class="ipsResponsive_hideDesktop">
		{$guestAdvertMob|raw}
	</div>
{{endif}}

 

Edited July 14, 2022 by Martin A.

[Randy Calvert]

That works.  I wrapped code in the correct div tags and they appear to be working.  I just wanted to make sure I was not causing more problems for me down the line by loading ads but not displaying them.  

Thank you very much!  🙂 

Edited July 14, 2022 by Randy Calvert