Releasing Two Column Blogger Template “The Cute Box” - Speedy Yet Professional!

I was on EID holidays and during these three days a part from spending some time with my family and friends I spent a portion of my time in designing a really cute and speedy “two column” Blogger template. I named it “Cute Box”. It is unbelievably fast loading, well optimized, monetization friendly, has an attractive magazine style look and is surely cute!

Let’s not waste any time and have a look at it, (The Screenshot may be different from actual demo)

View | Download

 

Features

Lets look at some of its Main features,

1. Spitted Header
2. Two Column
3. Well organized Post Heading with separate date, time and label sections
4. Wide Post body with Stylized BlockQuote
5. Bullet lists with Image Hover Effect
6. Post Footer With Seductive Social Bookmarking Icons –The Flapper!
7. Post Footer With Related Post Widget
8. Posts summarized With Read More link
9. Embedded and stylized Comment section. Author and Readers comment with different style
10. Wide Open Comment Form!
11. Comment Avatars
12. Flexible Search Box
13. Unique Subscription Form
14. Best Advertisement sections
15. Four Column Footer Widget. One Column Can accommodate as many widgets as you can add!
16. Stylized Author Profile 
17. Bookmarking Widget For Homepage
18. And So on…

The bolded features are those that are found in 1/10,000 blogger templates found in the blogosphere. I am not kidding!

Customization

Below are important precautionary and customization steps for Cute Box . Click each link for details.

1. Back Up your current Blogger template
2. Back Up your Blogger widgets
3. Upload Cute Box
4. Edit The Navigation Menu
5. Add The Subscription Email Form
6. Author Profile
7. Add The Bookmarking Widget

 

Back Up your current Blogger template

You will have to save your current blogger template for safety precaution. To do this follow the steps below,

1. Go To Layout > Edit HTML

2. Click the link that says “Download Full Template“. As shown in the image below,

    3.    When asked where to save the template, choose a safe location in your hard drive.

    4.    Done!

Back Up your Blogger widgets

To save your current widgets follow the steps below,

1. Go To Layout

2. Open each widget one by one and copy the code inside it along with the title and paste it in a notepad (not a WordPad)

3. Save the notepad in a safe location

4. Done!

Upload Cute Box Template

Once you have downloaded Cute Box then follow the steps below to replace your current template with it,

1. Go To Layout > Edit HTML

2. You will see a box with two buttons at its side that says “ Browse” and “Upload” as shown below,

    3.    Click the browse button, locate the “Cute Box” file and then click the upload button

    4.    Now you will be asked that certain widget data will be lost if you click save. Since we have already backed up all our widgets so we don’t care. Go on and click the “Confirm Save” button. View your blog to see the good change!

Edit The Navigation Menu

To edit the navigation menu, follow the steps below,

1. Go to Layout > Edit HTML

2. Search for <div id='navleft'> using the browser search box     (Tip:- Press Ctrl + F )

3. Just below <div id='navleft'> you will see a long chain of code as shown below,

<div id='navleft'>
      <ul>
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>
<li><a href='#'>Cute Box</a>
<ul>
<li><a href='#'>Sub Page 1</a></li>
<li><a href='#'>Sub Page 2</a></li>
<li><a href='#'>Sub Page 3</a></li>
</ul>
</li>
<li><a href='#'>Contact</a>
<ul>
<li><a href='#'>Sub Page 1</a></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>
</ul>
</li>
<li><a href='#'>About</a></li>
<li><a href='http://www.mybloggertricks.com'>Download Cute Box</a></li>
</ul>

</div>

Replace The Hash signs (#) with your page links and bolded green text with your Page titles. If you don’t want the drop down menu then simple delete the red portion. Replace http://www.mybloggertricks.com with your own page link.

If you want to add another link then simple paste this code just above </ul>

<li><a href='#'>Your Page Title</a></li>

 

Add The Subscription Email Form

To add the subscription email form do the following,

• Go To Blogger > layout
• Click the edit link next to Subscribe
• Paste the code below inside it,

<style>
.emailform {
padding:0px; margin: 0px 10px 0px 0; float: left; width:100px; height:77px; border:0;
}
input.mbt1 {
color:#fff;
font: bold 10px "ms sans serif",Arial, sans-serif;
background:#41C952;
border:0;
padding:3px;
}
input.mbt1hov {
background:#F39100;
}
</style>

<a href="http://feeds2.feedburner.com/TntByStc" rel="alternate" title="Subscribe using a Feed Reader" type="application/rss+xml"><img src="http://4.bp.blogspot.com/_7wsQzULWIwo/SxPeinlkTKI/AAAAAAAACcM/IJQXpZSYMUU/s400/Email+Orange_128.png" class="emailform"/></a><p><a href="http://feeds2.feedburner.com/TntByStc" rel="alternate" title="Subscribe to my feed" type="application/rss+xml">Receive Updates </a><span style="color: #383838;">By Submitting your email address below:</span></p>

<form action="http://feedburner.google.com/fb/a/mailverify" style="padding: 5px; " target="popupwindow" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=TntByStc', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input style=" color:#289728; background: #fff; border:1px dotted #289728; width: 90px;" name="email" type="text"/><input value="TntByStc" name="uri" type="hidden"/><input value="en_US" name="loc" type="hidden"/> <input onmouseover="this.className='mbt1 mbt1hov'" onmouseout="this.className='mbt1'" value="Enter" class="mbt1" type="submit"/></form>

• Replace the above links with your feed links. Read this post for detail -> Beautiful subscription form for blogger
• Hit Save
• Done!

Add Author Profile

To write a new bio for your self or to delete this widget, do the following,

• Go To  layout
• Click the edit link next to About Me
• And make the necessary changes that you like to make

Add The Bookmarking Widget

I will write a comprehensive post on how to add this very important widget.

Download

I will email Cute Box Download Copy to all MBT subscribers today. Those who haven’t subscribed yet may subscribe now by filling up the simple subscription email form below,

As soon as I am informed that you have subscribed and activated MBT Feed Updates, I will email you the Download Copy instantly.

By becoming MBT Subscriber you are opening the doors for unlimited free downloads of unique Blogger Resources. Indeed We treat our subscribers exceptionally!

Note:- Cute Box Copyrights are licensed under the Creative Commons Attribution License. Kindly Keep the footer credits intact as a token of favor.

I hope you will like this EID present :>

Respected Readers: As a 20 year old student, the only income I rely on is my pocket money. Bearing the running costs of MBT Blog has become really difficult. We educate thousands of bloggers a week with our tutorials. To help us go forward with the same spirit, a small contribution from your side will highly be appreciated.

If you enjoyed this post and wish to be informed whenever a new post is published, then make sure you subscribe to our regular Email Updates!

Thanks for making this possible! Kindly Bookmark and Share it.