How to show adsense in specific post only?. This is quite a different scenario, if you want to exclude or remove Adsense ads from particular posts in Blogger. I am writing this post specially for my online friend ejaji, he wants solution on How to Exclude Adsense Ads From Specific Posts in Blogger.

Question:

"I have Adsense on my blogger blog. I have put the Adsense code in the template so that the ads show up automatically in every post. However, I need to exclude Adsense on a couple of posts. Is there any way of doing that? I know that, in Wordpress, there are plugins that do just that, but I need the same solution in blogger. Please help fast!"

How to Remove/Exclude Adsense Ads From Specific Posts in Blogger

Note: Before making any changes to your template, take a full backup of your blogger template.

UPDATE: Add Two lines of javaScript and hide All div wrapped google ads.

Put div around Google ads like given below:

If you have more than one Google Ads on your page then you need to modify your code something like this:



<div

id="GoogleAds1">

GOOGLE ADSENSE UNIT 1

<div>



<div id="GoogleAds2">

GOOGLE ADSENSE UNIT 2

<div>

.

.

.

Up to the Number of Ad Units you have.



and JavaScript to be added at the end of each post should be something like this:





<script type="text/javascript">

var Ads1 = document.getElementById('GoogleAds1');

var Ads2 = document.getElementById('GoogleAds2');

.

.

.

Ads1.parentNode.removeChild(Ads1);

Ads2.parentNode.removeChild(Ads2);

.

.

.

</script>

Up to the Number of Ad Units you have.



Note: Below is another way to Hide Google Adsense from Particular Post (use this if you want to exclue ads from 3-4 posts only, else use the solution i have given above).



#Step 1. Log in to your Blogger Dashboard and Navigate to Layout > Edit HTML and checked the Expand Widget Templates Check box.







#Step 2. Now Repeat below code (containing Adsense html code, generated from Google Adsense Account) as many times as you have google ads unit on your blog: For Demo purpose i have written below code keeping into mind that i am using only one Google Ads unit [468*15 - 4 link unit].



<b:if cond='data:blog.url == &quot;http://besthowtoblogger.blogspot.com/2010/06/how-to-replace-followers-title-with.html&quot;'>


<span style="display:none;">



&lt;script type=&quot;text/javascript&quot;&gt;&lt;!--
google_ad_client = &quot;pub-5820705378592492&quot;;
google_ad_host = &quot;pub-1556223355139109&quot;;
/* 468x15, created 6/7/10 */
google_ad_slot = &quot;4327800214&quot;;
google_ad_width = 468;
google_ad_height = 15;
//--&gt;
&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot;
src=&quot;http://pagead2.googlesyndication.com/pagead/show_ads.js&quot;&gt;
&lt;/script&gt;



</span>



<b:else/>



&lt;script type=&quot;text/javascript&quot;&gt;&lt;!--
google_ad_client = &quot;pub-5820705378592492&quot;;
google_ad_host = &quot;pub-1556223355139109&quot;;
/* 468x15, created 6/7/10 */
google_ad_slot = &quot;4327800214&quot;;
google_ad_width = 468;
google_ad_height = 15;
//--&gt;
&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot;
src=&quot;http://pagead2.googlesyndication.com/pagead/show_ads.js&quot;&gt;
&lt;/script&gt;



</b:if>

Similar to above code if you are using Ad unit or Link unit for each place you have to write above code which will remove ads from specific posts in blogger.



You can add multiple post URL's in the code above and can exclude ads from that posts also.



#Step 3. Save template and done!.



Hope this works for you, let me know in case of any difficulty, comment below your problem in brief and i will be able to solve it. :)

How many bloggers are there who wants to replace "Followers" Title With an Image in Blogger Siderbar?. Today i received a mail from TheoMat, asking help and hence inspired me to write this post on the topic of how to replace Google Followers title with image in Blogger sidebar.

I have already made a post about How to Replace Sidebar Widget's Title with an Image, but this hack will apply for all the widget's excepting Google provided "Followers" Widget.

Steps to Replace "Followers" Title With an Image in Blogger

Note: Before making any changes to your template, take a full backup of your blogger template.

#Step 1. Log in to your Blogger Dashboard and Navigate to Layout > Edit HTML and checked the Expand Widget Templates Check box.







#Step 2.Copy below code and paste it just before the ]]></b:skin> code and save template. This code will hide Title from the "Followers" widget.

h2.title{display:none;}

#Step 3. Now Navigate to Design > Page Element Tab.



#Step 4. Add your image code just above the Follower Widget(refer below screen shot).





Click Save and now you will be able to replace "Followers" Title With an Image in Blogger with 100% Success :)

Now you can display profile images or avatar in blogger comments very easily, if you have a profile picture in blogger then whenever you comment on another blog you will see your profile image over there. After formally announced the Blogger Comment avatars you should know that it means you will see the profiles pictures of the commentators near to the comments made. Here is a screen shot for Avatars on Blogger Comments



this is the part that will show up on the main page.

Now i think you are aware from what we are going to do, so now we will see how Avatars on Blogger Comments can show with little code in no time.





Steps to Add & Display Profile Images in Blogger Comments



#Step 1. Log in to your Blogger Dashboard and Navigate to Settings > Comments and select Show profile images on comment radio button.



"if you have a bespoken UN customized template used then you will see the avatars

on the comments on your blog without any change in code."



#Step 2. If you are using any other customized template you will have to add some codes into your template. Go to Blogger Layout > Edit HTML and checked the Expand the widget templates check box.







