Debug View

The above configuration will enable the Google Tag Manager Plugin on Google Chrome.

If not downloaded then download the plugin from - https://chrome.google.com/webstore/category/extensions?hl=en

Open your website and enable the Google Tag Manager Plugin.

Now, navigate to any product page of your website and you’ll see that the Google Tag Manager is enabled for your website:

Once you are done with all the configurations, you can check how the variables and tags you created are working.

For checking the same, navigate to the Overview page in the Google Tag Manager and click on the Preview button from the right corner.

On the next screen, enter your website's URL and click on Connect button.

This will open the frontend of your store in the new browser window and in the current window ask you to complete the connection using the Continue button.

Now to verify the tags, explore products from your store, upload designs, add to the cart and complete the checkout.

After the process, here is how all tags fired will appear according to events that occurred at the front store:

Checking the tag fire in GA4

For checking if the tags and variables of GA4 are working as configured, log in to your Google Analytics account, navigate to the Admin page from the left panel, select the account and then select the GA4 property.

From the property panel, scroll down and click on "DebugView". Now, open and complete the purchase process in your front store (in debug mode same as above) starting from exploring products, uploading designs, adding to the cart, and completing the checkout.

After the process, the tags fired will appear as shown below: