CMS Made Simple Forums

Posted: **Sun Jul 12, 2009 11:54 pm**

Looking for css that will display all the parent links in one horizontal link like:
HOME | ABOUT US | SERVICES | SOLUTIONS | NEWS & EVENTS | SUPPORT | CONTACTS

where i place the div style around the {menu} of cause

Posted: **Mon Jul 13, 2009 12:05 am**

you should create a new menu template on menu manager, apply a class or id to the ul and start coding the css/xhtml

also.. just for the toplevels.. you need something like

Code: Select all

{menu template="youtemplatename" number_of_levels=1}

Regards

G

Posted: **Mon Jul 13, 2009 5:45 pm**

quote SimonSchaufi

http://forum.cmsmadesimple.org/index.ph ... 286.0.html

Posted: **Fri Nov 04, 2011 2:26 am**

I know this is an old post now, but first time i tried this i could not find a way to do this excluding the line at the beginning of the menu.
e.g. | home | something | something
instead of: home | something | something
if anyone else needs to do this and you cant find a better way; you can:
1. go to : layout > menu manager
2. copy the menu your using so that you can edit it
3. look at the html output of your website
in the menu you will see something like

Code: Select all

<ul> <li><a href="http://www.soemthing.com/index.php">Home</a></li>

copy that
and go back to edit menu in menu manager
4. find the first instance of <ul> in the menu that defines the starting point
directly under that pasted
<li class="nosep"><a href="index.php">Home</a></li>
and save the menu
5. add code to your CSS like

Code: Select all

#menu li,
{ padding: 0px 11px 0px 11px; 
  float: left;
background-image:url(images/sep.gif); 
background-repeat:no-repeat; background-position:left;

#menu li.nosep {
background-image:none;
}

6. disable the homepage from being show in the menu becuase we have added it directly as above

7. replace the menu output tag on the template

method is adding separation background image (line image) to all li; and one li with a different class saying no background image

example sep image http://www.weddingswithoutfuss.com.au/images/sep.gif

Posted: **Sat Nov 05, 2011 5:20 am**

You could add class='{$page_alias}' to the LI then use the alias of the page, menu text, you don't want the line on, background-image:none...

Posted: **Sun Nov 06, 2011 9:38 pm**

Dr.CSS wrote:You could add class='{$page_alias}' to the LI then use the alias of the page, menu text, you don't want the line on, background-image:none...

yes that is a bit better with

Code: Select all

#menu li.home {
background-image:none;
}

Thanks. I will use that next time.

Posted: **Sun Nov 06, 2011 11:33 pm**

You don't have to change the menu template at all, just use the :first-child psuedo-class.

Code: Select all

#menu li:first-child {
  background-image: none;
}

also I think it would be better to use border-left to add a simple seperator line, unless you want the line to be some fancy gradient or something.

CMS Made Simple Forums

[solved] footer menu css wanted

[solved] footer menu css wanted

Re: footer menu css wanted

Re: footer menu css wanted

Re: [solved] footer menu css wanted

Re: [solved] footer menu css wanted

Re: [solved] footer menu css wanted

Re: [solved] footer menu css wanted