Need some help defining menu

[jbwhite]

All,

I need your help.  I'm currently using 'CMS Made Simple 1.0.4 "Lanai"' and I am having difficulties getting the menu's to work properly.  This is a CMS issue.  The website is more or less ready but for this final issue.  What I would like is a menu that has the elements displayed, but in a hierarchial menu.  Such as:

Code: Select all

Main Heading Level
Main
   Second Level
     Third Level
           Fourth Level
           Fourth Level
           Fourth Level

     Third Level
     Third Level
     Third Level

   Second Level
   Second Level

Centers/Intistutes
Continuing Ed

What I really want is something like the previous menu in .8x of CMS.  Also, this site is using tables for layout, not divisions.  Anyway, I'm not good at css and I'm not following why the menu's just will not line up correctly using my layouts.  Suggestions are solicited and if someone can provide something that gives a nice clean menu, I can just about guarantee I'll use it!

HELP!  Please!!!

I am using the menu module.  I wasn't certain what would be useful additional info to post but I will happily put anything up that would help.

Thanks!

[Vin]

Well, and what exactly do you want to achieve? Do you want to have the menu as a list (like ul/menu with li tags) or with tr and td tags?
Oh, you had taken a look into the docs, had you?

[jbwhite]

I would like it to look like the default menu in the Canary .84 - which is like an outlined list, without bullets.  The problem here is I'm not that good at css.  I've tried modifying several different menu types, including the one in the newest update, but I cannot get the menu to align correctly on the left margin.

This is why I went with tables, which I have much more luck controlling page width and positioning of elements.  Using div tags, the client screen resolution could result in odd formating.  It is so frustrating because I know the menu should be working, but I'm unable to track down why it doesn't format correctly, inside the td element that encloses the {menu}.

[heatherfeuer]

If you want just a simple vertical menu in the sidebar, the simple navigation with two column template should work just fine!  The menu CSS provides the layout (and without bullets).  It's kind of hard to see what you are trying to do without a link to the site or seeing the code for the template and stylesheet.

[jbwhite]

If you want just a simple vertical menu in the sidebar, the simple navigation with two column template should work just fine!  The menu CSS provides the layout (and without bullets).  It's kind of hard to see what you are trying to do without a link to the site or seeing the code for the template and stylesheet.

http://www.wku.edu/chhs/cms/index.php/c ... institutes

Is kinda what I'm trying to do.

Other pages on the site have other issues.  Some of which are from me playing around with the css.

The menu is in the left hand page.  I checked the simple navigation with two columns.  That is close to what I'm trying to accomplish with this page.  Menu block in the left column.  Content block in the right.  Headers and footers filled in through the template/global blocks.  Some pages have menu block in left, content in middle, news block on right.  The menu block doesn't change width.    If you have specific code you want to see...I can post those.  Template, underlying css...the works.

[heatherfeuer]

If you would please post the stylesheet for that particular menu (on the page you linked to), I should be able to tell you which lines to change to remove the bullets.  I'm guessing that you want the indentation, just not the bullets, right?

[jbwhite]

I've made some changes. The new style for the menu is pretty darn close to what I want (aside from colors).  The code follows:

Code: Select all

/* Set margins */

#menu_vert, #menu_vert ul {
  margin: 0;
  padding: 0;
  }


/* First Level Formating */
#menu_vert ul {
/*   width: 100%; Width of Menu Items */
  border-top: 1px solid #069;
  border-right: 1px solid #069;
  background: #ececec;
  }
#menu_vert li {
/*  width: 100%; */
  list-style: none;
  }

#menu_vert li a {
  display: block;
  text-decoration: none;
  padding: 5px 5px 5px 10px;
  border-bottom: 1px solid #069;
  color: #18507C;
  }

/* Fix IE. Hide from IE Mac \*/
* html #menu_vert li { height: 1%; }
* html #menu_vert li a { height: 1%; }
/* End */

/* Second Level of Menu */
    #menu_vert ul ul li a, 
    #menu_vert ul ul li a:link, 
    #menu_vert ul ul li a:visited  {
        display: block;
        padding: 3px 5px 3px 25px;
        border-bottom: none;
        font-size: 90%;
    }
    #menu_vert ul ul  {
      border-right: none;
      border-top: none;
      border-bottom: 1px solid #006699;
      padding-bottom: 5px;
    }

/* Third Level of Menu */

    #menu_vert ul ul ul li a, 
    #menu_vert ul ul ul li a:link, 
    #menu_vert ul ul ul li a:visited  {
        padding-left: 40px;
    }
    #menu_vert ul ul ul  {
      border-bottom: none;
    }

/* Fourth Level of Menu */

    #menu_vert ul ul ul ul li a, 
    #menu_vert ul ul ul ul li a:link, 
    #menu_vert ul ul ul ul li a:visited  {
        padding-left:60px;
    }
    #menu_vert ul ul ul ul  {
      border-bottom: none;
    }

/* Padding for li */
   #menu_vert li ul li a,
   #menu_vert li ul li ul li a,
   #menu_vert li ul li ul li ul li a  { padding: 5px 5px; } 

This is a cut and paste from the Canary .84 stylesheet.  The activeparent class is not currently defined for links nor for the currentpage which were introduced in the upgrade to 1.0.4 "lanai".  I have edited some of the css to change spacing of elements. I need the 4 level menu to fit in a space of about 200px.  Does that help?

[heatherfeuer]

To be honest, I'm not sure you need any help!    You seem to be doing a pretty good job so far!  Do you have a good stylesheet editor that will let you see the changes you make easily?  I think if you were to open the stylesheet you've got started here and the simple vertical stylesheet that comes with "lanai," you could finish the styling by making comparisons between the two.  Right now, what stands out clearest to me is you don't have the styling for the "activeparent" elements.  That will take care of the the supersize text I see now compared with the rest of the menu elements.  I would also suggest that with all of the sections, you provide a bit of padding to keep the various text elements from lining up so close the the borders.

Earlier you said

I would like it to look like the default menu in the Canary .84 - which is like an outlined list, without bullets.

  If you have access to that stylesheet and menu template, you can just copy/paste them into your current version and use them that way.