Google Tag Manager for Shopware 6

Google Tag Manager is a free tool that authorizes you to control and expand marketing tags on your website without having to change the code. It controls all your website tags without editing code. It gives simple, reliable, easily integrated tag management solutions for free.

Shopware6 Google Tag Manager will allow the admin to monitor their eCommerce store in terms of tracking and analytics by entering the code snippets.

Google tag manager is a tag management system by which the user can quickly use and update their tags and code snippets. 

Note

Tag Assistant(By Google) should be installed on your chrome browser for checking the dataLayer of Google Tags.

• The admin can add code snippets of google tag manager in their Shopware 6 website.
• The admin can track and check analytics on Google of their Shopware 6 website.
• Easily configure the Google Tag Manager within your Shopware 6 Store.
• The admin can manage the JavaScript and HTML tags which are used for analytics on websites.

Shopware provides two ways to install the plugin to the server.

1. Using Command
2. Manual installation

Installation Using Commands

Customers will get a zip folder, then they have to extract the contents of this zip folder on their system. The customer has Copy the folder WebkulGtm to custom/plugins directory of Shopware6. As shown in the below image:

Now open the Shopware6 application in the Terminal.

Run this command to refresh the plugin –

./bin/console plugin:refresh

Go to your Shopware installation Root directory and run this command to install then activate the plugin –

./bin/console plugin:install --activate WebkulGtm

To installing the assets(CSS/JS)

./bin/console assets:install

To clear the cache run this command –

./bin/console c:c

Now refresh the administration.

After that, visit administration Extensions->My Extensions, the ordered product review will be listed there.

Manual Installation

1. Upload the zip file of the plugin.
2. Go to your Shopware6 installation backend panel then navigate to Extensions -> My Extensions after that, you can find all the installed plugin in it.

Click on the Plugin. For installing the plugin, the user can click on the Upload Extension button. The user can upload the plugin zip(WebkulGtm) here.

Further, in the newly added plugin, two actions can be performed which are: Configuration and Uninstall.

After Installation, click on the activate button.

After that run this command to clear the cache:

./bin/console c:c

Tap on View. Then you will see two options Config and Uninstall.

Click on the Config button.

When you will click on the Config button a new page will open.

For configuration, you have to get the Google Tag Manager Container ID.

To get the Container Id you must first create an account(Signup is free) at Google Tag Manager.

Now, after going to this link follow the below Steps –

1: Enter the account name(as per your requirement) and then click Continue.

2: Now set up the Container name(as per your requirement), select where to use the container and then click Create.

3: Then on the pop-up, click Yes to confirm to the Google Tag Manager Terms of Service.

4: However, now, click on the ‘back to home’ arrow on the top left-hand side. Where the admin can add a new tag.

5: Lastly, you will see the Container ID. This container ID is to be put in the admin back-end configuration of the extension.

After the container id is generated, the admin can view the list of accounts along with their container id.

Thus, the admin needs to select the particular container for which the container id will be added in the module configuration.

How to add a new tag in Google Tag Manager

Now the screen that appears, here you need to add few tags(as per required) and then publish to make the changes live.
To add tags, navigate to New Tag -> Add New Tag

Now the section that comes up tap Tag Configuration to choose a tag type to begin the setup.

Here you will choose your tag type from the featured list or search for one.

Now, select the Track Type as per your requirement, select Enable Overriding settings in this tag, and enter the Tracking Id from your Analytics.google.com account and then tap the Save button.

Configure the Trigger for the tag and tap the Save button after that.

Set the name for your Tag and tap Save.

To publish click the Submit button on the top right-hand side.

A Sliding section comes up, here select Publish and Create version, enter version name, description and hit the Publish button.

You will see the container is published.

Lastly, click on the Tag Manager icon on the top left-hand corner or go to All Accounts. Here, you will see the Container ID. This container ID is to be put in the admin back-end configuration of the extension.

On the dashboard click on Preview.

Afterward, we will be redirected to the next page.

Here, we need to mention the website link. then click on connect button.

Configuration

Now, go to config and enter the Container ID.

• Sales Channel- The admin can select the sales channel.
• Status- Under this tab, the admin can mark the status as active/inactive.
• Container ID- Here, the admin needs to mention the Container ID.

• Measure Purchase- The admin can enable the data layer for Purchase.
• Measure Checkout- The admin can enable the data layer for Checkout.
• Measure Add to Cart- Here, the admin can enabe data layer for Add to Cart.
• Measure Remove from cart- The admin can add data layer for Remove from cart.
• Measure Views Product List- Here, the admin can enable data layer for Views Product List.
• Measure Product View- The admin can enable data layer for Product view.

To check if the Google Tag Manager is properly installed, the data on your website should get displayed as shown below in the snapshots.

Note: To check this, you must have installed the Google Chrome browser extension – Tag Assistant(By Google).

Some Examples –

Category page: On the category page, the data layer shows the current product details.

Main Product Page: On the product page, the data layer shows the current product details.

Add to Cart- Here, the admin can see Add to cart data layer.

Remove cart- The admin can see the remove cart data layer after removing the main product.

Shopping cart page:  Here, the data layer shows the checkout cart data and the cart data.

Checkout page: On the checkout page, the data layer shows the complete order details.

Order Success Page: On the order success page the data layer shows the purchased item details as shown below in the snapshot.

If you have any issues, feel free to add a ticket and let us know your views to make the module better webkul.uvdesk.com

Please explore our shopware development services and Quality shopware extensions .