Woocommerce shop page menu item.

Just to let you know, I still can’t access your site. I’ll await further instruction.

Hey,

Yes, I’m based in the UK. If you could whitelist my IP that would be great: 86.130.33.198

Thanks,
Sebastian

Thanks,

Whitelisting me didn’t work unfortunately, but I was able to access your site via a proxy.

Your shop menu item is blue because you have a selector in the General _2 folder called Menu item 66 link _2 which sets the color and background. This is the code is generates:

/** General _2 >> Menu item 66 link _2 **/

#menu-item-66 > a {
	color: rgb(255, 255, 255) !important;
	background-color: rgb(114, 12, 223) !important;
}

If you delete that selector it should solve your issue.

After reviewing your other selectors, I have a tip for you; it’s possible to target multiple elements, like multiple menu items in your case, using a single selector. The targeting video, available from via MTs Help menu, shows how at the 6:45 mark: https://youtu.be/sEP3nUpbF-0?t=6m41s

My recent answer to another customer’s issue might be useful to read too, as it explains how to identify when an element has already been targeted with a selector by looking for a green + or blue numbers in targeting mode: https://themeover.com/forum/topic/microtheme-was-working-perfectly-on-the-site-then-it-stopped-working/

I hope that helps. Please let me know if you need further assistance.

Hey Ron,

I see that you have tapped into Microthemer’s feature for limiting the scope of a selector to a single page. And this works quite well for highlighting the currently active menu item, when following your method of creating an individual selector for each menu item. Your About page for instance has a page id of 67 and a menu item id of 76. And so you are able to style the About menu item in a particular way when the user is on the About page using the following CSS selector generated by Microthemer:

.mt-67 #menu-item-76 a

However, the Shop page is an outlier. It is an archive page for product posts, and so doesn’t have its own page/post id. So Microthemer can’t add an .mt-123 class to the body tag. And in turn, you can’t target the Shop menu item using the same kind of selector as shown above.

Having inspected how WordPress updates the classes for the active menu item on your site, I think the following selector should work in all cases, not just for the shop menu item:

.current-menu-item a

You can look for the that selector when targeting e.g. the Shop menu item while on the Shop page. This will probably be one of Microthemer’s Targeting suggestions (with the advanced targeting options expanded in targeting mode).

Or, you could add a custom selector to your current folder via the selectors menu in the top left, adding the above code to the Code field.

I recommend disabling your previous selectors (that target individual menu items) once you’ve confirmed that the current-menu-item selector works for the Shop menu item (by hovering over the selector in the selectors menu and clicking the disable icon on the right). As it should also work for all menu items. And it’s nice to have a single selector target everything you want if at all possible. That way, if you want to change the background color or text color, you would only need to change this in one place.

Does that make sense?

If not, I would be happy to demonstrate by example. Please send access details via our secure contact form and I will show you via a quick video.

Cheers,
Sebastian

You’re welcome Ron. I’m glad we cracked it in the end!