WordPress – Add a new class to an element on same template-page.php depending the active page? [closed]

I create a custom template “page-products.php” for all my products page.

Inside of this template, i have a horizontal menu with 8 items. example capture of the menu

When i’m on the page of the current product, i would change the back-ground color of the element menu.

Any ideas to add a new class on an element when on the current page ?

I would like to avoid to create 8 differents template for each different product.

Answer

If your theme uses body_class() on the body – you can style from the body class down to the element. In my example .page-8 is on the body-tag and .menu would be the menu.

.page-8 .menu {background-color: red;}