"WooCommerce Product Categories:" - Change text to buttons??

Travelify
1

Hello again,

I am not sure if this is within the theme, or perhaps WooCommerce itself, but I hoped you might know the answer.

If you go to: http://xtremewheelbrokers.com/wheels/

You will notice the right sidebar widget “WooCommerce Product Categories” labeled “Choose a brand:”

As you can see, each brand name (these are product categories listed in WooCommerce) is shown as a blue text link. I was wondering if it is possible to change those from a text link, to a tab. Very similar to how the Main Menu Nav Bar up top has a tab for each page selection and when you mouse over them they highlight.

i.e. & please note this is not a wordpress site:

elementwheels.com

On the left you can see “WHEEL BRANDS” and each one is shown as a tab which highlights upon mouse-over.

Thanks!

2

This is a basic idea how it can be done but of course you will have to tweak it on your own:

.widget_product_categories ul li a {
    padding: 5px;
    height: 26px;
    display: block;
}
.widget_product_categories ul li a:hover {
    background: #ccc;
    color: #186CBF;
    text-decoration: none;
}
.widget_product_categories ul li {
    background-image: none;
    padding-left: 0;
}
3

Thanks! This worked perfectly. You rock.