How to set up a Quick Add To Cart?

Last modified: November 24, 2021
In this article

In this article, you will learn how to set up the Sticky Bar.

 Install our Advanced Sticky Add To Cart app here.

On the admin sidebar of your Shopify choose Apps > Advanced Sticky Add To Cart > SETTINGS > Quick Add to Cart

This feature is only available on the Advanced plan. If you are using the Free plan, this feature will be disabled automatically. Please click the button in order to upgrade your plan.

quick add to cart

On the admin sidebar of your Shopify, please choose Apps > Advanced Sticky Add To Cart > SETTINGS > Quick Add to Cart.

quick add to cart section

Below are some necessary settings to activate the Quick Add To Cart feature in your website.

Visibility

quick add to cart visibility
  • Show quick add to cart when
  • When you hover on the products: The Add to cart and View button only appear when you hover on the product image. 
show quick add to cart when
  • Always under the products: With this option, you can not display the View button but the Add to cart button is always shown. 
always under the products
  • Enable for desktop: Allow quick add to cart to show on desktop screen
  • Enable add to cart button: Allow “Add to Cart” button to show on the quick add to cart
  • Enable view product button: Allow “View Product” button to show on the quick add to cart

Keep in mind that these buttons only show when you hover on the product image. 

  • Quick add to cart detail visibility: 
    • Show text and icon
    • Show text only
    • Show icon only

Keep in mind that on the mobile view, only the icon is shown.

  • Buttons position on mobile view: 
    • Top-left
    • Top-right
    • Bottom-left
    • Bottom-right

You can preview how the quick add to cart looks like in both desktop and mobile devices. 

quick preview

Design

You can click on the color icon and pick a color you like from the palette. Or else, you can type your favorite color code. 

design of quick add to cart
  • Add to Cart button
    • Button text: Customize “Add to Cart” button text
    • Button text color: Customize “Add to Cart” button text color
    • Button background color: Customize “Add to Cart” button background color
    • Icon color: Choose a color for “Add to Cart” icon
    • Choose icon: Select a “Add to Cart” icon design
  • View product button
    • Button text: Customize “View Product” button text
    • Button text color: Customize “View Product” button text color
    • Button background color: Customize “View Product” button background color
    • Icon color: Choose a color for “View Product icon
    • Choose icon: Select a “View Product icon design
  • Item added notification
    • Notification text: Customize “Item added” notification text
    • Notification text color: Customize “Item added” notification text color
    • Notification background color: Customize “Item added” notification background color
  • Out of stock notification
    • Notification text: Customize “Out of stock” notification text
    • Notification text color: Customize “Out of stock” notification text color
    • Notification background color: Customize “Out of stock” notification background color

In order to see the preview in both desktop and mobile versions, please hover your cursor over the product images inside the quick preview section.

quick preview

Remember to click on the Save button to save all changes.

If you have any questions that are beyond the scope of this document, just click the live chat icon in the bottom right corner of the screen to chat with us or send an email to [email protected] We are happy to help! 

Was this article helpful?
Dislike 0
Views: 29