Cosmetic Girl

As its name, Cosmetic Girl is a feminine blogger template. Its girl illustration at the header make this template really suits your beauty, fashion, cosmetic, make up, even personal diary blog.

Demo | Download

Installation Setting

1. Download this template by clicking download link. Save xml file. Remember, save it, no need to open
2. Open your blogger dashboard, click on Layout>Edit HTML
3. Click Upload button, and pick xml file
4. Save it

Navigation Menu Setting

1. Access through Page Element
2. Click on Top Tab widget
3. Fill URL and anchor text
4. Save
   

-------------------------------------------------
THE CONTENTS OF THIS TEMPLATE IS MADE BY CEBONG IPIET.
PLEASE BE RESPECTFUL AND DO NOT REMOVE CREDIT FOOTER LINK WITHOUT MY PERMISSION.
YOU ARE ALLOWED TO DISTRIBUTE BUT NOT ALLOWED TO ADD DISTRIBUTED BY ON FOOTER

How to Set Label Cloud in Blogger Layout?

Have too many labels/categories on your post?Need a lot of space on your sidebar only for categories? There are many way to fix this problem. You can divide label become two or more , or use label cloud widget.

An older version of Label widget, is only list type. As I said, this type need a lot of space. Label cloud become an alternative to simplify label display. Now you dont need to add any complicated script to get Label cloud. Blogger has installed cloud type for Label widget. Note: this is only text cloud not animated cloud widget.

How to set label cloud on my template? Go to Page Element>Add Gadget, choose Labels gadget. There are two options, list type or cloud type to display. You also can choose which labels you want to show. Such a helpfull featured.

List of Blogs with Unique Design Under Blogger/Blogspot Platform

Blogger/blogspot become more popular in new bloggers as their first blogging platform. As a user I said that this platform easy to customize. We often meet unique design in Wordpress platform, with flexibility in plugin, they can create unique design with special effect.

But it's all about creativity. I found some unique design too under blogger platform. Here they are

Blog Amuki : an artistic design with flash slideshow featured.


Cebong Ipiet's Personal Blog : this is my personal blog haha im being narcist


Deconstruction Code : dark design full javascript effect make this design so manly


Chic and Sassy : girly design with swirl pattern. You can find another girly template here


Extra Icing Cake : one of Gisele Jaquenod's portfolio, with cute cake header


Green Corner Cookies : combination of pink and green for cookies blog


Itzi Blog : another Gisele's design


Jasmin Love Coffee : another Gisele's design


Mike Matas : Personal photoblog, designed grunge and simple


Savvy Moxie : dark red color for mom blog


Sprinkle : another Gisele's design


Cheth Studio : dark design with unique features


Sweet Cupcakery : detailed with sweet cupcake


Quinto Elemento


Flair in The City : such a fashionable and cute template

LinkWithin : Related Posts Widget with Photo Thumbnails

Related post widget shows related stories in similar categories. Showing related stories under each post help your reader find any interesting post easier. My last post discuss about related post widget using javascript. This widget only show post title. Thought it will be more interesting showing related post with image thumbnail. There's any another easy way to do this.

LinkWithin is a blog widget that appears under each post, linking to related stories from your blog archive. You can check the example on Free Blogger Templates Gallery. Check under each post, there are some related post with image thumbnail. More interesting than plain text. This widget totally free and easy to install. No complicated sign up or difficult script editing. How to put related post widget with thumbnail image on my post?

- Go to LinkWithin site
- Fill setting form. Type email, blog URL, choose Blogger platform, width. Width is how many related post will show. Adjust it to your post width.
- Click Get Widget button
- Page will be redirected to LinkWithin installation step. Follow instruction carefully. After all step done, the widget should now appear on your blog.

Free Icon Download Gallery

Need an icon for desktop or web development? There are so many icon that free to download. It's wasting time to search one by one. Simply, just browse from icon gallery and get what you need. These icons are licensed under Creative Commons Attribution 3.0 License, they are free for personal and non commercial use / free for public non-commercial use. This means that you are free to modify the design to suit your tastes in any way, but you must include the provided link back to authors site or notify the author.

