Keep the menu links active when selected

This already happens by default—see the demo theme page. For example, if you go to Layouts > Full width, “Layouts” is in a different colour.

Hi
@electricfeet, thanks for your feedback.
I can see that the main menu is configured like that. But if i create a custom Menu and put it in a widget area that doesn′t happens.

For example:

https://demo.themesandco.com/layout-test/

if you click in the recent posts, the link that you click doesn′t stay selected so the user know were he is.
Is there any way to accomplish this?

Thanks.

Out of my depth here on how WordPress works. I have a separate “blog” page and all my posts get tagged automatically in such a way that I can highlight the “blog” item on the menu. (WordPress knows “where the user is” and gives the menu items classes of “current-menu-item” and “current-menu-ancestor” etc., so you/the theme can style a menu item to be a different colour accordingly.)

Also pages get tagged in this way.

When the blog is on the main page, however, WordPress doesn’t seem to indicate “where the user is” for a random post. The only thing that I can think is that you could add them manually when you write the posts (via screen options), but that seems a bit Heath-Robinson.

Where is your blog? On the front page or a separate page? How would you define “where the user is” for a post accessed from the front page?

For pages, I note that if you make the pages “children” of a parent page (Edit a page > Page attribute > Parent > choose a page) then it picks up the classes in order to be coloured—maybe this is all you need…

Hi
@electricfeet, thanks again for your feedback.

I send you a image link that possibly explains what i need.

The link História is clicked but does not assume a diferent color.
Can you please point me the directions to accomplish this effect?

Thanks again!.

I have a site using twentytwelve which uses this to achieve your aim (my color scheme):

.main-navigation .current-menu-parent > a,
.main-navigation .current-menu-item > a,
.main-navigation .current-menu-ancestor > a,
.main-navigation .current_page_parent > a,
.main-navigation .current_page_item > a,
.main-navigation .current_page_ancestor > a {
  color: red;
  font-weight: bold;
  opacity: 1;
}

Can’t translate this to Czr without a link to your site.

Hi,

@rdellconsulting, you saved my day!!!

/*left menus*/
.menu-<strong>empresa</strong>-container .current-menu-item  {
  background:#ddd;
  font-weight: bold;
}
.menu-<strong>nutricao_menu</strong>-container .current-menu-item  {
  background:#ddd;
  font-weight: bold;
}
.menu-<strong>laboratorio</strong>-container .current-menu-item  {
  background:#ddd;
  font-weight: bold;
}

Had to do to the three menus i created (the ones that are in bold.
Thanks a lot @electricfeet and @rdellconsulting.

One drink on me! Cheers!!!

Ups! the is not supposed to be inside the code!

/*left menus*/
.menu-empresa-container .current-menu-item  {
  background:#ddd;
  font-weight: bold;
}
.menu-nutricao_menu-container .current-menu-item  {
  background:#ddd;
  font-weight: bold;
}
.menu-laboratorio-container .current-menu-item  {
  background:#ddd;
  font-weight: bold;
}