Custom Add To Cart (Pro)

Add an Add to Cart button to a specific product anywhere on your site.



  1. Product: Select the product to be added to the cart
  2. Show Quantity: Set to Yes to allow the user to change the quantity
  3. Quantity: If Show Quantity is set to No, this option becomes available so that you can predetermine the number of items to add to the cart


  1. Type: Select the type of button to use, choosing from Default, Info, Success, Warning, and Danger
  2. Text: Enter the text to be displayed on the button
  3. Alignment: Align the [widget] to the left, right, center, or justified
  4. Size: Select the preset button sizes, from Extra Small to Extra Large
  5. Icon: Select a Font Awesome icon to display on the button
  6. Icon Position: Choose to display the Icon Before or After the button text
  7. Icon Spacing: Set the amount of space between the Icon and the button text
  8. Button ID: (Optional) Assign a unique button ID to use for situations such as Google Analytic’s events



  1. Typography: Set the typography options for the button text

Normal | Hover

The following options can be set independently for both the normal and hover states.

  1. Text Color: Choose the color of the button text
  2. Background Color: Choose the background color of the button
  3. Hover Animation: Choose an animation effect when hovering over the icon, such as Grow, Pulse, Skew, etc.

  1. Border Type: Select the type of border, choosing from none, solid, double, dotted, dashed, or grooved
  2. Border Radius: Control border roundness of the button
  3. Box Shadow: Adjust box shadow options
  4. Padding: Set the padding within the button

Share it on social networks

Share on facebook
Share on twitter
Share on linkedin
Share on email

Did this answer your question?

255 people find it useful



Get Started With Elementor Today

Join millions of professionals who use Elementor to build WordPress websites faster and better than ever before