> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://helpdesk.resmarksystems.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# How do I add the Resmark add to cart button to my website?

The Resmark Add to Cart button lets you sell your products directly on your own website. Three pieces of code are required to get your first button set up, and your website must support JavaScript.

To get started, navigate to **Website Tools** and click **Get This Widget**. Use the dropdown menu to select the product you want to generate code for.

![Animated walkthrough of navigating to Website Tools and selecting a product](https://storage.crisp.chat/users/helpdesk/website/7ba853dabaeaa800/891c2213-2005-423c-aa34-a7e78d_1bvbphu.gif)

### 1. Button Code

Paste once per button within the main body content of your website. You can add as many buttons as you need for different products. Before copying the code, you can customize the button's colors and text.

To add buttons for additional products, use the product dropdown to switch products and copy a new button code for each one.

![Animated walkthrough of customizing and copying the button code](https://storage.crisp.chat/users/helpdesk/website/6d5ff8d2a864f400/a22a2dd4-21e9-4549-a5e0-e15fb5_5lpti8.gif)

### 2. Shopping Cart

Paste once within the main body content of your website. This single piece of code works with all of your buttons, so do not paste it more than once. You can customize the cart color before copying.

![Animated walkthrough of customizing and copying the shopping cart code](https://storage.crisp.chat/users/helpdesk/website/e14dd3deca930800/ed901615-2358-4142-b4f4-2b2561_gtvund.gif)

|| Only paste the shopping cart code once per page. Pasting it multiple times may cause unexpected behavior.

### 3. JavaScript Code

Paste once per page, just before the closing `</body>` tag. This script is what makes the Add to Cart button function. The only customizable option is **Use Brand Colors**, which pulls in colors from your **Settings > Brand** configuration.

![Screenshot of the JavaScript code section with the Use Brand Colors option](https://storage.crisp.chat/users/helpdesk/website/51cecd630a16380/javascript_1haodgh.png)

|| Only paste the JavaScript code once per page. Pasting it multiple times may cause unexpected behavior.


### Site Builder Compatibility

If you are using a site builder like WordPress, Squarespace, or a similar platform, you may need additional troubleshooting to get the widget working. Common issues include the site builder's CSS overriding the Resmark widget styles, or JavaScript restrictions preventing the widget from loading. Our Support team is limited in what we can troubleshoot on third-party websites, but our ResmarkWeb team specializes in website builds and can help with implementation. Contact us and we are happy to provide an estimate for the scope of work required and any applicable fees.