I wanted to use the new top-bar navigation rather than the old nav-bar, so I adapted the menu function in the subtheme. I thought others might want this ability also...

I've built this into my subtheme, and wanted to share the code without mucking around with the repo (unless you'd like me to do so...) 

function THEME_links__system_main_menu($vars) {
	// Get all the main menu links
	$menu_links = menu_tree_output(menu_tree_all_data('main-menu'));
	
	// Initialize some variables to prevent errors
	$output = '';
	$sub_menu = '';
	$small_link = '';
	
	foreach ($menu_links as $key => $link) {
		// Add special class needed for Foundation dropdown menu to work
		$small_link = $link; //duplicate version that won't get the dropdown class, save for later
		!empty($link['#below']) ? $link['#attributes']['class'][] = 'has-dropdown' : '';
		
		// Render top level and make sure we have an actual link
		if (!empty($link['#href'])) {
			
			$output .= '<li' . drupal_attributes($link['#attributes']) . '>' . l($link['#title'], $link['#href']);
// Uncomment if we don't want to repeat the links under the dropdown for large-screen
//			$small_link['#attributes']['class'][] = 'show-for-small';
			$sub_menu = '<li' . drupal_attributes($small_link['#attributes']) . '>' . l($link['#title'], $link['#href']);
			// Get sub navigation links if they exist
			foreach ($link['#below'] as $key => $sub_link) {
				if (!empty($sub_link['#href'])) {
				$sub_menu .= '<li>' . l($sub_link['#title'], $sub_link['#href']) . '</li>';
				}	
			}
			$output .= !empty($link['#below']) ? '<ul class="dropdown">' . $sub_menu . '</ul>' : '';
			
			// Reset dropdown to prevent duplicates
			unset($sub_menu);
			unset($small_link);
			$small_link = '';
			$sub_menu = '';
			
			$output .=  '</li>';
		}
	}
	return '<ul>' . $output . '</ul>';
}
CommentFileSizeAuthor
#10 Selection_002-before-patch.png31.17 KBchrisjlee
#9 Selection_001.png36.59 KBchrisjlee
#5 topbarNew-1934076.patch4.32 KBchrisroane
#1 1934076-support-top-bar.patch6.18 KBchrisjlee
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

chrisjlee’s picture

chrisjlee CreditAttribution: chrisjlee commented
FileSize
1934076-support-top-bar.patch6.18 KB

cbandes:

Nice! I've turned it into a patch for others for the time being. This could eventually be implemented into the starterkit.

cbandes’s picture

cbandes CreditAttribution: cbandes commented

There's a bug in my above code, which I idn't notice until I started having deeply nested menus.

The return needs a class of either left or right, and I think it needs to be wrapped in a section like so:

    return '<section><ul class="left">' . $output . '</ul></section>';
chrisjlee’s picture

chrisjlee CreditAttribution: chrisjlee commented
Status: Active » Fixed
kevinquillen’s picture

kevinquillen CreditAttribution: kevinquillen commented

Chris, did you see my patch over in #1825876: How to use Foundation Navigation?? The problem (to me) in the above patch is it does not recurse through all the child links and render their menus as submenus. Meaning, you don't get deeply nested menus like you see on the Foundation website.

http://drupal.org/node/1825876#comment-7171286

The one change I would make to it is removing the section tag and moving that into the template (page.tpl) file, but I am not sure what everyone thinks yet.

chrisroane’s picture

chrisroane CreditAttribution: chrisroane commented
FileSize
topbarNew-1934076.patch4.32 KB

I know there are already several versions out there. I thought I would also throw in my code in how I am doing this.

I actually use a custom theme that implements foundation. But I ported over the code I'm currently using for integrating the top bar with the main menu into this theme with the included page. A few notes about this method:

- The top level

    and toggle section is in page.tpl.php .

    - In menu.inc, I have full control over the

      tag for the top level links and the drop down links.

      I tested this and it appears to work from my end.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

PeterEmil-1’s picture

PeterEmil-1 CreditAttribution: PeterEmil-1 commented
Status: Closed (fixed) » Active

Is there any update on this issue or do I need to switch to the 7.x-4.x branch?

chrisjlee’s picture

chrisjlee CreditAttribution: chrisjlee commented
Status: Active » Needs review

@PeterEmil no we just have to find someone that has a moment to review this patch and get it committed into the 7.x-1.x branch. It looks good to me so far.

chrisjlee’s picture

chrisjlee CreditAttribution: chrisjlee commented
Status: Needs review » Needs work
FileSize
Selection_001.png36.59 KB

Just did a quick check. Looks like the top bar needs some work here. Quick test shows some styling issues.

Selection_001.png

chrisjlee’s picture

chrisjlee CreditAttribution: chrisjlee commented
FileSize
Selection_002-before-patch.png31.17 KB

Before patch applied
Selection_002-before-patch.png

Kristina Katalinic’s picture

Kristina Katalinic CreditAttribution: Kristina Katalinic commented

I tested this patch but unfortunately it is not working as expected

Top Level
                           |_ First Level
                                               |_ Second Level Submenu

Works fine
But

 Top Level
                            |_First Level Submenu
                            |_ Second First Level Submenu

Will hide all submenus on mobile devices for some reason

ishmael-sanchez’s picture

ishmael-sanchez CreditAttribution: ishmael-sanchez commented
Status: Needs work » Fixed

This is fixed in the 4.x branch marking as fixed unless someone really needs this for 1.x then I can take a look.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.