Selamat Datang Di Blog Sederhana http://andylaoe.blogspot.com | Semoga Artikel-Artikel Yang Ada Bisa Bermanfaat | Terima Kasih Atas Kunjungannya.

Jumat, 01 Juni 2012

Pin It

Widgets

Cute Box Template



CUTE-BOX-DISPLAY-PICI 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)
Cute-Box


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


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,
backup-template1
    3.    When asked where to save the template, choose a safe location in your hard drive.
    4.    Done!
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!
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,
backup-template
    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!
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. Replacehttp://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>

subscription-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>
Please Share it! :)

Kindly Bookmark this Post using your favorite Bookmarking service:
Technorati Digg This Stumble Stumble Facebook Twitter
BLOG SEDERHANA

0 komentar:

Posting Komentar

:a   :b   :c   :d   :e   :f   :g   :h   :i   :j   :k   :l   :m   :n   :o   :p   :q   :r   :s   :t

Terima kasih atas kunjungannya, Semoga artikel di atas bisa bermanfaat.

Silakan komentar sesuai dengan artikel yang di sajikan!!!!
terima kasih.


andylaoe.blogspot.com

Blog Teman

ALT/TEXT GAMBAR
 

About Me

Recent Posts

Recent Comments

| Blog Sederhana © 2012. All Rights Reserved | Template Style by Blog Sederhana .com | email adittia.wibowo@gmail.com | Back To Top |