jim23866:
Hello,
I would like to change my navigational menu of my website. I would like a sprite menu and other sprite graphics. Below I have the links and code from another forum but it is exactly what I would like to do. I can not find where to place the html code for my main page. I know the "names" ie #header and #mainmenu are different or need to be changed. I did do alot of searching this and other Zen cart forum posts. I didn't want to "just"change core files. I know that is a no no. Any help would be greatly appreciated.
My site is https://www.eastcoastcaps.net zencart v1.39b cherry zen
I am looking to make a navigation menu similar to the following:
http://www.coremediadesign.co.uk/website_design_company/about_core_media_design.html
This is the sprite image they use.
http://img819.imageshack.us/img819/8185/menuo.png
CSS
Code:
#header {
width:100%;
height: 150px;
background: black;
padding:0;
margin:0;
}
#mainMenu {
list-style:none;
overflow:hidden;
width:980px;
margin:0 auto;
}
#mainMenu li {
display:inline;
}
#mainMenu a {
float:left;
width:137px;
padding:16px 0;
text-align:center;
font:normal 14px/17px arial,helvetica,sans-serif;
background:url(images/menuo.png) 0 0 no-repeat;
}
#mainMenu a:active,
#mainMenu a:focus,
#mainMenu a:hover {
background-position:0 -49px;
}
#mainMenu .current a {
background-position:0 -98px;
}
> HTML
> Code:
>
> ```html
<div id="header">
<div style="height: 101px"> </div>
<ul id="mainMenu">
<li class="current"><a href="#">Tab 1</a></li>
<li><a href="#">Tab 2</a></li>
<li><a href="#">Tab 3</a></li>
<li><a href="#">Tab 4</a></li>
<li><a href="#">Tab 5</a></li>
<li><a href="#">Tab 6</a></li>
<li><a href="#">Tab 7</a></li>
</ul>
</div>[PHP][/PHP]
:unsure: I don't know if I posted this right this is my first post ever.
Hello,
I've done a little more research. Since this post http://www.zen-cart.com/forum/showpost.php?p=950457&postcount=3073 I do still have that question unanswered.
I would like to know if I could use the CSS Horizontal Drop Down Menu addon is for v1.3.8 then change the colors for the menu to image sprites. Also move the whole menu to the top like it is currently on my cherry zen v1.39b.
In the addon it states in the readme file:
Add to the includes/templates/YOUR_TEMPLATE/common/tpl_header.php
"add this to your header where you'd like the css menu to appear:
<!--bof-drop down menu display-->
<?php require($template->get_template_dir('tpl_drop_menu.php',DIR_WS_TEMPLATE, $current_page_base,'common'). '/tpl_drop_menu.php');?>
<!--eof-drop down menu display-->
<div class="clearBoth"></div>
```"
I would like to do that BUT I don't know "what" I need to remove and exactly where to place this code so that it appears at the very to like my current navigational menu resides.
The question from my previous post and this one I know are apples and oranges. I thank you for your time.
JIM :unsure:
