checkout.jpgThis layer makes adding products to a basket possible. In the image or video items can be added to a basket and when you're done shopping, when you click the cart icon, you will be lead to a checkout page.

 

Prerequisites

  • You need a commercial license for Spott
  • You'll need a webshop with products that have a specific ID that can be referenced to in Spott 
  • Your web platform must support adding products by means of a URL.
    This typically looks like this: https://examplestore.com/cart/12345:2, where "12345" represents the product ID, and "2" is the number of items that need to be added.
  • This works for Shopify

 

There are 3 steps

  1. Create a product
  2. Add an advanced layer to your media, link the product, make it addable to the cart
  3. Add the cart with the link to the checkout page

 

1. Create a product

 

2. Add a layer, link a product, make it addable to the cart

Screenshot_2021-12-10_at_13.32.58.png

  • Add any advanced interactive Spott (You need the commercial subscription)
  • In the content tab, subgroup Button:  Set the "Open in" option to cart
  • You can add multiple products on your media, using different interactive layers

 

 

3. Add the Cart with the link to the checkout page

Screenshot_2021-12-10_at_13.35.28.png    Screenshot_2021-12-10_at_13.35.14.png

 

  • Add the cart layer on the media

 

  •  Spott
    • Icon: you can change the cart icon to any icon you want
    • Pauze on hover: for video only
    • Size: of the cart icon
    • Color: of the Cart background
  • Cart
    • Templates: Select one of the 2 templates
      • Checkout:  goes to Shopify checkout page to fill in the shipping and payment details
      • Add to cart: goes to the cart page, where the client can continue shopping
    • Base URL: Replace your store URL in the  "Base URL". For example: https://your-store.myshopify.com/cart/ to https://spottdemo.myshopify.com/cart
    • For each cart item: Leave like it is
    • Separator: Leave like it is
    • Group products: If your webshop supports multiple items, turn this option on. When turned off, the products will not be added together but as separate products.
    • URL postfix: If you need to add certain parameters at the end of your URL, add them here.
  • Counter
    • Position: where you want the counter to be
    • Background color
    • Text color
    • Size
    • Padding

 

 

Was this article helpful?
0 out of 0 found this helpful

Comments

0 comments

Article is closed for comments.