Solved

How To Change Empty Cart Label For Cart Drawer (Dawn Theme)

MMast
Explorer
131 0 10

Thanks in advance!

I am looking to change the text from “your cart is empty” text to something different, how do I go about doing so? I tried changing it in the “default theme content” but nothing changed. Also, is there a way to increase/decrease text size? Example shown below.

How my site looks:

Screenshot 2024-04-17 194025.png

How I would like my site to look:

Screenshot 2024-04-18 095150.png

https://decemberschild.com/ 

password: dc

Accepted Solutions (2)

TerenceKEANE
Shopify Partner
363 68 59

This is an accepted solution.

Hello!

 

The following code will modify the font size. What would you like to replace "Your cart is empty" with?

 

Navigate to the 'Edit Code' option in your theme settings, then search for “base.css” in the search bar and add below code.

 

 

h2.cart__empty-text {

    font-size: 15px;

}

 

Our Website --- Looking for Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 month!
★ If I helped you, Please don't forget to Like and Mark Solution to the post that helped you.
If my support was a lifeline for you, The COFFEE   would be the anchor keeping me steady!
★ For Quick response --> WhatsApp | Email --> info@novajetsoft.com | Software Engineer - Specializing In Advanced E-Commerce Websites

View solution in original post

TerenceKEANE
Shopify Partner
363 68 59

This is an accepted solution.

The following code will do what you want. You can change the values as you like. If you encounter any issues again, feel free to write.

 

1) Navigate to the 'Edit Code' option in your theme settings, then search for 'theme.liquid' in the search bar.

2) Paste the following code above the '</head>' tag. Please refer to the attached screenshot for guidance.

 

shopify.head.jpg

 

<script>

document.addEventListener("DOMContentLoaded", function() {
    var emptyCartText = document.querySelector(".cart__empty-text");
    if (emptyCartText.textContent.trim() === "Your cart is empty") {
        emptyCartText.textContent = "Your cart is currently empty.";
    }
});

</script>

 

 

Our Website --- Looking for Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 month!
★ If I helped you, Please don't forget to Like and Mark Solution to the post that helped you.
If my support was a lifeline for you, The COFFEE   would be the anchor keeping me steady!
★ For Quick response --> WhatsApp | Email --> info@novajetsoft.com | Software Engineer - Specializing In Advanced E-Commerce Websites

View solution in original post

Replies 5 (5)

TerenceKEANE
Shopify Partner
363 68 59

This is an accepted solution.

Hello!

 

The following code will modify the font size. What would you like to replace "Your cart is empty" with?

 

Navigate to the 'Edit Code' option in your theme settings, then search for “base.css” in the search bar and add below code.

 

 

h2.cart__empty-text {

    font-size: 15px;

}

 

Our Website --- Looking for Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 month!
★ If I helped you, Please don't forget to Like and Mark Solution to the post that helped you.
If my support was a lifeline for you, The COFFEE   would be the anchor keeping me steady!
★ For Quick response --> WhatsApp | Email --> info@novajetsoft.com | Software Engineer - Specializing In Advanced E-Commerce Websites
MMast
Explorer
131 0 10

I would like the new text to say "Your cart is currently empty."

TerenceKEANE
Shopify Partner
363 68 59

This is an accepted solution.

The following code will do what you want. You can change the values as you like. If you encounter any issues again, feel free to write.

 

1) Navigate to the 'Edit Code' option in your theme settings, then search for 'theme.liquid' in the search bar.

2) Paste the following code above the '</head>' tag. Please refer to the attached screenshot for guidance.

 

shopify.head.jpg

 

<script>

document.addEventListener("DOMContentLoaded", function() {
    var emptyCartText = document.querySelector(".cart__empty-text");
    if (emptyCartText.textContent.trim() === "Your cart is empty") {
        emptyCartText.textContent = "Your cart is currently empty.";
    }
});

</script>

 

 

Our Website --- Looking for Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 month!
★ If I helped you, Please don't forget to Like and Mark Solution to the post that helped you.
If my support was a lifeline for you, The COFFEE   would be the anchor keeping me steady!
★ For Quick response --> WhatsApp | Email --> info@novajetsoft.com | Software Engineer - Specializing In Advanced E-Commerce Websites
MMast
Explorer
131 0 10

Thank you thank you!

TerenceKEANE
Shopify Partner
363 68 59

You're most welcome 😉

Our Website --- Looking for Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 month!
★ If I helped you, Please don't forget to Like and Mark Solution to the post that helped you.
If my support was a lifeline for you, The COFFEE   would be the anchor keeping me steady!
★ For Quick response --> WhatsApp | Email --> info@novajetsoft.com | Software Engineer - Specializing In Advanced E-Commerce Websites