<pedrocorreia.net ⁄>
corner
<mySearch ⁄> <mySearch ⁄>

corner
 
corner
<mySnippets order="rand" ⁄> <mySnippets order="rand" ⁄>

corner
 
corner
<myContacts ⁄> <myContacts ⁄>

<email ⁄>


pc@pedrocorreia.net

<windows live messenger ⁄>


pedrojacorreia@hotmail.com

<myCurriculum type="pdf" ⁄>


Download
corner
 
corner
<myBlog show="last" ⁄> <myBlog show="last" ⁄>

corner
 
corner
<myNews show="rand" ⁄> <myNews show="rand" ⁄>

corner
 
corner
<myNews type="cat" ⁄> <myNews type="cat" ⁄>

corner
 
corner
<myQuote order="random" ⁄> <myQuote order="random" ⁄>

Conhecer os outros é sabedoria. Conhecer a si mesmo é iluminação. Quem se sobrepõe os outros é forte. Quem se sobrepõe a si mesmo é poderoso. Quem sabe que possui o suficiente, é rico
corner
 
corner
<myPhoto order="random" ⁄> <myPhoto order="random" ⁄>

<pedrocorreia.net ⁄>
corner
 
corner
<myAdSense ⁄> <myAdSense ⁄>

corner
 
corner
<myVisitorsMap ⁄> <myVisitorsMap ⁄>

corner
 
<php ⁄><asp.net ⁄><vb.net ⁄><csharp ⁄><actionscript ⁄><sql ⁄>

<javascript ⁄><vb6 ⁄><vba ⁄><xml ⁄><css ⁄><asp ⁄>

 

<Adsense Blogger Manager ⁄ >




clicks: 9078 9078 2008-12-13 2008-12-13 goto mySnippets mySnippets javascript  Download  Bookmark This Bookmark This



As an AdSense and Blogger user, I think that using ads in Blogger could be more efficient, although it's very easy to use.

Blogger fully supports AdSense in its mechanism, however I think that we could have a little more power over the places we want to allocate them, for example in a middle of a post, right above the header; at the end of the post, etc, etc.


You can do the basics with Blogger AdSense support, you can place an ad at every X posts, customize colors, pick a format, but for my needs I think it was missing something.


So I decided to implement a solution in javascript, basically you generate all the ads in your Google AdSense Manager, and with the help of this simple script you can place your ads right where you want to.


This solution will be a little more complicated to implement, because you have to change your blogger script, so please, first of all:


MAKE A BACKUP !



Change your blogger script with caution, and it's never too much to remember, backup's a friend :)



So as I already said, we'll make a backup of our current script and activate a checkbox called: "Expand Widget Templates", this will allow us to see a more detailed script so that we can update it to our needs. Here's a picture that illustrates what I'm talking:




This is a rather simple script, I'll implement two different solutions to our ads:

  • 1st - you'll be able to print what ad you want;

  • 2nd - you'll be able to print all the ads in a alternate way, for example you have 2 ads and 6 posts per page, you'll be able to have a different ad, each post;



Of course if you only have 1 ad, the options above will do exactly the same, since it's the same that will be printed.


I'll give you a more detailed example about the 2nd solution.

I have a blog in which I use 2 types of ads:
  • link units;
  • ad units;


As you know each ad has a limit, for example you can have a maximum of 3 link and ad units per page (at the moment I'm writing this snippet), in my blog I use a system of 5 posts per page, so in each post I have a different type of ad.

The 1st post has an ad unit, the 2nd post a link unit, and so on, and so on, this will simple allow me to go alternating the ads, but this is just my case, I made the decision of using this ad technique, you could have yours.
This is just when you're listing your blog contents. When you're in a post, you can use alternating ads too, for example you can have an ad below the post title and/or another at the end.

The other technique is to use a specific ad, you can use a specific type of ad at a position, other ad type at other position.
As you can easily guess, you can put ads wherever you want to, in the post list, in a post, in the sidebar.


But enough (and maybe confusing :)) talking!


When you generate a script, Google will provide you something like this:

  1. <script type="text/javascript"><!--
  2.   google_ad_client = "pub-1234567890123456";
  3.   /* our ad comment */
  4.   google_ad_slot = "9876543210";
  5.   google_ad_width = 468;
  6.   google_ad_height = 60;
  7. //-->
  8. </script>
  9. <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">



Please take a special attention to these javascript variables:

  • google_ad_client;

  • google_ad_slot;

  • google_ad_width;

  • google_ad_height;

  • and our ad comment (text between /* */), although the comment's not strictly necessary;