#Step 3. Find this line of code:



<dl expr:class='data:post.avatarIndentClass' id='comments-block'>

if you don't find the code given above then try to find the code given below.

<dl id='comments-block'>



And replace it with below code:

&ltdl expr:class='data:post.avatarIndentClass' id='comments-block'>



#Step 4. Now find all occurrence of the code given below

<a expr:name='data:comment.anchorName'/>

and replace each of it with this code:

<b:if cond='data:comment.favicon'>

<img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>

</b:if>

<a expr:name='data:comment.anchorName'/>

<b:if cond='data:blog.enabledCommentProfileImages'>

<div expr:class='data:comment.avatarContainerClass'>

<data:comment.authorAvatarImage/>

</div>

</b:if>

#Step 4. Save template and done!.

Comment here if you have any doubt or issue regarding adding avatars on blogger comments.

Breadcrumbs or breadcrumb is a navigation used in user interface, typically appear horizontally across the top of a web page, usually below title bars or headers in blog area.

I suggest every blogger who uses blogger as a blogging platform, should add breadcrumbs in blogger to gain SEO Advantage and to support easy page navigation to end users. The term "Breadcrumbs" comes from the trail of breadcrumbs left by Hansel and Gretel in the popular fairytale.



Typical breadcrumbs look like this:

Home page > Section page > Subsection page or Home page >> Section page >> Subsection page.

Steps to Add Breadcrumbs in Blogger

Note: Before making any changes to your template, take a full backup of your blogger template.

#Step 1. Log in to your Blogger Dashboard and Navigate to Layout > Edit HTML.





#Step 2. Find this code:

<b:include data='top' name='status-message'/>

and replace it wit this code:

<b:include data='top' name='status-message'/>

<b:include data='posts' name='breadcrumb'/>

#Step 3. Now Find this code:

<b:includable id='main' var='top'>

and Replace it with this code

<b:includable id='breadcrumb' var='posts'>

<b:if cond='data:blog.homepageUrl == data:blog.url'>

<!-- No breadcrumb on home page -->

<b:else/>

<b:if cond='data:blog.pageType == "item"'>

<!-- breadcrumb for the post page -->

<p class='breadcrumbs'>

<span class='post-labels'>

<a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>

<b:loop values='data:posts' var='post'>

<b:if cond='data:post.labels'>

<b:loop values='data:post.labels' var='label'>

<b:if cond='data:label.isLast == "true"'> »

<a expr:href='data:label.url' rel='tag'><data:label.name/></a>

</b:if>

</b:loop>

<b:else/>

» Unlabelled

</b:if>

» <span><data:post.title/></span>

</b:loop>

</span>

</p>

<b:else/>

<b:if cond='data:blog.pageType == "archive"'>

<!-- breadcrumb for the label archive page and search pages.. -->

<p class='breadcrumbs'>

<span class='post-labels'>

<a expr:href='data:blog.homepageUrl'>Home</a> » Archives for <data:blog.pageName/>

</span>

</p>

<b:else/>

<b:if cond='data:blog.pageType == "index"'>

<p class='breadcrumbs'>

<span class='post-labels'>

<b:if cond='data:blog.pageName == ""'>

<a expr:href='data:blog.homepageUrl'>Home</a> » All posts

<b:else/>

<a expr:href='data:blog.homepageUrl'>Home</a> » Posts filed under <data:blog.pageName/>

</b:if>

</span>

</p>

</b:if>

</b:if>

</b:if>

</b:if>

</b:includable>

<b:includable id='main' var='top'>

#Step 4. Now Find this code:

]]></b:skin>

and Replace it with the code given below

.breadcrumbs {

padding:5px 5px 5px 0px;

margin: 0px 0px 15px 0px;

font-size:95%;

line-height: 1.4em;

border-bottom:3px double #e6e4e3;

}

]]></b:skin>

#Step 5. Save template and done!.

If you are using multiple labels for one post then this breadcrumbs will show only the last label you have added, so put label at end in Labels for this post: section for which you want to show in your breadcrumb.

if you have any query you can always comment here!

This post is for blogspot users who want to attach a signature in their Blogger Blogs. After Receiving an e-mail from one of my blog reader i have posted this article which will guide you through and let you know that How you can add Signature in Blogger like the image given here.

Before Adding the signature you must have an image of your signature of any size, but i suggest you to use small signature image. you can use Microsoft Excel or Word to Create a signature image and save it as .jpg or .png, after having an image you need to upload it to your server.



I will suggest you to upload it into one of your blog post and once you have uploaded the image you can go into your post's EDIT HTML section and copy the<img src='url_of_your_signature_image' style='border:0px;'/> Code. Once you have copied that code you can delete that code but copy the code in some notepad for further use.



Steps to Add Signature Image in Blogger

Note: Before making any changes to your template, take a full backup of your blogger template.

#Step 1. Log in to your Blogger Dashboard and Navigate to Layout > Edit HTML and checked the Expand Widget Templates Check box.







#Step 2. Find any of this code:

<div class='post-footer-line post-footer-line-1'>

OR

<p class='post-footer-line post-footer-line-1'>

OR

<data:post.body/>



Put image code you have copied already after above code and save you template.



after adding code you code should look something like this:

<div class='post-footer-line post-footer-line-1'>

<img src='url_of_your_signature_image' style='border:0px;'/>

That's it, now you will find that at the end of each blog post your signature image is displaying very well.



if you have any difficulty while implementing this hack, comment below your problem.