Return to previous page

Adjusting Quantity and Add to Cart Buttons On Shop Page

This topic has 5 replies, 2 voices, and was last updated 8 months, 1 weeks ago ago by Liva

Liva

Participant

August 21, 2023 at 19:25

Hi,

Currently, quantity bar and add to cart button are next to each other on the same line (https://prnt.sc/bxZ6T_V0IRsd), which forces them to look too tight. Is it possible to add another line to the bottom and move the “add to cart” button to that line, so that both quantity bar and “add to cart” button will have enough space? Here is a sample photo which I made with Photoshop: https://prnt.sc/bxdc2CUhr-p7

You can see admin info in private content area. Thanks in advance for your efforts.

Please, contact administrator
for this information.

#365185 Copied Theme version: 9.1.13 WooCommerce version: 8.0.2

4 Answers

Tony Rodriguez

Support staff

August 22, 2023 at 08:34

Hello, @Liva,

Thank you so much for purchasing our theme and contacting our support center.

We are pleased to inform you that the issue you reported has been successfully resolved. We kindly request you revisit your site after clearing your browser cache.

For your information, we have incorporated the necessary CSS code under the following path: XStore > Theme Options > Theme Custom CSS > Global CSS.

Please refer to the image provided at the following link for further reference: https://imgur.com/FzXEP1c , https://imgur.com/OyXZP3v

Should you require any further assistance, please do not hesitate to contact us.

Best Regards,
8Theme’s Team

#365207 Copied

Liva

Participant

August 22, 2023 at 18:27

Hi,

Thanks for the solution. Is it possible to change the shopping bag icon to a custom text “SEPETE EKLE”, which means “add to cart” in Turkish. Also, the button is not centered and its position changes depending on the screen size and zoom rate (https://prnt.sc/KKT9LdS_AZ-u , https://prnt.sc/h1O_VcG4_i-Z). Can we put that in the center so that it will stay on the center responsively? Finally, the solution does not affect the view on mobile or tablet, https://prnt.sc/IWyXDI8kTIF2 . Can we fix that?

I really appreciate your efforts and hard work. Thanks a lot.

#365295 Copied
Tony Rodriguez

Support staff

August 23, 2023 at 09:54
Hello, @Liva,

We are pleased to inform you that the issue you reported has been resolved. We kindly request you revisit your site after clearing your browser cache.

The necessary CSS code has been added under the following path: XStore > Theme Options > Theme Custom CSS > Global CSS.

Please refer to the following screenshot for the result: https://postimg.cc/vxGt4pc6

The CSS code added is as follows:
```
@media screen and (min-width: 992px) {
.content-product .quantity-wrapper {
    display: block !important;
}
.content-product .product-details .add_to_cart_button {
    top: 10px !important;
    width: 34% !important;
    right: 2px !important;
}
.content-product .quantity-wrapper .button:before {
    content: 'SEPETE EKLE' !important;
    font-size: 1rem;
}
}
```
Please note that you can adjust the width in the aforementioned CSS code as per your requirement.

Should you have any further queries or require additional assistance, please do not hesitate to contact us.

Best Regards,
8Theme’s Team.
#365361 Copied
Liva

Participant

August 23, 2023 at 10:42

Thank you so much for the solution and your efforts. You are the best!

#365384 Copied
Tagged: add to cart button, adjust quantity, improve woocommerce functionality, shop page customization, woocommerce themes, wordpress ecommerce solutions, wordpress shop page
Viewing 5 results - 1 through 5 (of 5 total)

The issue related to '‘Adjusting Quantity and Add to Cart Buttons On Shop Page’' has been successfully resolved, and the topic is now closed for further responses

Adjusting Quantity and Add to Cart Buttons On Shop Page

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection