Product title (wecommerce)

[friedrichfotografie]

Hi! At the moment I can only see the product title when I do a mouseover over the product image. Is it possible to place the title below the image?

[SeaTheme]

Hi there,
Welcome to SeaTheme forum.
It is not possible to move title only below the image.
It is possible to move all text(title, price, add-cart)by custom CSS(“Appearance > Customize: Additional CSS”):

.product-caption {
    position: relative;
    z-index: 1;
    left: 0px;
    top: 0px;
    bottom: 0px;
    right: 0px;
    opacity: 1;
    background-color: transparent;
}
.product-caption h3, .entry .product-caption h3{
  font-size:1.2em;
}
.product-caption-inn .price {
    font-size: 0.8em; 
}
.product-caption-inn.middle-ux {
    position: relative;
    top: 0;
    -webkit-transform: translate(0,0);
    -moz-transform: translate(0,0);
    -ms-transform: translate(0,0);
    transform: translate(0,0);
}

---

Regards!
SeaTheme – FAQs – Twitter – Facebook

[friedrichfotografie]

Thats awesome, thanks!
But is it possible to hide those too elements?

[SeaTheme]

Welcome!

Please add custom CSS:

.woocommerce .product-caption a.button.add_to_cart_button,
.product-caption-inn .price {
 display: none;
}

---

Regards!
SeaTheme – FAQs – Twitter – Facebook

[friedrichfotografie]

Thank you so much!
Another question would be how to put more space between the title and the image? ATM its too close…

And also now I can not longer click on the image to get to the product page. Can we make the image clickable again?

[SeaTheme]

Please send your shop page URL, thanks!

---

Regards!
SeaTheme – FAQs – Twitter – Facebook

[friedrichfotografie]

This reply has been marked as private.

[SeaTheme]

1. Please paste the custom CSS code to “Appearance > Customize: Additional CSS”:

.main-list .product-caption-title {
    margin-top: 15px;
}
.product-item .inside {
    cursor: pointer; 
}

2. To add link for image:
It needs to add custom JS code(how) by a 3rd plugin – ” Simple Custom CSS and JS”, refer to -> https://doc.seatheme.net/general-topics/how-to-custom-a-wordpress-theme/#javascript-codes

Add the JS codes in the plugin:

jQuery(document).ready(function( $ ){
     $('.main-list-item .inside').on('click', function(){
       var link=$(this).find('.prouduct-item-a').attr('href');
       window.location.href = link;
     })
});

---

Regards!
SeaTheme – FAQs – Twitter – Facebook

[friedrichfotografie]

This reply has been marked as private.

[SeaTheme]

This reply has been marked as private.

[Author]

Posts