Here some list of free download icon gallery

BieIcons

Free Icons Web

Icon Archive

Free Icons Download

Cookiez

As its name, Cookiez Free Blogger Template has unique cookies header. Composition of cupcake, ice cream, candy, lollipop, milkshake, and another sweet things. This cute blogger template suits your cake, food, recipe or cookies blog.

Demo | Download

Installation Setting

How to Use?

• Click on download link
• Save xml file on your desktop (save it no need to open)
• Go to blogger dashboard, Layout>Edit HTML
• Upload xml file through upload button
• Save

Navigation Menu Setting

Open Edit HTML, edit these code below

<div id='NavbarMenu'>
<ul id='nav'>
<li><a href='http://your-link-here'>Cake</a></li>
<li>
<a href='http://your-link-here'>Cookies</a>
<ul>
<li>
<a href='http://your-link-here'>Cookies #1</a>
<ul>
<li><a href='http://your-link-here'>Green</a></li>
<li><a href='http://your-link-here'>Red</a></li>

<li><a href='http://your-link-here'>Blue</a></li>
</ul>
</li>
<li><a href='http://your-link-here'>Cookies #2</a></li>
<li><a href='http://your-link-here'>Cookies #3</a></li>
<li><a href='http://your-link-here'>Cookies #4</a></li>
<li><a href='http://your-link-here'>Cookies #5</a></li>
</ul>
</li>
<li><a href='http://your-link-here'>Cupcake</a></li>
<li><a href='http://your-link-here'>Pudding</a></li>

<li><a href='http://your-link-here'>Sweet</a></li>
<li><a href='http://your-link-here'>Brownies</a></li>
<li><a href='http://your-link-here'>Tart</a></li>
<li><a href='http://your-link-here'>Cake</a></li>
<li><a href='http://your-link-here'>Cookies</a></li>
</ul>
</div>

This is free template. No special hosting service for image. To avoid bandwidth excedeed, caused image not show up, suggested to back up image and upload to your own hosting. Read this how to. How to backup image?

I have uploaded image file, you can download image here.

-------------------------------------------------
THE CONTENTS OF THIS TEMPLATE IS MADE BY CEBONG IPIET.
PLEASE BE RESPECTFUL AND DO NOT REMOVE CREDIT FOOTER LINK WITHOUT MY PERMISSION.
YOU ARE ALLOWED TO DISTRIBUTE BUT NOT ALLOWED TO ADD ANY LINK ON FOOTER

WoodMag

WoodMag Blogger Template, as its name, this template has wood background. Designed well and ads ready. Suitable both personal and business blog.

Demo | Download

Featured

• Three column
• Tested in majoring browser
• Ads ready
• Automatic readmore
• Three column lower section
• etc

Installation Setting

1. Install

• Download xml file
  
• Save to your desktop
• Go to blogger dashboard, open Edit HTML, click upload buttom and choose your downloaded xml file
• Save

2. Header

You can create custom header, size is about 400x100 pixel. Upload through page element, click Header widget

3. Header Right Ads

This templates is designed ads ready. Put your 468x60 banner ads, through Page Element, click on HTML widget and paste your code

4. Top Navigation Menu

Open Edit HTML, edit this code below

<div class='topnav'>
<ul id='topnav'>
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>
<li><a href='http://www.bietemplates.com/' target='_blank'>
Template Gallery</a></li>
<li><a href='http://www.emocutez.com' target='_blank'>Emoticon</a></li>
<li><a href='http://blogger.com' target='_blank'>Login</a></li>
</ul>
</div>

5. Secondary Navigation Menu

Open Edit HTML, edit this code below

