Highlight the "Home" / "Blog" button while on main page

Question

I have been trying desesperately and in vain to highlight the button I have for "Blog" whenever I am in the the main page (I had created a custom link with my homepage)...it is really driving nuts!

The only time I have been able to highlight it was when I used the ".menu-item-has-children", but then it stays highlighted even when I enter other pages or menus (e.g.: "About" or "Archives").

Is there any way to solve this using just any CSS command or perhaps a conditional? I must say I am totally a zero with html and would like to avoid to use it (if possible, of course).

Many thanks in advance, Andreas

Answer 1

Wordpress marks the currently displayed page in the menu with CSS classes .current-menu-item, .current-menu-parent, .current-menu-ancestor. Add the required styles to highlight items using these classes.

Sample Menu:

* Blog
  * First Category
  * Second Category
* About
* Contact

When you open blog page, the corresponding menu item ("Blog") has a class .current-menu-item. Similarly, when you open a contact page, the corresponding menu item will have a class .current-menu-item.

if you go to the page second category, the menu item "Second Category" will have class .current-menu-item and "Blog" item will have class .current-menu-parent.

---

UPDATE (Highlight similar to hover)

To highlight "Blog" on your site when you are on the home page or one of the categories ("Music & Party", "Travel & Culture", etc.) add to styles:

.home #menu-item-1258 > a span, 
#menu-main > .current-menu-item > a span, 
#menu-main > .current-menu-parent > a span, 
#menu-main ul .current-menu-item, 
#menu-main ul .current-menu-parent { 
   background-color: #37cadd; 
}

Answer 2

You have to play with this CSS selector. I don't really know what do you mean by highlight, it may be a background in which case:

.home #menu-item-1258, .current-menu-item {
    background: blue;
}

If you want to elaborate, what do you mean by highlight, I can help you in case it's nothing crazy, or you can learn a bit of CSS and play with it.

In case you don't know how to add CSS, check this out.