Hi everyone and thanks a lot for your answers.
Finally, we have found a solution to apply a specific CSS class on the menu item link active based on the current page ID.
To do it, we just added this code in the CSS include of the theme :
.navbar-nav > li > a.active {
color: #f00;
}
The widget "Header Menu" compute the menu content and use the related ng-template "menuTemplate" to generate all menu items HTML.
So, in the menuTemplate ng-template, we have replaced
<a ng-if="item.items.length == 0 && !item.scriptedItems" ng-href="{{item.href}}" target="{{item.url_target}}" title="{{item.hint}}" >
<fa ng-if="item.glyph" name="{{::item.glyph}}"></fa>
<span ng-bind-html="item.label"></span>
</a>
By
<a ng-if="item.items.length == 0 && !item.scriptedItems" ng-href="{{item.href}}" target="{{item.url_target}}" title="{{item.hint}}" ng-class="{ 'active':item.href.indexOf('?id='+$root.page.id) >= 0 } ">
<fa ng-if="item.glyph" name="{{::item.glyph}}"></fa>
<span ng-bind-html="item.label"></span>
</a>
It works fine.
Regards
