How to set up Sticky Button & Cart Drawer? (version2)

How to set up Sticky Button & Cart Drawer? (version2)

SLIDE CART SETTINGS


  1. Show option value of variant: Show short form of product variant. For example: blue/small.
  2. Show custom properties: Recommend to enable this option if you're selling product with extra options.
  3. Enable note box: Display note box on the cart to allow customers leaving message for seller.
  4. Show checkout message: Add a mini custom message above the checkout button on the cart.
  5. Show "Continue shopping" button: Display a Continue shopping button below the checkout button in the cart drawer. 
  6. Show "View cart" button: Only display this option if the Show "Continue shopping" button is disabled. 
  7. Enable advanced cart upsell: Display the upsell feature in cart by product recommendation of Shopify or Shopify Search & Discovery app. You can also customize recommendations based on products in cart. Please check this article.
  8. Show cart countdown / cart announcement: Display this feature to encourage customers to checkout by showing a countdown timer in their cart. 
  9. Enable shipping goal: Allow setting goal for cart that your customers will get Free shipping once a specific cart goal amount is reached.
  10. Allow edit variants in cart: Allow customers to edit product variants in cart.
  11. Enable calculate shipping rate box: Allow customers to estimate shipping costs before checking out. 
  12. Enable discount code box: Allow customers to add discount code. Discount will be calculated and applied on the Checkout page.
  13. Enable Confirmation checkbox: Display the confirmation checkbox. You could enable this option if you want customers to verify or accept something.
  14. Enable trust badge: Show trust badge at the bottom of the cart.

ADVANCED SETTINGS

1. General text & Update quantity settings.



  1. Subtotal label: Enter content for subtotal.
  2. Checkout button text: Enter content for Checkout button.
  3. Empty cart text: Enter message when the cart is empty.
  4. Empty cart button text: Enter content for the button.
  5. Not enough items text: Enter message when customers want to increase quantity but it is not enough.

2. Cart note settings


  1. Show note box as side features: Allow note box to be shown as a button next to Discount box.
    1. Note title: Add content to display as a note title.
    2. Save button text: Enter content to the Save button.
  2. Note label text: Add title below the note icon.
  3. Note placeholder: Add content to the note placeholder.


3. Checkout message

Enter content to display as a mini message.



4. Continue shopping

Enter content for the Continue shopping button.


5. View cart button

Enter content for the View cart button.


6. Advanced upsell settings


  1. Advanced upsell label: Enter title for the upsell.
  2. Advanced upsell button text: Enter content for the add-to-cart button in the upsell.

7.  Cart announcement settings


  1. Announcement, countdown message: Message is displayed during timer counting backward.
  2. Apply countdown timer: Set up countdown duration.
  3. Action after countdown expired: Set action after the countdown timer expired:
  1. Reset time: The countdown timer will be reset after expiring.
  2. Clear cart: Added product will be cleared from the cart after expiring.
  3. Do nothing.

8. Progressive shipping bar


  1. Goal value: Set up a total cart amount.
  2. Goal Reminder message: Enter the message in the “Goal reminder message” to motivate your customers to buy more and get free shipping.
  3. Goal Achieved Message: Enter the message in the “Goal reminder message”.
You should keep the {amount} tag, it is used to display the amount of money that your customers need to buy more to enjoy free shipping.

9. Edit variants




10. Calculate shipping rate box




11. Discount code box



12. Confirmation checkbox 


Leave the confirmation message in the text field. Or you can keep the default message content and insert your link by pasting it in the tag ‘paste your link here'.
Example: I agree to the <a href='Qikify - Shopify Expert - Top Shopify services and Shopify apps’> Terms and Conditions </a>
Insert your URL by using HTML:
<a href="url">link text</a>
the <a> element is the href attribute, which indicates the link's destination.
The link text is the part that will be visible to the reader.
Clicking on the link text will send the reader to the specified URL address. Or using Convert text to HTML tool to customize text.

13. Trust badge

You can paste the image URL in the text field or upload the image from your device.


VISIBILITY SETTINGS


  1. Enable "Slide Cart" on desktop: Allow the slide cart and sticky button to display on desktop.
  2. Enable "Slide Cart" on mobbile: Allow the slide cart and sticky button to display on mobile.
  3. Auto open "Slide Cart" when user add to cart: Trigger the slide cart when customers click on the add-to-cart button.
  4. Always hide sticky cart button: If you enable this option, our app will use your theme's cart icon to open our slide cart instead of using our sticky button.
  5. Hide sticky cart button when cart is empty: The sticky button will disappear when the cart is empty.
  6. Enable draggable button: Allow customers to drag our sticky button.

STICKY BUTTON SETTINGS


  1. Position on desktop: Set up the position of sticky button on the desktop ver.
  2. Position on mobile: Set up the position of sticky button on the mobile ver.

STYLE


  1. Font family: Apply font family from Google Fonts for the whole Slide Cart. If you leave it blank, the app will display your theme's font.
  2. Font size: Apply font size for the whole Slide Cart.
  3. Button size: Modify sticky button size.
  4. Cart drawer primary color: Apply color to checkout button and other buttons of different features.
  5. Cart drawer secondary color: Apply color to text of button.
  6. Text color: Apply color for the whole content of the Slide Cart.
  7. Slide cart background color: Apply color to the background of sticky button.
  8. Icon color: Apply color to the icon of sticky button.
  9. Cart counter background color: Apply color to the background of cart countdown feature and cart counter. 
  10. Cart counter text color: Apply color to the number of cart counter.

If you need any assistance or have any questions, please don't hesitate to contact our support team for help.





    • Related Articles

    • Sticky Cart Button

      Enable on desktop: allow your sticky button to appear on desktop version.  Enable on mobile: allow your sticky button to appear on mobile version. "Enable on mobile"  works on screen width that is below 992 pixels SETTINGS  Button action Set the ...
    • How to set up Sticky Add to cart? (Version 2)

      GENERAL SETTINGS Only show sticky add to cart when "Add to cart" button disappear: Enable this option so that the Sticky Add to cart only displays whenever the Add-to-cart button of your theme disappear. Only show sticky add to cart when user scroll ...
    • Sticky Cart Version 1.0 vs Version 2.0 - What Makes Version 2.0 Different?

      What’s new in Sticky Cart 2.0? New Interface Be designed based on the Shopify Interface that helps to create a consistent user experience for merchants Up to 15 new features Updated more advanced features to help sellers create high converting stores ...
    • How to find the CSS selector of your theme's cart icon? (Sticky Cart version 2)

      This option is only available in Sticky Cart version 2 To integrate the cart drawer of Sticky Cart app with your theme's cart icon, you need to add the CSS selector of your theme's cart icon into our app settings. Here are the steps to find the CSS ...
    • Sticky Bar

      Enable on desktop: allow your sticky bar to appear on desktop version  Enable on mobile: allow your sticky bar to appear on mobile version  "Enable on mobile"  works on screen width that is below 992 pixels SETTINGS Position on desktop/mobile  Set ...