How to change or remove the white bar appearing in my cart?

How to change or remove the white bar appearing in my cart?

IvanW34
Visitor
1 0 0

Screenshot 2024-02-18 7.51.58 PM.png

How do change the color of the white bar or get rid of it completely. It only happens when i add an item to the cart Thank you.

Replies 3 (3)

Dan-From-Ryviu
Shopify Partner
11579 2268 2447

Hi @IvanW34 

It is a checkout button, but you set the button's background color, and the text is white, so you see it like that.  

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...
Sign up now.

JoesIdeas
Shopify Partner
2499 229 673

Go to your Theme settings and take a look at the colors in the checkout settings. Change the color of the button or text, that will be a quick fix so it's not a blank button. Also gives the customer the option to go to checkout now, it's always good to have an easy way to check out.

 

To remove it completely, the easiest way is to hire a developer, it would be a quick fix for someone familiar with Shopify, and it's good to have someone on hand for future edits.

 

But if you prefer to do it yourself, here's my recommended workflow:

1) In the theme editor, duplicate your live theme, then work in the new theme (prevent editing the live site)

 

2) Find the code you want to edit. You can either use a browser tool like Chrome Dev Tools, or you can read the relevant files in your theme (start with Theme.liquid and look at the included files, depending on where your screenshot shows up determines where you look. If it's on product page, start with Product.liquid. If it's on every page, start with Theme.liquid)

 

3) Comment out the code that you believe is showing that button, then refresh the preview to confirm that was it.

 

4) Publish the theme.

 

Some resources to help you if the steps above are not clear:

 

-> Editing your theme: https://speedboostr.com/how-to-safely-edit-your-shopify-theme/

 

-> Shopify Liquid documentation: https://shopify.dev/docs/api/liquid

 

• Creator of Order Automator [auto tag, fulfill, connect FBA, daily jobs]
• Co-Creator of Product Automator [suite of features for products / collections]
• Shopify developer for 10+ years, store owner for 7 years
• Blog: Shopify Tips, Guides, and Automation Tactics

magenest
Shopify Partner
162 12 25

Hi @IvanW34,
Your button's text and background seem to be both white, which causes that situation. You can customize it by using the CSS or config it directly in the Shopify Theme Editor (most themes allow you to do so).

If you need further help, just drop your store URL and password (if any), and we will be happy to help you with any of your questions.

Can you share with us your store URL and password (if any) so our team can check on that? We would love to provide you with a solution for your issues.

Magenest - One-stop Digital Solution Provider
- Don’t forget to drop a thumbs-up and Mark it as a Solution if you find our response useful
- Elevate your online business with our Shopify experts and professional designers