Add a mini-cart to your Webflow website

Install Foxy Include

  1. In Foxy, go to your Sample Code page here.
  2. Copy the snippet from Step 1.
  3. In Webflow, go to your Project Settings > Custom Code.
  4. Paste the snippet into the Footer section.

View Cart Link

  1. Add a Webflow link block, text link, or button element where you want the mini-cart displayed.
  2. Link the element to your view cart link (ex: https://change.foxycart.com/cart?cart=view) (replace CHANGE with your Foxy subdomain)

Display Cart Quantity

  1. Inside of your view cart element, add an element to display the number of items in the cart.
  2. Set the displayed text as 0.
  3. Give this element a custom data attribute with the Name "data-fc-id" and Value "minicart-quantity".

Display Order Total

  1. Inside of your view cart element, add an element for the currency symbol and order total
  2. Set the displayed text for the currency symbol to your preferred currency symbol.
  3. Set the displayed text for the order total as 0.00 (in the format you prefer)
  4. Give the order total element a custom data attribute with the Name "data-fc-id" and Value "minicart-order-total".