Editing The Top Section For The Cart Page

Hello, @TFS,

1. For changing those words, you have to change in the theme language files, you can use the Loco translate plugin for it, https://www.8theme.com/documentation/xstore/theme-translation/base-theme-translation/

Like:

https://postimg.cc/gwW7VC5L
https://postimg.cc/jwkvFm8X
https://postimg.cc/JyYbrJb7
https://postimg.cc/yWZFKDWB
https://postimg.cc/VJYMX4gL

2. For changing the color and placing the image, we have to check it on your site, and we need your site WP Admin URL and Credentials in the private content area of this topic and the screenshot as well what exactly you want?

Regards 8Themes Team.

Hello, @TFS,

1. Yes it will only change the words and will not affect anything else.
And yes Loco translate is the language plugin.

2. Points listed below:

2.1: Space the words a little down from the menu bar.

You can use the below given CSS code under XStore >> Theme Settings >> Theme Custom CSS >> Global and it will work for you like this: https://postimg.cc/dLyZvc7T

.cart-checkout-nav {
    padding: 5vw 0 !important;
}

2.2: Unfortunately this is not possible to place the logo before those words, there is no such option for it.

2.3: Make the color something different for the background such as black.

You can use the below given CSS code under XStore >> Theme Settings >> Theme Custom CSS >> Global and it will work for you like this: https://postimg.cc/HczRVNVw

.cart-checkout-nav {
    background-color: #000 !important;
}
.cart-checkout-nav .active {
    color: #fff !important;
}

4.3.Change the text “You are out of time! Checkout now to avoid losing your order!” to something else.

You can change it from XStore >> Dashboard >> Sale Booster >> Cart/Checkout Pages: https://postimg.cc/p98dyrmt

4.4.Move the text of “shopping cart – checkout – order status” more to the right side.

You can use the below given CSS code under XStore >> Theme Settings >> Theme Custom CSS >> Global and it will work for you like this: https://postimg.cc/SJDzrs7h

.cart-checkout-nav {
text-align: right !important;
}

Regards 8Themes Team.

Hello, @TFS,

Unfortunately, there is no other way, The other way will be a hardcode in the theme core files but that will affect your site and also it will change after every update, so it’s not safe, the safest one is to change in the language files.

Regards 8Themes Team.

Hello, @TFS,

If you want to create the multilanguage site you need a special plugin for these purposes https://colorlib.com/wp/wordpress-multilingual-plugins/ Support of the plugin should guide you.

Regards

Hello, @TFS,

1. Please copy and paste the below given CSS code to XStore >> Theme Settings >> Theme Custom CSS >> Global CSS and check back your site after clearing the browser cache, you can change the color in the given code as per your requirements: https://ibb.co/61Vssc9

.cart-checkout-nav .active:before {
    color: green !important;
    background-color: yellow !important;
}

2. Please copy and paste the below given CSS code to XStore >> Theme Settings >> Theme Custom CSS >> Global CSS and check back your site after clearing the browser cache, you can change the color in the given code as per your requirements: https://ibb.co/37j2xqg

.cart-checkout-nav a {
    color: red !important;
}

3. Please copy and paste the below given CSS code to XStore >> Theme Settings >> Theme Custom CSS >> Global CSS and check back your site after clearing the browser cache, you can change the color in the given code as per your requirements: https://ibb.co/9vSc7Mm

.woocommerce-cart.special-cart-breadcrumbs.woocommerce-cart .woocommerce-message:first-child {
    background-color: red !important;
}

4. Please copy and paste the below given CSS code to XStore >> Theme Settings >> Theme Custom CSS >> Global CSS and check back your site after clearing the browser cache, you can change the color in the given code as per your requirements: https://ibb.co/CnFGfrW

.woocommerce-cart .cart-empty.empty-cart-block h1 {
    color: red !important;
}
.woocommerce-cart .cart-empty.empty-cart-block p {
    color: green !important;
}
.woocommerce-cart .cart-empty.empty-cart-block a.btn.black.wp-element-button {
    background-color: orange !important;
}

5. Unfortunately, this is not possible to change the color using the Custom CSS so this requires extra Customization.

6. Please copy and paste the below given CSS code to XStore >> Theme Settings >> Theme Custom CSS >> Global CSS and check back your site after clearing the browser cache, you can change the color in the given code as per your requirements: https://ibb.co/gy72KNk

.woocommerce-cart table.cart .product-details .product-title:hover {
    color: green !important;
}

7. You have to change/translate it into the Theme and WooCommerce plugin language files using the Loco Translate plugin: https://www.8theme.com/documentation/xstore/theme-translation/base-theme-translation/

8. Please copy and paste the below given CSS code to XStore >> Theme Settings >> Theme Custom CSS >> Global CSS and check back your site after clearing the browser cache, you can change the color in the given code as per your requirements: https://ibb.co/h276Nfj

.woocommerce-cart .actions.clearfix input.btn.wp-element-button:hover {
    background-color: green !important;
}

9. Do you want to change the color of that button OR the button hover background color?

10. Please copy and paste the below given CSS code to XStore >> Theme Settings >> Theme Custom CSS >> Global CSS and check back your site after clearing the browser cache, you can change the color in the given code as per your requirements: https://ibb.co/N9YCm43

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button.button.alt.wc-forward.wp-element-button {
    background-color: yellow !important;
    color: red !important;
}

11. Do you want to change the color of that button OR the button hover background color?

12. In order to solve your issue Simply navigate to Dashboard >> Static Blocks >> All Static Block >> Edit the Cart page block. See the image for a better reference: https://ibb.co/s5ts91X and edit it as per your requirements: https://ibb.co/Ns92WB5

Regards 8Themes Team.