How Can I Style The Free Shipping Text On The Cart Page?

Are you referring to the calculation for Free Shipping text?

https://loom.com/i/4bec3f3c5ad8484fb8e15db94c07a155

If you are, then you would use something like this

.devnet_fsl-free-shipping h4{
    font-size:30px !important;
    text-transform:capitalize;
}
.devnet_fsl-free-shipping span{
    color:red !important;
}

@serafinnyc thanks for the quick response. No I’m trying to edit just the text when the free shipping option appears in the list of other shipping options. in the pic attached, I’m trying to edit the circled text.

I want to make it stand out by changing it to the same color green as the prices.

Ah got it. So, go into your Shipping Methods and instead of calling it Free Shipping change it to whatever.

https://loom.com/i/64530b58719e4d178c2f7085a9faf999

I just want to change the color of the text to green and make it bold, sorry for the confusion. I tried the following but it changed all the shipping options text instead of just the free shipping.

.woocommerce-js ul#shipping_method li label {
    color: green;
}

Oh you said you wanted to change the text. That would have to be hooked with a custom hook that shows instead of what’s there. You could use a first-child but then when Free Shipping isn’t available whatever’s first would be green. Let me know.

Here you go

#shipping_method label[for=shipping_method_0_free_shipping6] {
    color: green !important;
}

I’m just following up with you @mfghost Did this help?

i didn’t even see that until just now. I went into shipping settings on WC like you said & made the text all capital but I’ll try this soon as I get home. Thank you.

Thanks for the update. Ya for changing the text you can do that. I misunderstood there. However, that css snippet should take care of the color. Worked for me in console.

ok cool I appreciate it big time. Soon as I get home I’ll try & let you know if it worked.

@serafinnyc works perfectly bro, thank you! I tried every which way but never put the brackets on either side, that has to be what I messed up. I appreciate it man, thanks!

Awesome @mfghost ???? solid. If you’re all set then please reply back and check the resolved box so the team doesn’t have to review. Thank you.

gotcha, thanks again.

Welcome