Guzel Magazine Blogger Template at Saturday, November 07, 2009

	Template Name : Guzel Magazine
	Original Designer : Custom Theme Design
	Bloggerized by : Free Blogger Template
	Demo Url : CLICK HERE
	Download : Guzel.zip

Guzel magazine is another free premium wordpress theme designed by Custom Theme Design team for WordPress community. Now I convert it for Blogger Community :P.

GUZEL MAGAZINE BLOGGER TEMPLATE IS FREE PREMIUM BLOGGER TEMPLATE. EVERYONE CAN USE IT FOR FREE, NO NEED TO BUY OR MAKE A DONATION. IF YOU APPRECIATE MY JOB, PLEASE DON'T REMOVE THE FOOTER CREDIT LIKE DESIGNER AND ALL SPONSORS.

THANKS

Instalations Guide :

1. Top Navigations

NOTE :
"BLUE CODE" => LINK/URL ANCHOR
"RED CODE" => TEXT ANCHOR
CHANGE RED AND BLUE CODE WITH YOUR ORN.

Go to Edit HTML the find the code below

<div id='topleft'>
<ul id='pagenavigation'>
<li class='page_item'><a href='/index.html'>Home</a></li>
<li class='page_item'><a href='#'>Categories</a>
<ul>
<li class='page_item'><a href='#'>SUB MENU</a></li>
<li class='page_item'><a href='#'>SUB MENU</a></li>
<li class='page_item'><a href='#'>SUB MENU</a></li>
</ul>
</li>

<li class='page_item'><a href='#'>Archives</a>
<ul>
<li class='page_item'><a href='#'>SUB MENU</a></li>
<li class='page_item'><a href='#'>SUB MENU</a></li>
<li class='page_item'><a href='#'>SUB MENU</a></li>
<li class='page_item'><a href='#'>SUB MENU</a></li>
</ul>
</li>
</ul>
</div>

Adding new menu :

<div id='topleft'>
<ul id='pagenavigation'>
<li class='page_item'><a href='/index.html'>Home</a></li>
<li class='page_item'><a href='#'>Categories</a>
<ul>
<li class='page_item'><a href='#'>SUB MENU</a></li>
<li class='page_item'><a href='#'>SUB MENU</a></li>
<li class='page_item'><a href='#'>SUB MENU</a></li>
</ul>
</li>

<li class='page_item'><a href='#'>Archives</a>
<ul>
<li class='page_item'><a href='#'>SUB MENU</a></li>
<li class='page_item'><a href='#'>SUB MENU</a></li>
<li class='page_item'><a href='#'>SUB MENU</a></li>
<li class='page_item'><a href='#'>SUB MENU</a></li>
</ul>
</li>
<li class='page_item'><a href='#'>New Menu 1</a></li>
<li class='page_item'><a href='#'>New Menu 2</a></li>
</ul>
</div>

Adding new menu with sub menu:

<div id='topleft'>
<ul id='pagenavigation'>
<li class='page_item'><a href='/index.html'>Home</a></li>
<li class='page_item'><a href='#'>Categories</a>
<ul>
<li class='page_item'><a href='#'>SUB MENU</a></li>
<li class='page_item'><a href='#'>SUB MENU</a></li>
<li class='page_item'><a href='#'>SUB MENU</a></li>
</ul>
</li>

<li class='page_item'><a href='#'>Archives</a>
<ul>
<li class='page_item'><a href='#'>SUB MENU</a></li>
<li class='page_item'><a href='#'>SUB MENU</a></li>
<li class='page_item'><a href='#'>SUB MENU</a></li>
<li class='page_item'><a href='#'>SUB MENU</a></li>
</ul>
</li>
<li class='page_item'><a href='#'>New Menu</a>
<ul>
<li class='page_item'><a href='#'>NEW SUB MENU</a></li>
<li class='page_item'><a href='#'>NEW SUB MENU</a></li>
<li class='page_item'><a href='#'>NEW SUB MENU</a></li>
</ul>
</li>
</ul>
</div>

2. Middle Navigations

<div id='menux'>
<ul id='dmenu'>
<li class='cat-item'><a href='http://www.youtube.com'>Video</a>
<ul class='children'>
<li class='cat-item'><a href='http://www.youtube.com'>YouTube</a></li>

<li class='cat-item'><a href='http://www.metacafe.com'>Metacafe</a></li>
<li class='cat-item'><a href='http://www.dailymotion.com'>DailyMotion</a></li>
</ul>
</li>
<li class='cat-item'><a href='http://www.blogger.com'>Blog</a>
<ul class='children'>
<li class='cat-item'><a href='http://www.blogger.com'>Blogger</a></li>
<li class='cat-item'><a href='http://www.wordpress.com'>Wordpress</a></li>
</ul>
</li>
</ul>
</div>

How to add new menu [with sub menu]? See the step 1.
3. Left Featured box/Post Feature



I did not make this "post feature" automatic update, because many people requesting for manually when adding a post in the "post feature box". So I made it as a widget element. You only need to click the text "Featured1/Featured2/Featured3/Featured4" then you add a widget as you wish.

Example:
1. Click "Featured1/Featured2/Featured3/Featured4"
2. Add a Widget => html/javascript
3. Place your post Title in "Title Box" and yout post summary in "Content Box"
4. Save

4. Right Featured box



This once have a same way with step 3.

Adding popular post widget:

1. Click "Popular" => Add a Widget => html/javascript
2. Below is the code for show your popular post

<script type="text/javascript">
function pipeCallback(obj) {
document.write('<ul style="text-transform: capitalize;">');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ul>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=a7d3195528df5e96181a3d2712266226&url=http%3A%2F%2FYOURBLOGNAME.blogspot.com&num=5" type="text/javascript"></script>

Just change "YOURBLOGNAME.blogspot.com" with your blog url.
"5" mean only show five popular post. Change "5" with your number of popular post wanna show.

Adding Recent Post :

Click "Recent" => Add a Widget => Feed => input your blog/post feed url
Example : http://yourblogmane.blogspot.com/feeds/posts/default

Adding Recent Comment :

Click "Comments" => Add a Widget => Feed => input your comments feed url
Example : http://yourblogmane.blogspot.com/feeds/comments/default

Adding Post Tags :

Click "Tags" => Add a Widget => Labels => See the picture below



ALL DONE....................