Return to previous page

Woocommerce cart coupon code translation and styling

This topic has 5 replies, 3 voices, and was last updated 8 months, 2 weeks ago ago by Andrew Mitchell

Chiche Solene

Participant

April 5, 2024 at 20:35

Hello 8Theme !

I’m a bit stuck here, as I am trying to modify on Elementor the styling of the XStore Cart Page (default) element. It seems there are two issues:
– Even though on Loco Translate the translations to FR are here (see enclosed screenshot), it won’t translate both “coupon code” and “clear shopping cart”. Is it possible to change also the “OK” button ?
– For the coupon code area, I can’t manage to find where I can adapt the styling, nothing is available in the element styling area 🙁

Thanks for the help.
Best,
Solène

Files is visible for topic creator and
support staff only.

#390311 Copied Theme version: 9.3.4

4 Answers

Tony Rodriguez

Support staff

April 6, 2024 at 13:49

Hello, @Chiche Solene,

Thank you for contacting us and for using XStore.

To solve your issue, please read this topic: https://www.8theme.com/topic/how-to-translate-the-limiter-in-the-image/

We hope this helps. Should you require any further assistance, please do not hesitate to reach out.

Best Regards,
8Theme’s Team

#390365 Copied

Chiche Solene

Participant

April 6, 2024 at 14:27

Hello,

Thanks for the translation issue.
Although, how now do you change the stylings ?
Best regards,
Solène

#390369 Copied
Tony Rodriguez

Support staff

April 6, 2024 at 16:02
Hello, @Chiche Solene,

Thank you for your response.

If you wish to change the stylings of the coupon code area on the cart page, Please add the next code in XStore > Theme options > Theme custom CSS > Global CSS and publish it.
```
.woocommerce-cart .coupon input[type=text] {
    width: 100%;
    padding-right: 41px;
height: var(--et_inputs-height, 2.642rem);
    line-height: 2rem;
    padding: 0 1.07em;
border: 1px solid var(--et_inputs-border-color, var(--et_border-color));
    background-color: var(--et_inputs-bg-color, var(--et_white-2-light-dark));
    border-radius: var(--et_inputs-border-radius, 0);
     color: #f11212;
    font-size: 1.14rem;
    text-align: start;
}

.woocommerce-cart .btn:not(.black):not(.active):not(.bordered):not(.style-custom){
    font-weight: 400;
    text-transform: capitalize;
    border-style: none;
    color: var(--et_btn-color);
    background-color: var(--et_btn-bg-color);
    border-color: #f1ea0b;
}

/* for hover */
.woocommerce-cart .btn:not(.black):not(.active):not(.bordered):not(.style-custom):hover {
    color: var(--et_btn-color-hover);
    background-color: var(--et_btn-bg-color-hover);
    border-color: var(--et_btn-br-color-hover);
}
```
Please note that you may change the above CSS code values as per your requirement as per your requirement.

We hope this helps. Should you require any further assistance, please do not hesitate to reach out.

Best Regards,
8Theme’s Team
#390378 Copied
Andrew Mitchell

Support staff

April 8, 2024 at 17:30

Dear Chiche Solene,

We hope you’re reveling in the experience our theme brings! Your enthusiasm is what fuels our passion. Would you be so kind as to channel that energy into a 5-star rating on ThemeForest? Your feedback is the spark that lights our way!

Click here to spread the love: https://themeforest.net/downloads

Thank you for being an integral part of our journey!

Best Regards,
The 8Theme Team

#390698 Copied
Tagged: styling woocommerce templates, translation woocommerce templates, woocommerce cart coupon code, woocommerce coupon code styling, woocommerce translation services, wordpress woocommerce customization
Viewing 5 results - 1 through 5 (of 5 total)

The issue related to '‘Woocommerce cart coupon code translation and styling’' has been successfully resolved, and the topic is now closed for further responses

Woocommerce cart coupon code translation and styling

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection