editing pipe separator menus

[old_picker]

EZPages :: Privacy Notice :: Shared :: Zen Cart

i am using the standard template that came with the install - well with some minor modifications

i need to edit the colour of this text in the separator menu
also need to change or delete some menu items like the "action DVD" menu item on the bottm separator

searched entire local site for these text strings to no avail
i don't mind editing code directly

any tips or pointers on formatting changing these?
thanks in advance

[rbarbour]

Admin > tools > ez-pages

[gjh42]

And the color/font/etc. will be in your stylesheet. Use the Firefox Web Developer tools or whatever you like to use to find out the classes that apply to various parts of these menus. Some of them may not be mentioned in the stylesheet yet; if so, just add new rules for them as needed.

[old_picker]

And the color/font/etc. will be in your stylesheet. Use the Firefox Web Developer tools or whatever you like to use to find out the classes that apply to various parts of these menus. Some of them may not be mentioned in the stylesheet yet; if so, just add new rules for them as needed.

ok managed to change the menu items ok thanks to the first poster

the site is at:
http://www.qualitycraftcovers.com.au/store/

and you will see the colours are off in the 2nd menu [light grey]
and the 2nd bar which is called "header" in tools > ezpages
dark blue and not easy to see

i have manged to change the footer menu and the topmenu to white with red hover and works for me - i would like to emphasisie the pale grey menu items in a darker colour

cant relate what is in the style sheet to the locations in the menu bars

i would also like to centre the header menu as in the footer menu

thanks for the help so far

[stevesh]

Add the red parts:

#navEZPagesTop {
background-color: #abbbd3;
background-image: url(../images/tile_back.gif);
font-size: 0.95em;
font-weight: bold;
margin: 0em;
padding: 0.5em;
color:#fff;
text-align: center;
}

#navEZPagesTop a {color: #fff;}

Adjust the #fff as desired.

For future reference, install the Firefox browser and the Web Developer plugin for Firefox. You can use those to see where in the stylesheet you change the styling of the various page elements.

Ctrl-Shift-Y will allow you to hover over a section of the page and see the class and id names for that section in the box at the top. The statements in the stylesheet that begin with # are id's and the ones that begin with dots are classes.

Ctrl-Shift-E will open the CSS editor and allow you to edit the stylesheet and see the changes in real time without changing anything permanently. An essential tool.

Some prefer Firebug, which does much the same thing.

(If you're using Firefox 4-9, you'll need to remap the editor shortcut, since Firefox has appropriated Ctrl-Shift-E for an internal function - I use Ctrl-Shift-Q.)

[old_picker]

thanks for the help - much appreciated
got it all looking pretty right now except for the hovers in that particular menu - hopefully be able to figure that out myself
cheers
ray