If you want your own favicon on blogger and get rid of the default blogger favicon,just follow this simple guide.
1.Backup your template
2.you can convert an image file(jpg, png, gif, etc.) of your own choice into an image with a .ico extension.
3.Visit iconj to generate an icon or choose from free premade icons.
4.Upload your image as shown in figure below and the generator will generate the .ico image for your blogger blog.
you dont need to upload your favicon because iconj also host your .ico image on their web server and give you the .ico image URL to out it in your blog.
5.Go to Layout->Edit HTML.
and look for this code(it is at the top the template)
and paste the following code generated from iconj.com below it.
6.Save your template and now you have added favicon to your blogger blog.
Tuesday, July 7, 2009
Add Favicon to blogger in 3 Steps
Tuesday, May 19, 2009
Revolution Church Template For Blogger Modified
Revolution Church is originally a magazine style wordpress theme designed by Brian Gardner and bloganol.com have converted this wordpress theme for all blogger users.It is 3 column fixed and is optimized for advertising.Click here for demo.
Features of this Template :
-This Template is 3 column fixed with Sidebars at right.
-This Template is optimized for advertising.It has got more than 6 perfect areas for advertising.
-It has got inbuilt site-search Engine(improved by Blogger Grid .
-This Template has got date widget at Top left that shows the current date.
-This Template has got two CSS Menus.
-This Template is a magazine style template and has got the professional look.
Modified Features By Blogger Grid
-Added Sharethis Button to the Post Footer,removing common errors displayed by the Bookmarking Button.
-Added Read More Button for every post
-Replaced the search bar and errors associated with it.
Top Menu Configuration:
To customize Top Menu , find the following code and edit with your own link.<div id='NavbarMenuleft'>Sub Menu Configuration
<ul id='nav'>
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>
<li>
<a href='#'>Sample Page</a>
<ul>
<li>
<a href='#'>Sub Page #1</a>
<ul>
<li><a href='#'>Sub Sub Page #1</a></li>
<li><a href='#'>Sub Sub Page #2</a></li>
<li><a href='#'>Sub Sub Page #3</a></li>
</ul>
</li>
<li><a href='#'>Sub Page #2</a></li>
<li><a href='#'>Sub Page #3</a></li>
<li><a href='#'>Sub Page #4</a></li>
<li><a href='#'>Sub Page #5</a></li>
</ul>
</li>
<li><a href='#'>Sample Post</a></li>
<li><a href='#'>Blog Page</a></li>
</ul>
</div>
To customize Top Menu , find the following code and edit with your own link.But if you are a Google Adsense user then i suggest you to use long Link unit here.<div id='subnavbar'>
<ul id='subnav'>
<li>
<a href='#'>Community Events</a>
<ul>
<li>
<a href='#'>Sub Category #1</a>
<ul>
<li>
<a href='#'>Sub Sub Category #1</a>
</li>
<li>
<a href='#'>Sub Sub Category #2</a>
</li>
<li>
<a href='#'>Sub Sub Category #3</a>
</li>
</ul>
</li>
<li>
<a href='#'>Sub Category #2</a>
</li>
<li>
<a href='#'>Sub Category #3</a>
</li>
</ul>
</li>
<li>
<a href='#'>Conferences</a>
</li>
<li>
<a href='#'>Get Connected</a>
</li>
</ul>
</div>
To remove the Search Bar and replace it with Google Search Bar,replace the code below:
<form action='/search' id='search' method='get'
style='DISPLAY: inline'> <div> <input
id='search-box' name='q' size='25'/> <input
id='search-btn' type='submit' value='Search'/>
</div></form>
Adsense configration:
Open blog layout.Click 'Edit Html' and then 'Expand Widgets'
-The first adsense code is below this code
Look for this code <div class='headerright'>
Just below it you will find this code:
<script type='text/javascript'><!--
google_ad_client = "pub-7194406586635369";
google_ad_host = "pub-1599271086004685";
/* 468x60, created 11/5/08 */
google_ad_slot = "6571631656";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>
<script src='http://pagead2.googlesyndication.com/pagead/show_ads.js' type='text/javascript'>
</script>
Replace the above code with your adsense code.
-The second adsense code is below this code <div class='gapad'>
<script type='text/javascript'><!--
google_ad_client = "pub-7194406586635369";
google_ad_host = "pub-1599271086004685";
/* 468x60, created 11/5/08 */
google_ad_slot = "6571631656";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>
<script src='http://pagead2.googlesyndication.com/pagead/show_ads.js' type='text/javascript'>
</script>
Replace this code also with your adsense code.
How to enable 'Read More' in Revolution Church Blogger Template
In the blog menu
<span class="fullpost">
</span>
How to post your article?
When you post your article,you will see the code below in every post.
<span class="fullpost">
</span>
Example of post:
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque sed felis. Aliquam sit amet felis. Mauris semper, velit semper laoreet dictum, quam diam dictum urna, nec placerat elit nisl in quam. Etiam augue pede, molestie eget, rhoncus at, convallis ut, eros. Aliquam pharetra. Nulla in tellus eget odio sagittis blandit. Maecenas at nisl. Nullam lorem mi, eleifend a, fringilla vel, semper at, ligula. Mauris eu wisi. Ut ante dui, aliquet nec, congue non, accumsan sit amet. (this text will show up infront of your post and a read more button will appear after this text.)
<span class="fullpost">
Nulla in tellus eget odio sagittis blandit. Maecenas at nisl. Nullam lorem mi, eleifend a, fringilla vel, semper at, ligula. Mauris eu wisi. Ut ante dui, aliquet nec, congue non, accumsan sit amet, lectus. Mauris et mauris. Duis sed massa id mauris pretium venenatis. Suspendisse cursus velit vel ligula. Mauris elit. Donec neque. Phasellus nec sapien quis pede facilisis suscipit. Aenean quis risus sit amet eros volutpat ullamcorper. Ut a mi. Etiam nulla. Mauris interdum. .
(this will show if visitor click read more)
</span>
Download Revolution Church Template For Blogger:
Link 1
OR
Link 2
Sunday, May 17, 2009
Adding Big Social Bookmarking buttons to Blogger footer
In this tutorial you will learn how to add Social Bookmarking buttons to your Blogger(Blogspot)blog.By adding these buttons visitors to your blog can create links to popular social bookmarking sites such as Google, Technorati, Facebook, MySpace, Digg, Stumble Upon, Reddit, Delicious, Furl, Yahoo etc. Adding personal bookmarks enables visitors to share these links with others thereby helping your attract more traffic to your site.
Note:Before doing any changes to your blog "Don't forget to backup your template first"
1.Go to Layout
2.Edit HTML
3.Expand Widget Templates
Now use the Ctrl + F command to open the "find text option"
Now highlight copy the text in bold below and serch for it in the blogger template.
<div class='post-footer'>
When you have found it,copy the entire code given below above it like in the image.
<div style='clear:both; '>
<div style='width:60px; float:left;'>
<script type='text/javascript'>
digg_url = '<data:post.url/>';
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/>
</div>
<div style='width:60px; float:left;'>
<script badgetype='square' src='http://d.yimg.com/ds/badge2.js' type='text/javascript'><data:post.url/></script>
</div>
<div style='width:65px; float:left;'>
<a expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='external nofollow' target='_blank'><img alt='Stumble' src='http://s310.photobucket.com/albums/kk426/magznetwork/socialbig/stumble.gif' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' rel='external nofollow' target='_blank'><img alt='Delicious' src='http://s310.photobucket.com/albums/kk426/magznetwork/socialbig/delicious.gif' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='"http://technorati.com/faves?add=" + data:post.url' rel='external nofollow' target='_blank'><img alt='Technorati' src='http://s310.photobucket.com/albums/kk426/magznetwork/socialbig/technorati.gif' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='"http://twitthis.com/twit?url=" + data:post.url' rel='external nofollow' target='_blank'><img alt='Twitter' src='http://s310.photobucket.com/albums/kk426/magznetwork/socialbig/twitter.gif' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url + "&t=" + data:post.title' rel='external nofollow' target='_blank'><img alt='Facebook' src='http://s310.photobucket.com/albums/kk426/magznetwork/socialbig/facebook.gif' style='padding:0;margin:0;border:none;'/></a>
</div>
</div>
Click on Preview
If the blog looks fine click on Save Template and you are done.
