Custom Add to Cart

The Custom Add to Cart Element will give you grant power to create and fully customize Add to Cart buttons that are beautifully designed and highly functional. 

Content Tab 


  1. Product - From here you can select the product that will be added to the customer's cart
  2. Show quantity - Switch the handle ON to allow customers to see the number of items they have added to the cart 


  1. Type - You can choose the type of the button based on customized purpose either Info, Success, Warning, or Danger 
  2. Text - Add your custom text 
  3. Alignment - Align the button either Left, Center, Right, or Justified 
  4. Icon - Choose whether or not to add an icon. You can choose one from the Icon Library or upload your own SVG
  5. Icon Position - Choose to position the icon either Before or After the text 
  6. Icon Spacing - Set the spacing between the icon and the text 
  7. Button ID - Add a custom ID for the button 

Style Tab


  1. Typography - Tweak the typography options for the Add to Cart text 
  2. Text Shadow - Select whether you want to add shadow to the button text and tweak its respective settings
  3. Text Color - Select a color for the button's text 
  4. Background Color - Select a color for the button's background 
  5. Hover Animation - Choose animation for the button when users hover on it
  6. Border Type - Choose a border for the button either Solid, Double, Dotted, Dashed, or Groove
  7. Border Radius - Set the border-radius for the button 
  8. Box Shadow - Set a shadow for the button
  9. Padding - Set the padding value around the button 

Set the settings for the Advanced Tab that is appropriate for the element.  

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.