Drop down menu for subpages

[detective]

I prefer simplicity. Like this sandbox based template: scottwallick.com An editor making more mistakes than corrections

[jaymyers]

I agree that is a very clean look, would tie in nicely with Thesis. But, I really would hate to do anything to mess with the ease of use Chris has set up in the options panel at this point, even if it would be simple to work around now, I am sure future updates to Thesis will give even more power, and control, and don't want to have to get used to one nav and then give it up later because Thesis has a better solution.

But again, that example does look very Thesis-like...hint hint

[webactif]

I use the Multi-level Navigation Plugin !!!!

I works great for me, I could spend some more time getting it to look like the thesis links but i honestly havnt had the time ...

see
Welcome to Kirkburton Middle School — Kirkburton Middle School - Beta
Welcome to Pennine Pneumatic Services — Pennine Pneumatic Services > beta

just my thoughts ... might not be the best looking or optimised ... not tested it but it does the job quickly and is quite simple...

-G-

[ipears]

Guess it is a matter of css coding to get the child pages line up one after the other 1 line lower than the main navigation bar.

An idea would be the following:
Rather than a simple underline on mousover in the menu, we change the background to (active) on mouseover, opening up the line below and therewith making available space to show the child pages... which should then be shown and only stay shown when the parent or one of the child pages is active.

______ ___________ _______________
| main | mouseover | next parent menu|
child-1 child-2 child-3 child-4 child-5

(to give you the idea )

Will see if I can work this out coming weekend. (not much coding hours during the week )

What do you think?

[webactif]

I think this would be a cool idea ipears , I look forward to seeing your results !!

-G-

[kye172]

Originally Posted by ipears

Guess it is a matter of css coding to get the child pages line up one after the other 1 line lower than the main navigation bar.

An idea would be the following:
Rather than a simple underline on mousover in the menu, we change the background to (active) on mouseover, opening up the line below and therewith making available space to show the child pages... which should then be shown and only stay shown when the parent or one of the child pages is active.

______ ___________ _______________
| main | mouseover | next parent menu|
child-1 child-2 child-3 child-4 child-5

(to give you the idea )

Will see if I can work this out coming weekend. (not much coding hours during the week )

What do you think?

I just did something similar yesterday, but wasn't a mouseover, was built into the page you click (i.e physically goto a Page and it'll display SubPages and Page Content)

header.php:

<?php thesis_nav_menu(); ?>
<ul id="subpages">
<li>&nbsp;</li>
<?php
  if($post->post_parent)
  $children = wp_list_pages("title_li=&child_of=".$post->post_parent."&echo=0");
  else
  $children = wp_list_pages("title_li=&child_of=".$post->ID."&echo=0");
  if ($children) { ?>
  
  <?php echo $children; ?>

  <?php } ?>
  </ul>

The Empty List is so the header doesn't move up/down in relationship to the page when the sub menu is shown, and it provides a bit of an indent which I prefer

And the CSS...

ul#tabs li.current_page_parent { background: #fff; border-bottom-color: #fff; }

#tabs li ul {display:none;}


ul#subpages { list-style: none; }

	ul#subpages li { font-size: 1.1em; line-height: 1em; padding: 0.545em 0.818em; text-transform: uppercase; letter-spacing: 2px; float: left; }

		ul#subpages li a, ul#subpages li a:visited { color: #111; text-decoration: none; }

		ul#subpages li a:hover { color: #111; text-decoration: underline; }
	
		ul#subpages li.current_page_item a, ul#subpages li.current_page_item a:visited, ul#subpages li.current-cat a, ul#subpages li.current-cat a:visited { cursor: default; }
	
		ul#subpages li.current_page_item a:hover, ul#subpages li.current-cat a:hover { text-decoration: none; }

current_page_parent - Keeps the Top Level Menu styled as active when you're actually on subpages.

#tabs li ul {display:none;} - This is a just in case I mess up in the future setting up the site - If you select the subpages to be shown through the Thesis options panel, it'll render badly as per standard, as well as render the new sub menu we've just put in, so this will hide any sub-lists of the original top level menu if you forget and make them active in the Thesis options by mistake

It probably aint a neat and tidy fix by a long shot, but it does the job I needed it to do, if its any use to anyone else

[pedro]

demo please

[jdixson]

Originally Posted by diythemes

Everyone,

I would prefer not to use JavaScript on default versions of the theme, but I'm not opposed to coding up a CSS-based dropdown menu system. The only issue I have is that CSS dropdown menus call for quite a bit of conditional IE code, and generally speaking, I steer clear of "solutions" that are code-intensive for cross-browser adaptation.

I do realize, however, that people don't really care about all that—they just want a dropdown menu that works! In lieu of this, I'll probably end up caving and including this as an option on a future release of the theme.

How about a submenu under the main nav when you actually get to the page that has children... or am I missing something thats already there.

[kingdomgeek]

I believe Chris is taking subpages into account for the next version of Thesis, but I'm not sure. I know he mentioned something about enhancing the nav menu, but I don't know to what extent.

[kye172]

Originally Posted by pedro

demo please

Home — GP Scooters - George Petch Scooters - Sym

The site is only half built (well not even that actually), but under the Offers tab you'll see sub pages