We'll use these values in this script, this will instruct Google with our account information and ad type. I'll explain further, how to use these variables.


But where do you put this script? You have to edit your template and activate the checkbox "Expand Widget Templates", here's the picture again:




You can place this code right before you </head> tag, or in other position, but please rest assure that the code's inside your <head> tag.
Here's our javascript class:

  1. <script type="text/javascript">
  2.     //<![CDATA[
  3.  
  4.     /**
  5.     * A support class to Adsense in Blogger
  6.     *
  7.     * NOTE: the author of this script takes no responsibility, whatsoever,
  8.     * for what you do with this script.
  9.     *
  10.     * Use, this script, at your own risk.
  11.     * You take sole responsibility for its use.
  12.     *
  13.     * author: pedrocorreia.net
  14.     **/            
  15.     MyAdSenseBlogger = function(){
  16.  
  17.       //_settings
  18.       var _settings = {
  19.         _post_count: 1, //post count for AlternateAd
  20.         _ad_count: 0  //number of ads, this field's filled automatically
  21.       }
  22.  
  23.       //our ads
  24.       var _my_ads = {
  25.         ad1 : { //1st ad
  26.           client: "pub-1234567890123456",
  27.           comment: "this is my ad unit for blogspot",
  28.           slot: "1234567890",
  29.           width: "468",
  30.           height: "60"
  31.         },
  32.         ad2 : { //2nd ad
  33.           client: "pub-6543210987654321",
  34.           comment: "this is my link unit for blogger",
  35.           slot: "0123456789",
  36.           width: "468",
  37.           height: "15"
  38.         }
  39.  
  40.         //other ads ....
  41.  
  42.       } //end _my_ads      
  43.  
  44.       /**
  45.       * Private method
  46.       *
  47.       * Number of ads
  48.       * @return Int
  49.       */
  50.       var _Length = function(){
  51.         var count=0;
  52.         for (var i in _my_ads){count++;}
  53.         return count;
  54.       } //end _Length
  55.  
  56.       /**
  57.       * Private method
  58.       *
  59.       * Get a specific Ad
  60.       *
  61.       * @return Object Ad
  62.       **/
  63.       var _GetSpecificAd = function(pos) {
  64.         var count=1;
  65.         for (var ad in _my_ads){
  66.           if(pos==count) {return ad;}
  67.           count++;
  68.         }
  69.         return;
  70.       } //end _GetSpecificAd
  71.  
  72.       //number of ads
  73.       _settings._ad_count = _Length();
  74.  
  75.       /**
  76.       * Private method
  77.       *
  78.       * Method that will build compose the Ad javascript
  79.       *
  80.       * @param String Client Ad
  81.       * @param String Comment Ad
  82.       * @param String Slot Ad
  83.       * @param String Slot Width
  84.       * @param String Slot Height
  85.       * @return Object 
  86.       **/
  87.       var _BuildAd = function(ad_client, ad_comment, ad_slot, ad_width, ad_height){
  88.         return {
  89.           ad:[
  90.             "<script type=\"text\/javascript\"><!--",
  91.             "google_ad_client = \""+ ad_client + "\";",
  92.             "/* " + ad_comment + " */",
  93.             "google_ad_slot = \"" + ad_slot + "\";",
  94.             "google_ad_width = " + ad_width +";",
  95.             "google_ad_height = " + ad_height + ";",
  96.             "\/\/-->",
  97.             "<\/script>",
  98.             "<script type=\"text\/javascript\" src=\"http:\/\/pagead2.googlesyndication.com\/pagead\/show_ads.js\"><\/script>"
  99.           ]
  100.         }
  101.       } //end _BuildAd
  102.  
  103.       /**
  104.       * Output the Ad
  105.       *
  106.       * @param Object Our ad
  107.       **/
  108.       this.ShowAd = function(ad){
  109.         var adsense = _my_ads[ad]  || null;
  110.         if (adsense){
  111.           var my_ad = _BuildAd(adsense.client, adsense.comment, adsense.slot, adsense.width, adsense.height);
  112.           for (var i=0, count=my_ad.ad.length;i<count;i++){
  113.             document.writeln(my_ad.ad[i]);
  114.           }
  115.         }
  116.       } //end ShowAd
  117.  
  118.       /**
  119.       * Cycle through our ads and print each one
  120.       *
  121.       * @param Object Our Ad
  122.       **/
  123.       this.AlternateAd = function(){
  124.         this.ShowAd(_GetSpecificAd(_settings._post_count));
  125.         _settings._post_count++;
  126.  
  127.         //check if we reached our maximum ads
  128.         if(_settings._post_count>_settings._ad_count){
  129.           _settings._post_count=1; //reset counter
  130.         }
  131.       } //end AlternateAd
  132.  
  133.  
  134.   } //end MyAdSenseBloggerAlternate
  135.  
  136.   //create our object
  137.   var myAdsense = new MyAdSenseBlogger();
  138.   //end script MyAdSenseBlogger
  139.  
  140.   //]]>
  141. </script>




