Responsive!

As you can see on this screenshot – http://prnt.sc/11tphdx, when I try to add an item to the cart, add to cart button is not visible at the first point, it is there but the user will have to scroll to see the add to cart button.

Normal users don’t know that they will have to scroll to see the add to cart button, they complained that they thought they can’t add the item to the cart.

The problem appears when the product view is 4*4(4 column) and product has a description.

Can you please suggest how do I make the add to cart button visible without needing to scroll down.

Hello,

The only way to make the button always seen is to hide some elements. Try to add the following code snippet to the Custom CSS area in Theme Settings to fix this issue.

.product-grid-item.col-md-3 .quick-shop-wrapper .variations .label,
.product-grid-item.col-md-3 .quick-shop-wrapper .woocommerce-variation-description{
	display: none;
}
.product-grid-item.col-md-3 .quick-shop-wrapper .quick-shop-form {
  padding-top: 40px;
}
.product-grid-item.col-md-3 .quick-shop-wrapper .variation-swatch-selected .variations {
	margin-bottom: 35px;
}

Kind Regards

It worked, thanks!
Another problem that I am facing is – When the product view is 4 column, there is no way I can make the full product title visible. Here last product’s title is – “Aachi Masala Chicken Manchurian 200G” http://prnt.sc/11xa6qk but as the product title limit is one line, it doesn’t display the full title, and If I select the product title limit as two lines then it mess with the design – http://prnt.sc/11xaguv

Can you please suggest solution?

Try to add the following code snippet to the Custom CSS area in Theme Settings to fix this issue.

body .product-grid-item .product-title {
	line-height: 18px;
	min-height: 36px;
}

[Author]

Posts