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

Solved

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

MMast
Trailblazer
182 1 26

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
512 86 80

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;

}

 

★ Looking for Dedicated Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 MONTH!
★ Get skilled Shopify developers at BUDGET-FRIENDLY RATES — explore Novajetsoft.com for a rapid quote!
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
512 86 80

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>

 

 

★ Looking for Dedicated Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 MONTH!
★ Get skilled Shopify developers at BUDGET-FRIENDLY RATES — explore Novajetsoft.com for a rapid quote!
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
512 86 80

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;

}

 

★ Looking for Dedicated Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 MONTH!
★ Get skilled Shopify developers at BUDGET-FRIENDLY RATES — explore Novajetsoft.com for a rapid quote!
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
Trailblazer
182 1 26

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

TerenceKEANE
Shopify Partner
512 86 80

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>

 

 

★ Looking for Dedicated Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 MONTH!
★ Get skilled Shopify developers at BUDGET-FRIENDLY RATES — explore Novajetsoft.com for a rapid quote!
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
Trailblazer
182 1 26

Thank you thank you!

TerenceKEANE
Shopify Partner
512 86 80

You're most welcome 😉

★ Looking for Dedicated Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 MONTH!
★ Get skilled Shopify developers at BUDGET-FRIENDLY RATES — explore Novajetsoft.com for a rapid quote!
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