Btuts™

This great template was created by SAER. And I am using it now for my blog. Classified as a PREMIUM template, it has many functions:

1. PROFESSIONAL LOOKING BLOGGER TEMPLATE
2. FULLY WIDGETS
3. ADSENSE ADS OPTIMIZED TOP
4. ADSENSE ADS OPTIMIZED BELOW POST
5. HIGH QUALITY GRAPGHIC PICKED
6. AUTO READ MORE FUNCTION
7. RELATED POST WIDGET
8. THREE COLUMNS UPPER SECTION
9. THREE COLUMNS BOTTOM SECTION
10. RSS FEEDS COSTUMIZED WIDGET
11. SEARCH BAR

DEMO | DOWNLOAD | INSTALLATION

**UPDATED**

To remove the adsense under the post, delete this code:

<div class='subscribe'>
<script type="text/javascript">
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script> </div>

Ads banner under the post, find this code:

<div class='ad'><a href='http://blogger-dashboard.blogspot.com/' target='_blank'><img src='http://lh4.ggpht.com/_9b1traaMESE/SpfdyI2EiOI/AAAAAAAAAzk/OEgjMBD4OcQ/ADS BANNER.png'/></a></div>

Ads banner on the top right, find this code:

<div class='ad'>
<a href='http://blogger-dashboard.blogspot.com/' target='_blank'><img src='http://lh4.ggpht.com/_9b1traaMESE/SpfdyI2EiOI/AAAAAAAAAzk/OEgjMBD4OcQ/ADS BANNER.png'/></a>
</div>

For both of ads banner, I used my own banner. Delete or replace it with your own banner image, it's your call.

"Read More" is very important. This trick will automatically create post summaries and guess what? With thumbnails too. Extra code in your blog post? No need anymore. I bet you will love it.

Let see how to do this.

Go to Blogger Dashboard >> Layout >> Edit HTML, and click on "Expand Widget Templates"
Expand Widget Templates

and find this tag: </head>.

Then copy and paste the below code BEFORE </head> tag

<script type='text/javascript'>var thumbnail_mode = "no-float" ;
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 100;
img_thumb_width = 120;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}

function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}

var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}

//]]>
</script>

Now find this tag: <data:post.body/> dan REPLACE with the below code:-

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

<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");
</script> <span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'><img src='http://i37.tinypic.com/351icqx.jpg'/></a></span>

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