Streaming live at 10am (PST)

Shopify shopping cart – to show on all pages


#1

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!


#2

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


#3

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 https://www.foxy.io/webflow


#4

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>

#5

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


#6

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


#7

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


#8

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.


#9

@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.


#10

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:


#11

@rileyrichter thanks!

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


#12

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.


#13

Thanks @rileyrichter!

:beers: