---
title: "Best Practice: Shopping Cart as AJAX-Element"
slug: "best-practice-shopping-cart-as-ajax-element"
updated: 2024-03-19T09:56:07Z
published: 2024-03-19T09:56:07Z
canonical: "docs.mapp.com/best-practice-shopping-cart-as-ajax-element"
deprecated: true
---

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.mapp.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Best Practice: Shopping Cart as AJAX-Element

> **Deprecated.** Shopware 5 is no longer supported. Please use Shopware 6 instead.

If you use the Shopware plugin and the shopping cart is activated as an AJAX-element instead of a new page, the product status "add" does not exist.

To make tracking possible, you can follow the steps described here.

1. Log in into Tag Integration.
2. Create a new rule. To do this, click on *Rules* in the navigation area. ![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/5130aeef-7b8e-4c03-ad75-2d5753ee5649.png)
3. Click **New rule**. ![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/e57ab509-82a1-486b-bb94-0b8836bb17d6.png)
4. Make the following settings:

| Parameter | Description |
| --- | --- |
| Name | Enter the name for the new rule. |
| Conditions | From the dropdown-menu, select: - Event |
| Event type | From the dropdown-menu, select: - Click |
| Element | From the dropdown-menu, select: - Class Enter "equals buybox-button" in the text field. |

> [!NOTE]
> Make sure that your Shopware theme does not change the class name of the [Buy] button. If the class name has been changed, you will usually need to change it accordingly in the rule configuration.
5. Click **Create**. The defined new rule is created and appears in the list of all rules.
6. Now set up the Shopware plugin. Click in the navigation on *Custom Plugins > New plugin*. ![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/7c5ed5d0-ddc4-47b8-a0c2-46f9978c92b7.png)
7. Copy the following JavaScript code into the content text box:

```javascript
var webtrekkAddListener = window.setInterval(function() {
	if (typeof window._ti.productStatus === 'string' && window._ti.productStatus === 'add') {
		window.clearInterval(webtrekkAddListener);
		window.wts.push(['send', 'pageupdate']);
	}
}, 100);
```

![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/9bfe5a3e-39ab-484e-8558-c8281afb943a.png)
8. Click **Create**. The plugin is created and appears in the list of your custom plugins.
9. To add the Shopware plugin to the required container, select the corresponding entry in the container overview.
10. Click **Add Plugin**. ![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/34a0a0a4-f1a3-405c-8a6a-a50e7a572524.png)
11. Select the previously created Shopware plugin by clicking on the corresponding button. ![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/d37f15a1-ce7d-4a5f-baeb-9dbdf9d11492.png)
12. Under *Assign rules* add the previously created rule.
13. Click **Add Plugin**. The Shopware plugin will be added to the container.
14. Finally, click **Publish**. The container will be updated together with the newly added Shopware plugin.