2

Drupal 7: I am struggling to figure out a way to change the menu structure that is printed when I place a menu block in a particular region.

What I want to do is change the classes on the ul when the menu is printed to a sidebar.

Everything I can find, and attempt will change the structure for all menus, but I need to print them differently depending where I put the menu.

Also, I need it to work for any menu I place in the region if possible. I will be creating menus for different areas of the site, and I hope I can get this to work based on the region that the menu is placed in.

Thank you

2

I'll give a couple answers to this and I'm basing it on the Twitter Bootstrap theme because of your comment back to onirio. I had the same issue using the same theme.

If all you want to do is change the class name once (it doesn't sound like it, hence the second answer - stay tuned), then you can visit the function "twitter_bootstrap_preprocess_page" in twitter_bootstrap/template.php. Within there, you will find this construct:

  $variables['primary_nav'] = theme('twitter_bootstrap_links', array(
  'links' => $variables['main_menu'],
  'attributes' => array(
    'id' => 'main-menu',
    'class' => array('nav'),
  ),

Simply, change the 'nav' to be whatever you want it to be. That will change it everywhere. Better would be to do as I did and sub-theme and change that rather than the actual Twitter Bootstrap theme.

Second answer:

If you want to do something more interesting, then consider instead where the aforementioned code is used. It is used in the function "twitter_bootstrap_twitter_bootstrap_links" found within includes/modules/theme.inc. You will see that function using these variables as such:

   links = $variables['links'];
   $attributes = $variables['attributes'];
   ...
   $output .= '<ul' . drupal_attributes($attributes) . '>';

So, if you want to get more fancy, then you'll need to modify the way that the ul is built. That may be served through researching or posting another more targeted question? Again, doing this in a sub-theme would be best.

4

You don't need to change or add new classes because each region has already a class. You need to specifically reference each menu class () in your stylesheet by adding first your region class name:

#region-menu ul.menu li {display: inline...}

#region-sidebar-first ul.menu li {display: block...}

etc...

so check you won't interfere.

Make sure the main menu has a unique reference as #region-menu to avoid inheritance.

  • The problem is I am using Twitter Bootstrap to generate the CSS, and if I modify the CSS and create new classes then I will have to every time they update the code. – Shane Grant Apr 6 '12 at 14:18
0

You're going to have a hard time strong-arming Twitter Bootstrap's CSS structure into Drupal. The functions in Drupal that build the menu tree structure (including adding in the UL) are completely unaware of where the menu ends up. I'm sure you will run into lots of other situations like this.

One option is to create a custom module and manually build each menu in code. You would need to write database queries rather than utilizing the functions available in the API to build the menu structure. You can look at any contrib module that requires custom menu structure for examples. Superfish and MegaMenu would give good guidance.

The option I would suggest is keeping your own fork of the Twitter Bootstrap code that is customized for your Drupal site. If you utilize git to do this and keep patches of your customizations, you shouldn't have a problem merging in any future updates to Twitter's code.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.