<div id='nav'>
<ul id='nav'>
<li><a href='http://your-link-here'>Photoshop</a></li>
<li>
<a href='http://your-link-here'>Freebies</a>
<ul>
<li>
<a href='http://your-link-here'>Icon</a>
<ul>
<li><a href='http://your-link-here'>Icon #1</a></li>
<li><a href='http://your-link-here'>Icon #2</a></li>
<li><a href='http://your-link-here'>Icon #3</a></li>
</ul>
</li>
<li><a href='http://your-link-here'>Pattern</a></li>
<li><a href='http://your-link-here'>Brush</a></li>
<li><a href='http://your-link-here'>Swirl</a></li>
</ul>
</li>
<li><a href='http://your-link-here'>Vector</a></li>
<li><a href='http://your-link-here'>Sketch</a></li>
<li><a href='http://your-link-here'>Wallpaper</a></li>
<li><a href='http://your-link-here'>Theme</a></li>
<li><a href='http://your-link-here'>Layout</a></li>
<li><a href='http://your-link-here'>Inkscape</a></li>
<li><a href='http://your-link-here'>Graphic</a></li>
<li><a href='http://your-link-here'>CSS</a></li>
<li><a href='http://your-link-here'>Community</a></li>
<li><a href='http://your-link-here'>Submit</a></li>
</ul>
</div>

6. Banner Ads 125x125

Open Edit HTML. Tick mark on Expand Widget Template. Find these code below

<a class='ad1' href='#'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg296g-bygnA338gAPtJLXOFdC0-4WnKOI-hz8-P_rAGf1jrKQ3vHNLuazZzk2KF9FUTTmdt94yoWYQoHO4sFJra4ezGkrtHac5dA2-XVTnOwuQAdk7v8nAg-P-0HyHhYUvY0v_zOd4Z8-O/s1600/themeforest.jpg'/></a>
<!-- Ad2 start -->
<a class='ad2' href='#'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg296g-bygnA338gAPtJLXOFdC0-4WnKOI-hz8-P_rAGf1jrKQ3vHNLuazZzk2KF9FUTTmdt94yoWYQoHO4sFJra4ezGkrtHac5dA2-XVTnOwuQAdk7v8nAg-P-0HyHhYUvY0v_zOd4Z8-O/s1600/themeforest.jpg'/></a>
<!-- Ad3 start -->
<a class='ad3' href='#'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg296g-bygnA338gAPtJLXOFdC0-4WnKOI-hz8-P_rAGf1jrKQ3vHNLuazZzk2KF9FUTTmdt94yoWYQoHO4sFJra4ezGkrtHac5dA2-XVTnOwuQAdk7v8nAg-P-0HyHhYUvY0v_zOd4Z8-O/s1600/themeforest.jpg'/></a>
<!-- Ad4 start -->
<a class='ad4' href='#'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg296g-bygnA338gAPtJLXOFdC0-4WnKOI-hz8-P_rAGf1jrKQ3vHNLuazZzk2KF9FUTTmdt94yoWYQoHO4sFJra4ezGkrtHac5dA2-XVTnOwuQAdk7v8nAg-P-0HyHhYUvY0v_zOd4Z8-O/s1600/themeforest.jpg'/></a>


Change '#' to your targetted URL
Change https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg296g-bygnA338gAPtJLXOFdC0-4WnKOI-hz8-P_rAGf1jrKQ3vHNLuazZzk2KF9FUTTmdt94yoWYQoHO4sFJra4ezGkrtHac5dA2-XVTnOwuQAdk7v8nAg-P-0HyHhYUvY0v_zOd4Z8-O/s1600/themeforest.jpg to your image URL


Any comment, suggestion, bug report, just drop your comment.

Be respectful, do not remove credit footer link or do tricky thing such as replacing original link but still the same anchor text :D

-------------------------------------------------
Pass PW0-204 exam with promising score! We offer best 132-S-911-3 training to help candidates pass 1z0-054 exam on first try.

How to Show Blogger Navbar?

Most of new blogger template always hide Navbar. What's Blogger Navbar? Blogger Navbar is default navigation menu bar on top page.The purpose of not displaying navbar is for better looks. Honestly, I also remove this so my blog layouts will looks clear ^_^

But some people still want show blogger navbar on blog. First, we have to know why navbar is not show up?

Open Edit HTML, find this code

#navbar-iframe {
height: 0px;
visibility: hidden;
display: none;
}


See, navbar is set not display (display:none;)

So how to show up blogger navbar? Simply. Just delete that all code. And how to hide? Just put that code on your HTML.