[Support request] Woocommerce questions

[Leon]

Hi! I have a two questions about the woocommerce page:

How can create a button under every product with the text more information. When customers click on this button they have to go to the product. I already deleted the add to cart button.

Second question
How can make I create space between the the title of the product and the border:
See screen

[Leon]

Also how to reduce the space between the picture and the title, the button needs to go under the title of the product :).

[Tom]

You could try this:

add_action('woocommerce_after_shop_loop_item','replace_add_to_cart');
function replace_add_to_cart() {
    global $product;
    $link = $product->get_permalink();
    echo '<a href="' . esc_attr($link) . '" class="button">Read more</a>';
}

As for the space, can you link me to the page?

[Leon]

Hi Tom, thank you for answers. I building the website offline. I got the button working.
Only thing I still want is a little space between the title and the line under of the border. And also it is possible to change the size of the related products title? This is too big, can I make the text smaller? Thanks again!

[David]

Hi Leon,

to reduce the space between image and title (on the shop loop) you can use this CSS – be careful to much negative margin and the title will hide behind the image:

.inside-wc-product-image {
    margin-bottom: -30px;
}

The related products title (on single product page) is set to H2 and can be adjusted in the Customiser > Typography > Content.

Targeting just this title using CSS will be a little tricky.

David

[Leon]

Thank! I still need a little bit of space after the title of the product and the under line of the border. I hope you understand my question. I want a little bit of space between Bottom line and the product title.

[David]

Try:

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

[Author]

Posts