XF 1.2 Adsense conditionals based on Browser Size


Well-known member
Just wondering if anyone is able to assist me on this query.

I have the following code, which by large works.

<xen:if is="{$visitor.user_id}">
<div style="text-align: center; padding: 8px 0 4px 0; border-bottom: 1px solid @primaryLighterStill">
            <script type="text/javascript">
            google_ad_client = "ca-pub-1111111111111111111";
            width = document.documentElement.clientWidth;
                if ((width < 800) && (width > 550)) {
                google_ad_slot = "9999999999";
                google_ad_width = 468;
                google_ad_height = 60;
                   if (width < 549) {
                    google_ad_slot = "9999999999";
                    google_ad_width = 320;
                    google_ad_height = 50;
            <script type="text/javascript"
So basically what this code does is :
- Check if the person viewing the content is a logged in user. If the viewer is the logged in user, then show them the google ad.
- The google ad displayed to them is based on their browser width. So if they are using a tablet, i am displaying them a google ad that is 468*60. If the user is using a mobile phone, a google ad that is displayed to them is 230*50.

The problem is that for widths over 800, a google ad is still being shown, a very small one at that. Example of what is being shown on desktop view is as follows:

Anyone got any ideas on how i can modify my code so that no google ad gets displayed for users who are logged in, and are using desktops with a width over 800?


Well-known member
If you read my thread, you will notice that is not what i need. I do not want to display ads if the browser width is higher than 800.
This works but I think you would be breaking the AdSense TOS. I didn't implement your own dimensions, I just used one of my own ads and added the conditional to hide the ad when the browser width is greater than 800px.

.myad { width: 320px; height: 50px; }
@media(min-width: 500px) { .myad { width: 468px; height: 60px; } }
@media(min-width: 800px) { .myad { width: 728px; height: 90px; } }
@media(min-width: 801px) { .myad { display: none !important; } }

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- myad -->
<ins class="adsbygoogle ldcads-responsive-below"
(adsbygoogle = window.adsbygoogle || []).push({});
You have to come up with a solution (mostly using Javascript) to not run the adsense code when your width is > 800px.