Please take a special attention to this section:

  1. //our ads
  2. var _my_ads = {
  3.   ad1 : { //1st ad
  4.     client: "pub-1234567890123456",
  5.     comment: "this is my ad unit for blogspot",
  6.     slot: "1234567890",
  7.     width: "468",
  8.     height: "60"
  9.   },
  10.   ad2 : { //2nd ad
  11.     client: "pub-6543210987654321",
  12.     comment: "this is my link unit for blogger",
  13.     slot: "0123456789",
  14.     width: "468",
  15.     height: "15"
  16.   }
  17.  
  18.   //other ads ....
  19.  
  20. } //end _my_ads



NOTE: You have to change it to suit your needs! I just made up this values, here you'll have to put your codes, and you can add or subtract ads.

However in this example I have 2 ads:
  • ad1;
  • ad2;

Each ad has 5 properties:
  • client;
  • comment;
  • slot;
  • width;
  • height;


Well, this just remembers us of our AdSense code provided by Google:


google_ad_client = "pub-1234567890123456";
/* this is my ad unit for blogspot */
google_ad_slot = "9876543210";
google_ad_width = 468;
google_ad_height = 60;


So for example we can add a 3rd ad, just take a special attention to the syntax.
Please take also a note to your ads name, in here I used "ad1", "ad2", but this is just a name, you can give it any other name, just as long as it's valid one.
As an advice use short names, without spaces or punctuation. This is important for our function ShowAd, because in here we can specificy what ad we want to print.


So now that you configured successfully your ads, though, they'll still not appearing ...

Now we'll have to print them, and well, this is just up to your decision, you call the shots in here!

To print your ads, you can simple type:

<script type="text/javascript">
  myAdsense.ShowAd("ad1");
</script>


Just make sure that "ad1" exists in our object "_my_ads", so, for example, if you have a ad named "adlink1", you have to call myAdsense.ShowAd("adlink1"); and so on.





Here's my blog example:

  1. <div class='post-body entry-content'>
  2.   <b:if cond='data:blog.pageType == &quot;item&quot;'>
  3.     <script type='text/javascript'>
  4.       myAdsense.AlternateAd();
  5.     </script>
  6.  
  7.     <p>&#160;</p>
  8.     <p><data:post.body/></p>
  9.     <p>&#160;</p>
  10.  
  11.     <script type='text/javascript'>
  12.       myAdsense.AlternateAd();
  13.     </script>
  14.  
  15.   <b:else/>
  16.  
  17.     <script type='text/javascript'>
  18.       myAdsense.AlternateAd();
  19.     </script>
  20.  
  21.     <p>&#160;</p>
  22.     <p><data:post.body/></p>
  23.  
  24.   </b:if>
  25. </div>



In this example I just use the function AlternateAd, but of course you can use ShowAd too or even mixing them!
When listing the blog posts, we'll have each ad post alternating, when we're inside/ viewing a specific post it'll print an ad below post title and place an ad at post ending.

So for example if you want to insert an ad in the middle of your post you can easily call the javascript function.
<script type="text/javascript">
  myAdsense.ShowAd("ad1");
</script>




If you want to add ads to the sidebar, just add a "HTML/JavaScript Add Gadget" and place the javascript, just like the following example:






Just a few notes:

  • please backup always your blogger script before making any changes!

  • take a good strategy about ads, in this example I explained mine; of course this is just an exemple, follow your needs and directions;

  • I red a lot of comments about using this technique, because of Google AdSense TOS; some were saying that this will take your account to be closed, since TOS don't allow you to change your AdSense code; and many others were saying that this is completely safe to use, because you don't change anything, ou AdSense code will be printed exactly like you received, only in a different manner, so this leads me to a final note: if you use this script, please bare in mind, that you're using at your own risk, I cannot take any responsibility about what you do with this code;




If you have any doubt or found any error, please drop me an email









clicks: 9078 9078 2008-12-13 2008-12-13 goto mySnippets mySnippets javascript  Download  Bookmark This Bookmark This