Shopify shopping cart – to show on all pages

Hi all,

I’ve managed to integrate the “ADD TO CART” button to my product page, but need the shopify shopping cart to show on all pages.
Have gone through a couple of older threads in here but can’t seem to find a solution.

Here’s a link to a WIP.
http://littlefear.webflow.io/sirens-01

If you ADD TO CART, then click on “little fear” up the middle to go back to the homepage, you lose the shopping cart.

Cheers!

I hope you get this sorted, just thought I would share this which might help you in the future when you do ecommerce sites (not out yet but will be soon) https://webflow.com/ecommerce?kid=MM57F

1 Like

Hi @ChenC

Did you see this one: Need the Shopify cart to appear on every page instead of just the ones with shop items?

If you have some flexibility and are not tied to Shopify for this project - Foxy have a great integration whilst we wait for native Webflow E-Commerce. See Webflow | Foxy.io

hi @StuM, many thanks for that.

Yeah I’ve seen that post and tried to copy and paste that same line of code onto my dashboard – Under “Custom Code” > “Footer Code”.

Still not working. Is there something I’m doing wrong here?

Copy&Paste code:

<div data-accent_color="767676" data-background_color="ffffff" data-button_background_color="000000" data-button_text_color="FFFFFF" data-cart_button_text="Cart" data-cart_title="Cart" data-cart_total_text="Total" data-checkout_button_text="Checkout" data-discount_notice_text="Shipping and discount codes are added at checkout." data-embed_type="cart" data-empty_cart_text="Your cart is empty." data-shop="mt-site.myshopify.com" data-sticky="true" data-text_color="FFFFFF"></div>
<script type="text/javascript">document.getElementById('ShopifyEmbedScript') || document.write('<script type="text/javascript" src="https://widgets.shopifyapps.com/assets/widgets/embed/client.js" id="ShopifyEmbedScript"><\/script>');</script>

@rileyrichter - I know you’ve just finished a Shopify/WF site - do you have time to take a look at @ChenC issue?

1 Like

Yes, I’ll dive in and take a look!

Ahh, it looks like the issue is already solved! Happy to help any other way if I can!

1 Like

hi @rileyrichter, thanks for the response.

The issue is not quite solved yet! I had to just build a quick one page site for the client so the site you reviewed earlier wasn’t the one meant for troubleshooting.

if you follow this link ([http://littlefear.webflow.io]) – try adding one product to your cart, then go right down the bottom and click on TEST LINK. You’ll then be brought to another page where the SHOPPING CART disappears.

1 Like

@rileyrichter

Thought I’d might add…

After doing some testing, I think I may have figured out a little hack, it seems the SHOPPING CART icon would only show up on pages with a ADD TO CART button on it.
So i included a ADD TO CART button to a separate page but with its visibility set to zero under the “HTML embed settings” section… and it works, the shopping cart can be seen.

Would there be an a better way to do this though?

Cheers.

2 Likes

Hey, @ChenC - nope, that’s the easiest way to do it. I normally add it to the footer so that I know it will be on every page and I don’t have to worry about it. Also makes it easy to quickly update if you make style changes or need to make any global changes! :slight_smile:

1 Like

@rileyrichter thanks!

any chance you know of a way to style them shopify buttons?

Hey, @ChenC - since it’s a javascript embed it’s a pretty onerous task. The best option is to just style the embed in Shopify to match your button styles in Webflow.

Thanks @rileyrichter!

:beers:

How did you set visibility to zero?

May I please have the code to add to the footer?

Hi, all you have to do is go to the line of css where it says

contents": {
“img”: false,
“button”: false,
“buttonWithQuantity”: true,
“title”: false,
“price”: false

and set the things you don’t want to see to false

1 Like

Hello @rileyrichter @ChenC @Abere @StuM

I’m facing the same issue. Unable to see the cart on any page other than the one which has add to cart button.

I tried copying the cart code embed to the footer was unable to. Reason for that is my add to cart embed has a CMS list on it.

Any solution guys?

here’s my read only link:
https://preview.webflow.com/preview/spacewarp?utm_medium=preview_link&utm_source=designer&utm_content=spacewarp&preview=cc97c05f4bbcfafce70ea00f424d172b&pageId=63206e362eb094230ec3cea5&itemId=63206e362eb094f47fc3cf67&workflow=preview

I am a web designer but did not design any e-commerce site yet, how i can start… shopify?
Apart from this i am currently working on web design company in san diego, see my work and give feedback how can i improve
Thanks