Zen Cart Logo
Forums / Templates, Stylesheets, Page Layout / Want to use a Dreamweaver template w/ navigation bar

Want to use a Dreamweaver template w/ navigation bar

Locked

Views: 3,547

Results 1 to 7 of 7
This thread is locked. New replies are disabled.
26 Sep 2007, 3:13 AM
#1
cgardner avatar

cgardner

New Zenner

Join Date:
Sep 2007
Posts:
46
Plugin Contributions:
0

Want to use a Dreamweaver template w/ navigation bar

I wanted to know if there is a way to place an existing navigation bar and header template from Dreamweaver for all the pages in zen cart. I have placed all of my sideboxes on the right (that I need), leaving the left colomn empty.

Take a look at the nav system/header at http://www.diginirvana.com.

Is there a way to do this?

26 Sep 2007, 3:27 AM
#2
redheads avatar

redheads

Zen Follower

Join Date:
May 2006
Posts:
119
Plugin Contributions:
0

Re: Want to use a Dreamweaver template w/ navigation bar

there are certainly ways to skin the cart in most any way - the limit is your php coding level -- search for info on custom templates and go to town, or you can always post for help in the commercial section :-)
I do not think you can just add a dreamweaver header and nav bar, though you could certainly link each front-page item to that section of your cart.

Have fun!
Oh, BTW -- I found myself wishing things were a little less 'huge' on your page - not sure if the left navigation runs off of the bottom of the screen on your monitor - scrolling down catches it, but it was not obvious to me on a 15 inch monitor.

I mention it in case it is supposed to fit on a screen.

Love the colors and domain name! :-)

26 Sep 2007, 3:52 AM
#3
kobra avatar

kobra

Black Belt

Join Date:
Aug 2005
Location:
Arizona
Posts:
31,500
Plugin Contributions:
4

Re: Want to use a Dreamweaver template w/ navigation bar

If you have these graphics and a graphic program to make any adjustments that might be required - you do not need DW - for the most part DW creates html code and Zen Cart is not constructed as html it is php.

You can apply the individual images to the appropriate css tags and be good to go.

If you do not have FireFox and the web developers extentions get them as this will make this process much simpler

26 Sep 2007, 4:12 AM
#4
cgardner avatar

cgardner

New Zenner

Join Date:
Sep 2007
Posts:
46
Plugin Contributions:
0

Re: Want to use a Dreamweaver template w/ navigation bar

This helps. Have Firefox (hardly ever use), but not sure what 'web developer's extentions' are?

26 Sep 2007, 6:08 AM
#5
misty avatar

misty

Inactive

Join Date:
Apr 2004
Location:
UK
Posts:
5,752
Plugin Contributions:
1

Re: Want to use a Dreamweaver template w/ navigation bar

cgardner:

This helps. Have Firefox (hardly ever use), but not sure what 'web developer's extentions' are?
http://chrispederick.com/work/web-developer/
Suggest visiting above url..

28 Sep 2007, 4:19 AM
#6
cgardner avatar

cgardner

New Zenner

Join Date:
Sep 2007
Posts:
46
Plugin Contributions:
0

Re: Want to use a Dreamweaver template w/ navigation bar

Thank you for all of the suggestions. I have been fixing the size issue, but have not uploaded it yet...thanks for the suggestion!:smile:

I have not used CSS before and am having trouble with creating the code. Anybody have any suggestions? I have been reading for the last three hours about CSS and cannot figure out how to set up the navigation bar with individual images as buttons. Plus, would I just be adding this code to stylesheet.css in my override directory?

So this is what I have so far...I think I am way off:
#navbar {
position: absolute;
left:0px;
top:125px;
width:150px;
background:#ffffff;
font-family:"arial";
padding:0px;
font-size:0.8em;
text-align:center;
}

#maincontent {
margin-left: 142px;
padding:0px;
line-height: 150%;
font-family:"arial";
font-size:0.8em;
}

a.navbut, a:visited.navbut{
text-align: center;
text-decoration:none;
color: #ffffff;
border-style: ridge;
border-width: 2px;
border-color: #EEC #EEC #C66 #C66;
display:block;
margin-top: 0px;
margin-bottom:0px;
background-image:url(..images/b_home_normal1.jpg) ;
}

a:hover.navbut{
display:block;
text-align: center;
text-decoration:none;
color: #00F;
border-style: ridge;
border-width: 2px;
border-color: #C66 #C66 #EEC #EEC;
margin-top: 3px;
margin-bottom:3px;
background-image:url(../images/b_home_over1.jpg);
}

I basically copied and pasted this and added the one image...wow! Help! I thought that the image based left-hand navigation would be easy to place in zen cart since I moved everything I needed to the right-hand side. Plus, other than the store, the rest of my website is being created in Dreamweaver (with the appropriate links to places in the store).

28 Sep 2007, 7:01 AM
#7
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Want to use a Dreamweaver template w/ navigation bar

Rather than reinvent the wheel, the Categories Dressing mod lets you use the standard Zen Cart categories sidebox and replace all the category names with individual images (among other possibilities). Or if you're not being that customized (as your navbut code suggests), it allows you to specify a standard top-category background image which changes on hover.

There is also a mod to allow you to use images in place of any or all of your sidebox headings, described in the Hiding the sidebox heading fonts/links.... thread.