active-trail expanded menu only on main menu

Hi kleinmeyl,

Would you mind providing the URL to the affected site so that we can go in and take a look?

Thanks!

 

Best regards,

teblick2.drupalgardens.com

Hi kleinmeyl,

I took a look at your site, and found that you have not enabled your Dutch parent menu items to be expanded as shown in this screenshot:

https://skitch.com/e-stacywray/g6u44/edit-menu-link-teblick (expanded)

In addition, you can style a: active for menu items as shown here within the Styles tab of ThemeBuilder:

https://skitch.com/e-stacywray/g6u4s/dutch-navigation-menu (active links)

Let me know if this helps!

Thanks!

 

Best regards,

I've made the menus expanded as you proposed.

BUT still nu active class is added to an active menu item.... only the class expanded, which applies to all li with submenu's... See printscreen (with firebug detail) on this link http://www.isabeldesmet.be/Schermafbeelding2012-02-06.jpg

AND in fact I do not want a dropdownmenu or the arrow in the upper right corner, I"m trying to hide it through css, but this doesn't seem to work.

Hi kleinmeyl,

Thanks for the screenshot which is always helpful.

We're looking into this a bit more, and we'll post back here when we have more information for you.

Thanks!

 

Best regards,

Hi kleinmeyl,

Just to clarify, if you do not want expandable dropdown menus with the arrows, you just need to disable or uncheck the "expanded" box within your main menu settings (Admin > Structure > Menus). Once the dropdown menus are disabled, the arrow should disappear as well.

As for the active classes, are you referring to the active hover state for the menu links, or are you referring to the menu "breadcrumb" trails?

Thanks for any additional information.

 

Best regards,

I activated the expanded menus because you adviced so....

But, indeed, I do not want expanded menus.

 

What I main with active state is the following:

 

Menu structure DUTCH:
- Onze producten (main menu)
----- HVAC (submenu)
---------- Industriële ventilatie (subsubmenu).

 

When a submenu or subsubmenu is active the parent main menu item should have an active state !

Hi kleinmeyl,

I apologize for any misunderstanding.

In this case, the active state that I believe you're referring to is actually the "hover:" style, instead of the active style as shown in this screenshot:

https://skitch.com/e-stacywray/8yub8/active-links

If you want to hover on the submenu item and simultaneously have the parent item with the same hover style, you would need to paste the following code snippet into your CSS. Keep in mind that this code refers to the "Onze producten" menu item which is referenced in the CSS as menu-link-3661:

.menu-link-3661: hover {

background-color: green !important;

}

I would highly recommend the following tutorial on Dropdown menus in Drupal Gardens which you may find extremely helpful. It was written by a colleague in Gardens Engineering. The tutorial goes over styling active menus and gives you insight into styling other aspects of your menu as well, plus it includes various screenshots and examples to illustrate the concepts.

Hopefully this information can be a great resource and help lead you in the right direction!

 

Best regards,

In fact I do not want a dropdown menu!! I just want the Dutch menu to be exactly the same as the English menu... I have hided level-2 menus now.

 

The English one give a active state to the main menu when the you are in a submenu

http://www.isabeldesmet.be/Schermafbeelding%202012-02-13%20EN.jpg

 

the Dutch one does not

http://www.isabeldesmet.be/Schermafbeelding%202012-02-13%20NL.jpg

 

Hi kleinmeyl,

Here is the beginning of the CSS for your site that you will need to paste into your Custom CSS tab. You can see that I've added the elements for two of the menu tabs below as an example of how you would handle the remaining tabs. What basically needs to be done is:

• Using Firebug, get the page node class for each submenu page (left sidebar). Get this from the body tag.
• Add it's corresponding main menu link class.
• Put them in a list separated with commas and add the background color.

/* Styles For Bedrijf Menu Tab */

.page-node-571 .menu-link-3931, .page-node-566 .menu-link-3931 { background-color: #ef3e42; } 


/* Styles For Diensten Menu Tab */

.page-node-576 .menu-link-3951, .page-node-581 .menu-link-3951, .page-node-586 .menu-link-3951, .page-node-591 .menu-link-3951, .page-node-596 .menu-link-3951, .page-node-601 .menu-link-3951, .page-node-606 .menu-link-3951, .page-node-611 .menu-link-3951, .page-node-616 .menu-link-3951, .page-node-626 .menu-link-3951, .page-node-621 .menu-link-3951 

{ background-color: #ef3e42; }


/* Styles For Onze producten Menu Tab */


/* Styles For Klanten Menu Tab */

Onze producten has around 25 page nodes that are under the main parent tab that you will need to add.

Hopefully this will be a good starting point for you, and be sure to keep us posted on how it's turning out.
Thanks!


Best regards,

This is a solution, but is a so NOT open source solution, NOT automatically....! With this solution, my client has to contact me each time a new product is made, to add the menu style in the css.... !!! This is not a professional option.

I work with Drupalgardens, because my client requested this.

I have been trying work around since then, to overcome problems that are normally - with a Drupal installation - no problem.  For example

• no translation of blocks
• no translation of menus
• no view slideshow
• ...

For this specific problem I use normally Block Menu module, maybe this is a good suggestion to add to Drupal Gardens ?

Hi kleinmeyl,

Your suggestion for the Block Menu module is duly noted, and I have added your vote to the existing request we have for this feature, tracking internally at DG-3126.

In the interim, we have spent a considerable amount of time figuring out a CSS solution for this issue that will definitely work, although it is not a convenient option for your client. We realize this; however, creating custom JavaScript or PHP code to resolve the problem is out of the scope of services that we offer within Drupal Gardens.

We have continued to try to find a script that could do what you are asking. We have found a few scripts that would add a class when on the parent page. The problem comes in when you navigate to items that are in the sidebar. All the scripts we have found use the anchor tags and compare against the URL. If the anchor contains a path that is the same as the URL, a class can be added to the anchor tag. The sidebar sub-menus on the teblick2 site have their own URL paths. So the production page has this path > http://teblick2.drupalgardens.com/nl/onze-producten, but the piping has this path > http://teblick2.drupalgardens.com/nl/piping. Because onze-producten isn't in the URL path, the anchor no longer has the class that we try to attach.

Based on your comments above, we realize that you may be feeling constrained by the limits of Drupal Gardens as compared to self-hosting your site and working in a stock, Drupal 7 installation. We can understand this. If your client wishes to remain in Gardens, the above CSS solution will resolve the issue. This may mean that your client will need some Firebug tutorials along the way in order to update the CSS themselves.

Another option is to host the site outside of Gardens, and then have a developer write some quick, and easy PHP code for the backend.  You would also have access to the Block Menu Module as you've mentioned above.

When we have any status update with regard to the Block Menu module feature request, we'll be sure to post back here within this thread.

Thanks very much.

Best regards,