Show total posts - total comments script widget

On right hand side column of this blog traffic tips blog you can see total number of posts and total number of comments.

How to show total number posts and/or total number of comments on your blogger blog ?

Here is script to show total number of posts and comments . You have to add this java script
by going to Dashboard > Layout > Add a gadget > HTML /Java script

Then copy following java script .

Please change blog url from www.blogtraffictips.net to yourname.blogspot.com in the following script.


<script src="http://www.blogtraffictips.net/feeds/posts/default?orderby=published&alt=json-in-script&callback=rp"></script>

<script style="text/javascript">
function numberOfPosts(json) {
document.write('Total number of Posts: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
</script>
<script src="http://www.blogtraffictips.net/feeds/posts/default?alt=json-in-script&callback=numberOfPosts"></script>




<script src="http://www.blogtraffictips.net/feeds/comments/default?orderby=published&alt=json-in-script&callback=rp"></script>

<script style="text/javascript">
function numberOfComments(json) {
document.write('Total number of Comments: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
</script>
<script src="http://www.blogtraffictips.net/feeds/comments/default?alt=json-in-script&callback=numberOfComments"></script>


The first half can be used to display only total no. of posts and second half can be used to display only total no. of comments.

Adding Google Adsense anywhere in blog post

If you have a blogspot /blogger blog and want to add Google adsense anywhere in your post body you have come to right place !
In post body you can add google adsense at
1) Top of the post , below the title of the post. ( 468 x 60 or 336 x 280 google adsense unit)
2) A 200 x 200 google adsense unit at right or left hand top corner of the post.
3) At bottom / footer of the post above comments . ( 468 x 60 or 336 x 280 google adsense unit)

Please note that you have to add the google adsense code ( procedure given below) only once in HTML code of your blog template and the google ads will appear in three latest posts as only 3 such units are allowed by Google Adsense. So from fourth post you may observe a blank space in your post.

To add the Google adsense in your blog post following is the steps summary.

1) Generate Google adsense code with the size and colors of your choice.
2) Parse the google adsense code .
3) Copy and paste parsed code at appropriate place in html code of your blog template.(please save your original template before this)
4) You may need to add some html code line for aligning your adsense unit on left , right or center of the post body.

Now above steps in detail :

1) Step 1 is easy as everybody knows to generate google adsense code by logging to their google adsense account.

2) For step 2 you need to copy your google adsense code and paste it at parse your code here
Generate parsed code by clicking on Parse .

3) Now copy this code .Then go to your Dashboard > Layout > Edit Html > Click on Expand Widget templates . Now you have to paste the code at appropriate place as shown in picture below in red color . You can use search option of the browser to search the code shown . Paste the code at any of the one place from the three choice shown.



Now you can save your template . Please save your original template before this step.

4) Now check your blog , your google ad may not be properly aligned . So you need to add one line of html code before and after the google adsense code .

I will soon add a picture here for this alignment code.

Also note that there are some free blogger templates available on internet where you can directly add google adsense unit at post bottom by going to Layout > Edit ( Blog Posts) > then tick on 'Show Ads Between Posts' .

Blog Traffic - Title optimization widget

In my previous post on title optimization , I discussed about that title of the post should get displayed as Post title + Blog title to get better search engine ranking.

I found one such widget at http://widget-based.blogspot.com/. It is for blogspot users.

After installing this your post title will get displayed as Post title + Blog title.

But I also found one problem with this widget i.e. after installing this widget when I go to Layout and try shifting the position of page elements and click save , it does not save the changes.

Please do not use this widget for title optimization , if you already have good search engine ranking.

How to add google adsense in post body

This widget/code is for blogger/blogspot users, who want to add a 200x 200 google adsense unit in their post, either on left side or right side.

After login, go to dashboard, then go to layout, then go to edit html, then click on expand widget template, then within html code search for

After this code add


After this code , please paste google adsense code given below, or your generated google adsense code with the options suggested. The code needs to be parsed i.e. check image which follows code.You can parse your code here http://www.blogcrowds.com/resources/parse_html.php

<script type="text/javascript"><!--
google_ad_client = "pub-xxxxxxxxxxxx";
google_ad_width = 200;
google_ad_height = 200;
google_ad_format = "200x200_as";
google_ad_type = "text_image";
google_ad_channel = "";
google_color_border = "6699CC";
google_color_bg = "000055";
google_color_link = "FFFFFF";
google_color_text = "AECCEB";
google_color_url = "AECCEB";
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

Check this image for parsed code as it can not be typed here.



Instructions:


1. pub-xxxxxxxxxxx is google publisher code, which you need replace with your publisher code i.e. replace xxxxxxxxxx with your google publisher code.

2. The line 'float:left' is for placing ad on left hand side of post, if you make it right, ad will appear on right side of post. Right side is recommended.

3. Parse code as shown in image, it is necessary. Click on image to enlarge

4. After adding parsed code you need to add div code as shown in picture.

5. Please save your original template before making any changes.