Reply To: UX improvement?

[Andy]

It should be possible with CSS. Add the following in Additional CSS

@media screen and (max-width: 768px) {

    ul.products li.product {
        padding-bottom: 10px;
    }

    ul.products li.product .woocommerce-loop-product__title {
        position: relative;
        margin-bottom: 40px !important;
    }

    ul.products li.product .woocommerce-loop-product__title:after {
        position: absolute;
        background: orange !important;
        color: #fff;
        content: "VIEW";
        top: auto;
        bottom: -10px;
        left: 15px;
        height: auto;
        padding: 5px;
        text-align: center;
    }

}

This will put a “VIEW” button directly below the product name, on devices with a browser width below 768px.