Hello I've installed bootstrap 8.x-3.1 on a multilanguage site, but in the default main menu the home link is never active, when I'm in the home page the claass="is-active" won't appear.

Members fund testing for the Drupal project. Drupal Association Learn more


Skin created an issue. See original summary.

brahmjeet789’s picture

@Skinn : I've installed bootstrap 8.x-3.1 in main menu the home link is never active, because in li i am not able to find "active" class but "is-active" class is appearing but in li "active" class missing thats why the active property which is changing color and backgroung-color is not implementing on home screen for "Home" Menu .

Please refer to my Screenshot.

Skin’s picture

You are right, I'm going to modify my custom css and give a background color to the "is-active" class.

brahmjeet789’s picture

@skin: not to give backround color to is active you have to add active class in your li that is home that solves your problem

brahmjeet789’s picture

Status: Active » Fixed
brahmjeet789’s picture

Status: Fixed » Reviewed & tested by the community
markcarver’s picture

Title: Home link in main menu not active » Home in multilingual main menu does not get "active" class
Version: 8.x-3.1 » 8.x-3.x-dev
Status: Reviewed & tested by the community » Active

There is no patch.

That being said, this sounds like an issue with core more than anything. This base theme already applies the active class to the <li> element if the in_active_trail flag is set on the menu item: http://drupal-bootstrap.org/api/bootstrap/templates%21menu%21menu--main....

Considering that this is specific to a multilingual situation, perhaps trying https://www.drupal.org/project/menu_trail_by_path will allow this to work?

Skin’s picture

I tried with Menu trail by path , but I can see the active class only on the home link for the dafault language, other languages have the path prefix and in this case the class on the home link won't appear.

A temporary fix for me is to insert in a custom css this:

	.navbar-default .navbar-nav > li > a.is-active,
	.navbar-default .navbar-nav > li > a.is-active:hover,
	.navbar-default .navbar-nav > li > a.is-active:focus {
	  color: #000;
	  background-color: #ffc200;

The is-active class appears correctly on active links.

markcarver’s picture