How to display Google Adsense Ads and show or hide them

3

Stats

6,283 visits, 9,867 views

Tools

Translations

This tutorial hasn't been translated.

License

This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Published on 29 Aug, 2015. Last updated 19 Feb, 2019

Synopsis:

I will demonstrate how to show or hide Google Adsense ads in your layouts

1

Add your Google Adsense ad code snippet in your index.html

Tip: Place it right before <body> tag.

2

Copy paste the Javascript code anywhere below jquery script code.

        <script type="text/javascript">
        function loadAd_menu() {
            var w = jQuery(window).width();
            var h = jQuery(window).height();
            var left = (w/2) - (320/2);
            var top = h-80;
            $('#ad').css({'top': top+'px', 'left': left+'px'});
        }
        function loadAd_levels() {
            var w = jQuery(window).width();
            var left = (w/2) - (320/2);
            var top = 60;
            $('#ad').css({'top': top+'px', 'left': left+'px'});
        }
        function hideAd() {
            $('#ad').css({'top': '0px','left':'-999px'});
        }
    </script>

loadAd_menu is placing the ad 320 by 50 pixels on the bottom of the page in middle then loadAd_levels is placing the ad on the top. loadAd_levels will place the ad block on the top of the page. hideAd will hide the ad. Please rename and edit the values at will.

3

Now lets look on how we can trigger these javascript functions from Construct 2.

I hope it helps someone :D

Have a good one,

  • 1 Comments

  • Order by
Want to leave a comment? Login or Register an account!
  • Thank you!

    Would this work on C3? is it possible to position the ads?