4 Free Blogger Template: Wood Craft

At the end of the year 2009 waiting for a few hours to go and welcome 2010, I wanted to publish another blogger template as a new year gift for you all, no this is not the end I am coming with lots of more templates in future with new and exciting experimental features, so for now here it is another free blogger template - Woodcraft. Now, now you may ask what's new with that? So, click on the demo link below and experience the difference! I have given jQuery based page-curl effect on main-wrapper (i.e below post). When you are on hompage you will see it at the right side assuming it as saying to move to the next page, and when you are on any inner page it appears to both left and right sides assuming as saying either move to the next page or to the previous.

Screen-shot: Page-curl effect on homepage

Screen-shot: Page-curl effect on inner-pages

Another gorgeous feature is the "Recent Posts/Updates" widget having a "Subscription Form Balloon (or say Bubble)" on top directing visitors to subscribe to the feeds via email.

Screen-shot: Recent Posts/Updates Widget with a email subscription form widget on top

Screen-shot: Woodcraft Template on IE-8

DEMO | DOWNLOAD LINK 1 | DOWNLOAD LINK 2

Installation Steps:

Backup you existing template:

• Go to Edit HTML, and then click Download Full Template and save it.

Install "Stunning Looks" Template:

• Go to Layout > Edit HTML
• Click on the Browse Button and upload the woodcraft_Template.xml file.
• Click on the Save button.

Edit Widgets:

To edit top "Social Media Networking Widget" find the following codes in template;

Code:

<!--TOP SOCIAL MEDIA ICONS WIDGET STARTS -->
<div id='sm_icons'><span class='digg'><a href='#Digg' target='_blank'>Digg</a></span> <span class='delicious'><a href='#Delicious' target='_blank'>Delicious</a></span> <span class='facebook'><a href='#Facebook' target='_blank'>Facebook</a></span> <span class='stumble'><a href='#Stumble' target='_blank'>Stumble</a></span> <span class='technorati'><a href='#Technorati' target='_blank'>Technorati</a></span> <span class='linkedin'><a href='#LinkedIn' target='_blank'>Linkedin</a></span> <span class='twitter'><a href='#Twitter' target='_blank'>Twitter</a></span> <span class='feedit'><a href='#FEED URL' target='_blank'>Subscribe</a></span> <span class='emailit'><a href='http://feedburner.google.com/fb/a/mailverify?uri=FEEDBURNER FEED TITLE' target='_blank'>Via Email</a></span></div>
        <!--TOP SOCIAL MEDIA ICONS WIDGET ENDS -->

and replace the RED texts with your profile link for the respective social networking site, BLUE text with your blogs feed Url and the text in PINK with your feedburner feed title.

To edit the top navigation menu find the following codes;

Code:

<ul>
<li><a expr:href='data:blog.homepageUrl'>HOME</a></li>
<li><a href='LINK URL'>LINK 1</a></li>
<li><a href='LINK URL'>LINK 2</a></li>
<li><a href='LINK URL'>LINK 3</a></li>
<li><a href='LINK URL'>LINK 4</a></li>
</ul>

and replace the RED texts with respective link and titles.

To edit the "Email Subscription Form Widget" find the codes shown below;

Code:

<div id='subsfeed'>
<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=YOUR FEEDBURNER FEED TITLE&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'><input class='subsfeed_field' name='q' onblur='if (this.value == &quot;&quot;) {this.value = &quot;email address here&quot;;}' onfocus='if (this.value == &quot;email address here&quot;) {this.value = &quot;&quot;;}' type='text' value='email address here'/><input name='uri' type='hidden' value='YOUR FEEDBURNER FEED TITLE'/><input name='loc' type='hidden' value='en_US'/><input class='subsfeed_button' type='submit' value=''/></form>
</div>

and replace the RED texts with your blog's feedburner feed title.

To edit the 468x60 ad panel on top right find the codes shown below;

Code:

<div id='banner_468_60'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTYpkachfUB7c-vzVQ56292VWEXAQdBsLlb6SmxoeCLMHuMN5Jb-me9967y7cM2WyHkDK-DjKl8-CfeCvoBv0YRyE124-AFsMlylsTqVNWZDz6j_nxhJru6_5ctkaajW886FcKquG2fHYN/s1600/468x60ad.jpg'/></div>

and replace the RED texts with your 468x60 ad-sense or any ad code.

For any further help come through the comments section!

Credit:
For Social Media Networking Icons Set: chethstudios.