2011-07-19, 06:15 AM
^ well, here is a quick example menu for you (modified from some other work)
admin panel --> templates --> current templates set --> header templates --> header
add below code at the top
AND admin panel --> themes --> current theme --> global.css -->
Edit Stylesheet: Advanced Mode --> scroll to the bottom & add below
if it is difficult to understand above code then PM me ...
simple menu - demo : [attachment=23436]
admin panel --> templates --> current templates set --> header templates --> header
add below code at the top
<div id="mytop_links">
<div class="linkscontainer">
<ul id="mynav">
<li><a href="#">link 1</a>
<li><a href="#">link 2</a>
<li><a href="#">link 3</a>
<li><a href="#">link 4</a>
<li><a href="#">link 5</a>
<li><a href="#">link 6</a>
<li><a href="#">link 7</a>
<li><a href="#">link 8</a>
</ul>
</div>
</div>
AND admin panel --> themes --> current theme --> global.css -->
Edit Stylesheet: Advanced Mode --> scroll to the bottom & add below
/* customized top menu */
#mytop_links {
margin:auto auto;
width: 950px;
}
.linkscontainer {
height: 40px;
background: url(./images/links-background.png) top left repeat-x;
padding-left: 8px;
}
#mynav {
height: 40px;
}
#mynav, #mynav ul {
padding: 0;
margin: 0;
list-style: none;
line-height: 1;
}
#mynav {
margin-bottom: 1px;
}
#mynav ul {
float: left;
list-style: none;
margin: 0px 0px 0px 0px;
padding: 0px;
}
#mynav li {
float: left;
list-style: none;
margin: 0px;
padding: 0px;
}
#mynav ul li {
list-style: none;
margin: 0px;
padding: 0px;
}
#mynav li a, #mynav li a:link {
color: #fff;
display: block;
margin: 0px 6px 0px 0;
padding: 14px 14px;
text-decoration: none;
font-size: 12px;
font-weight: bold;
text-transform: uppercase;
font-family: Arial, Helvetica, Sans-serif;
text-shadow: 0 1px 0 #2f3e46;
}
#mynav li a:hover, #mynav li a:active {
color: #fff;
display: block;
text-decoration: none;
background: url(./images/nav-background-hover.png) top left repeat-x;
text-shadow: 0 1px 0 #ac2f04;
}
#mynav li.current-cat a {
color:#fff;
background: url(./images/nav-background-hover.png) top left repeat-x;
text-shadow: 0 1px 0 #ac2f04;
}
#mynav li:hover, #mynav li.sfhover {
position: static;
}
if it is difficult to understand above code then PM me ...
simple menu - demo : [attachment=23436]