[solved] Vertical menu's submenus and styling broken after..
Posted: Wed Jun 08, 2011 6:50 pm
After big upgrade jump from 1.6.7 to 1.9.4.1, sidebar menu is not operating as it was before upgrade and it has also taken on a different style. Since all pages use the same template, I don't understand how the vertical menu can look and perform different on a different page, then it does on the home page. How is that possible?
I can't really get a handle on what has happened but my vertical menu on the left sidebar looks fine on the Home page, but as soon as you click on a menu item, the following page has a different menu style. Apparently my CSS or menu templates or both were altered in some way during the upgrade process.
Not sure where to start.
Previously the menu would display indented sub-menus of the main pages once you clicked on the main page that had child pages. This no longer is the case. The sub-menu gets displayed, but it is no longer indented and the entire menu is rendered in a larger font size with left justification, less margin.
I could use a little help.
The site is http://www.fcap.org
Here is what the page looks like when in Edit Content>Preview and this is how it used to look prior to the upgrade.

This is how it actually looks online

Here is my current Sub Navigation menu code for the template I am using...
I've also noticed some irregularity on the HTML being generated. Here is the HTML from the sub nav on the Home Page...
And here is the same sub nav HTML code from another page. Notice how the list items code is different and lacking the same ul and li elements that the Home page has. I can't even figure out how this is happening since both pages are presumably using the same template.
I can't really get a handle on what has happened but my vertical menu on the left sidebar looks fine on the Home page, but as soon as you click on a menu item, the following page has a different menu style. Apparently my CSS or menu templates or both were altered in some way during the upgrade process.
Not sure where to start.
Previously the menu would display indented sub-menus of the main pages once you clicked on the main page that had child pages. This no longer is the case. The sub-menu gets displayed, but it is no longer indented and the entire menu is rendered in a larger font size with left justification, less margin.
I could use a little help.
The site is http://www.fcap.org
Here is what the page looks like when in Edit Content>Preview and this is how it used to look prior to the upgrade.

This is how it actually looks online

Here is my current Sub Navigation menu code for the template I am using...
Code: Select all
<!-- Start Sidebar -->
<div id="sidebar">
<!-- Start Sub Navigation -->
<div id="menu_vert">
<h2 class="accessibility">Sub Navigation</h2>
<!-- NB! The <ul><li> below is only added because several default templates use the same menu stylesheet, to "force" the subnavigation to act as if it's the second level in a list -->
<ul><li>
{menu template='simple_navigation.tpl' start_element='4.1' show_root_siblings='1' collapse='1'}
</li></ul>
<br />
<hr class="accessibility" /><br /><br />
</div>
Code: Select all
<!-- Start Sidebar -->
<div id="sidebar">
<!-- Start Sub Navigation -->
<div id="menu_vert">
<h2 class="accessibility">Sub Navigation</h2>
<!-- NB! The <ul><li> below is only added because several default templates use the same menu stylesheet, to "force" the subnavigation to act as if it's the second level in a list -->
<ul><li>
<ul>
</li></ul>
</li>
<li class="sectionheader"><span>FCAP Main Menu</span>
</li></ul>
</li>
<li class="parent"><a class="parent" href="http://www.fcap.org/index.php?page=about-fcap"><span>About FCAP</span></a>
</li></ul>
</li>
<li class="parent"><a class="parent" href="http://www.fcap.org/index.php?page=resources"><span>Resources</span></a>
</li></ul>
</li>
<li class="parent"><a class="parent" href="http://www.fcap.org/index.php?page=prayer"><span>Prayer</span></a>
</li></ul>
</li>
Code: Select all
<!-- Start Sidebar -->
<div id="sidebar">
<!-- Start Sub Navigation -->
<div id="menu_vert">
<h2 class="accessibility">Sub Navigation</h2>
<!-- NB! The <ul><li> below is only added because several default templates use the same menu stylesheet, to "force" the subnavigation to act as if it's the second level in a list -->
<ul><li>
<ul>
<li class="sectionheader"><span>FCAP Main Menu</span>
</li>
<li class="parent"><a class="parent" href="http://www.fcap.org/index.php?page=about-fcap"><span>About FCAP</span></a>
</li>
<li class="parent"><a class="parent" href="http://www.fcap.org/index.php?page=resources"><span>Resources</span></a>
</li>
<li class="parent"><a class="parent" href="http://www.fcap.org/index.php?page=prayer"><span>Prayer</span></a>
</li>