Are you looking to take out the outline (dotted or otherwise) from around menu (and other) links in your WooCommerce store – these links show up on click briefly, and look like this:
Storefront added a host of accessibility features a while back – in version 1.4 – which specifically included adding these features to improve the experience for visibly impaired visitors.
But what if you’d like to remove these borders, which form a “box” around your menu?
The snippet below, when added to your custom CSS (either in a child theme, or HINT using the Theme Customizations plugin) will remove this box:
Remove the box around menu items in Storefront
What its doing – breaking it down
This code here is CSS, and its telling browsers to override (!important) any other rules they have been given about this “outline” on the “focus” event (i.e. when links are clicked). Specifically, we’re setting “outline” to “none”.
Worked for you?
Leave a comment below if this helped you today!
Get Silicon Dales to do it
If you’ve got WooCommerce problems, and you run a medium or larger business website on WordPress with WooCommerce, then you may be interested in our WooCommerce development services.