[Support request] Woocommerce Widget styling

[Kim]

Hi, I’ve some questions concerning the styling of the widgets in woocommerce:

1. Category widget: The hierachie of subcategories in the category widget is not really visible. Is it possible to style this differently?

Category widget in GP
Category widget alternative

2. Product widgets: How can I increase the size of the product images in product widgets? Would it also be possible to move the images to the left? How can I add some line between the single lines

Product widget GP
Product widget alternative

Best regards
Maike

[David]

Hi there,

1. the default Woocommerce Widget has very little customisation options, nested child categories is not one of them. You would need a plugin like this:

https://en-gb.wordpress.org/plugins/wpb-accordion-menu-or-category/

2. Can you provide a link to your site so i can check the CSS required.

[Kim]

Hi David,

many thanks.

Please have a look at this site: Shop Example.

BR Maike

[David]

Try this CSS:

.widget_recently_viewed_products li,
.widget_recently_viewed_products li a,
.widget_products li,
.widget_products li a {
    display: grid !important;
    grid-template-columns: 60px auto;
    grid-gap: 5px;
}

.widget.widget_recently_viewed_products li a,
.widget_products li a {
    grid-column: 1 / -1;
}

.widget_recently_viewed_products span,
.widget_recently_viewed_products div,
.widget_products span,
.widget_products div {
    grid-column: 2;
}

.widget.widget_recently_viewed_products li a img,
.widget_products li a img {
    width: 50px !important;
}

[Author]

Posts