It is useful to create menu on the blog. With the menu helps the reader to be able to browse the blog articles more effective.
With my limitation of HTML knowledge I try to learn from other bloggers articles that I can implement. Finally found blog.ahmadrifai.net, its look easy to implement. Thanks for sharing the knowledge.
HTML script I quoted from his blog as follow:
<style>
/*---------------------------------------------------------------------------------*/
/* CATEGORY MENU */
/*---------------------------------------------------------------------------------*/
#cat-menu { background:none; height:35px;}
/* category navigation */
.nav { background:#f5f5f5;width:100%;z-index:99;
float:left; margin:5px 0 10px 0; padding:0px; list-style:none; height:35px;}
.nav a { position:relative; color:#555; display:block;
z-index:100; text-decoration:none; }
.nav li { float:left; width:auto; border-right:1px
solid #d9d9d9; }
.nav li a { font:bold 11px/15px Arial,serif;
padding:10px 12px; text-decoration:none; text-transform:uppercase; }
.nav li a:hover{ background:#333; color:#fff;
text-decoration:underline;}</style>
<div id='cat-menu'>
<ul class='sf-menu nav' id='cat-nav'>
<li><a href='/'>Home</a></li>
<li><a href='#'>
Menu 1</a></li>
<li><a href='#'>
Menu 2</a></li>
<li><a href='#'>
Menu 3</a></li>
<li><a href='#'>
Menu 4</a></li>
<li><a href='#'>
Menu 5</a></li>
</ul>
</div>
You can go to the blog to be target, go into the design, select the layout. Put the cursor to below Header and then fill it with the HTML script above.
Data which is colored red you can replace with the http address and a blue colored replaced with the name of the menu.
Good luck.
No comments:
Post a Comment