Loading...
Wednesday, 19 February 2014

Switch To Adsense Asynchronous Ad Code For Faster Page Loading

Google recently introduced an asynchronous version of their Adsense ad Javascript code. If you serve Adsense ads on your blog and wish to improve your blog loading speed, then it is a good idea to switch to the asynchronous JavaScript tags.
Asynchronous Javascripts improve web latency and offer better users experience because they load in parallel and do not block other parts of your web page from loading. This means that users will be able to load the content of your pages, even if they are having trouble loading the ads.
Google Adsense
Here's how to implement the asynchronous ad code in Blogger:


Part 1: Add the new Adsense script

First you need to add the asynchronous script near the top of your template.
Go to Template > Edit HTML and add this script before </head> tag:
<script async='async'src="http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
You only need to add this once, even if you have multiple ads.


Part 2: Replace your old ad codes 

Now replace your existing individual ad codes with the their asynchronous counterparts.
  1. Locate your ad code in your template and note its ID. The ad ID is the number next to "google_ad_slot".
  2. On your Google AdSense dashboard, click "My Ads" tab to view your ads list.
  3. Locate the corresponding ad unit (based on the ID) and click "Get Code".adsense ad list
  4. Then click the Code type dropdown menu and select "Asynchronous (BETA)".adsense switch to asynchronous
    Your asynchronous code will look like this:
    1<script asyncsrc="http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
    2<ins class="adsbygoogle"
    3style="display:inline-block;width:300px;height:250px"
    4data-ad-client="ca-pub-xxxxxxxxxxxxxxxx"
    5data-ad-slot="yyyyyyyyyy"></ins>
    6<script>
    7  (adsbygoogle = window.adsbygoogle || []).push({});
    8</script>
  5. Copy the asynchronous code and paste it over your existing ad code.
  6. Remove the first line as it is already added in Part 1.
  7. Repeat steps above for each ad unit.
Enjoy!

0 comments:

Post a Comment

 
Toggle Footer
TOP