question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Include a link to "Edit in Tag Manager" when viewing or editing the Tag Manager module

See original GitHub issue

Feature Description

When viewing the connecting status within the plugin settings for the Analytics module there is an option to “Edit in Analytics”.

Should the Tag Manager API allow consider adding the same link for the Tag Manager module to allow users to easily navigate to and edit the tags contained within a connected container.

https://user-images.githubusercontent.com/41326532/166954697-46c216fb-6395-465c-a961-9a2fc66ebb83.mp4


Do not alter or remove anything below. The following sections will be managed by moderators only.

Acceptance criteria

  • The settings view for GTM should be updated to include an edit link next to the container ID for web and AMP containers following the implementation in Analytics for consistency
  • The link should read “Edit in Tag Manager” and link to the following path on the service which should always open for the Google account the user is signed in with
    /#/container/accounts/:accountID/containers/:internalContainerID
    

Implementation Brief

  • Get the settings view URL using the getServiceURL selector of the modules/tagmanager store.
  • Construct the path using the escapeURI function with the format /#/container/accounts/${ accountID }/containers/${ containerID } where accountID and containerID are already available from getAccountID and getContainerID selectors respectively.
  • Pass an object with the path property to the getServiceURL selector to get the final URL.
  • Reuse the following elements from the Analytics settings view to display the “Edit in Tag Manager” link: https://github.com/google/site-kit-wp/blob/1148434deb199f8957929e88862eee3f9f76ebb0/assets/js/modules/analytics/components/settings/SettingsView.js#L140-L154
  • Change the module name to Tag Manager appropriately.
  • Render it below the Container ID elements. It should be inlined with the Account and Container ID.

Test Coverage

  • No new tests are to be added.

QA Brief

  • Connect the Tag Manager module in Site Kit.
  • Go to Site Kit -> Settings -> Connected Services -> Tag Manager.
  • Verify that an Edit in Tag Manager link shows up besides the Container ID.
  • Verify that clicking on it navigates you to the appropriate Tag Manager service page in a new tab.
  • Also set up the site with the AMP plugin to be an AMP site.
  • Re-setup the Tag Manager module to use an AMP container.
  • Verify that the Edit in Tag Manager link still works as expected.
  • If both web and AMP containers are configured, verify that there are two different Edit in Tag Manager links for each container.

Changelog entry

  • Include a link to “Edit in Tag Manager” when viewing the Tag Manager module settings.

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:7

github_iconTop GitHub Comments

2reactions
aaemnnosttvcommented, Nov 29, 2022

Do you think we should have a Edit in Tag Manager for web and AMP separately? It feels an odd user experience as is.

I believe we should have the link pointing to the Web container as default/primary if both web and AMP containers are connected (this isn’t the case currently, I’ll have to open a quick follow-up PR to achieve this).

@wpdarren @nfmohit There should be one edit link for each container since the links are container-specific. I see the AC is slightly ambiguous about this but in secondary AMP there should be two separate links.

1reaction
nfmohitcommented, Nov 29, 2022

Thank you @aaemnnosttv for the confirmation. I’ve opened #6223 to address this.

CC: @wpdarren

Read more comments on GitHub >

github_iconTop Results From Across the Web

Environments - Tag Manager Help - Google Support
Edit environments · In the Custom Environments list, find the entry for the environment you would like to edit. · Click the Actions...
Read more >
Google Tag Manager Tutorial - YouTube
A NEWER VERSION OF THIS GOOGLE TAG MANAGER TUTORIAL IS HERE -- https://www.youtube.com/ watch ?v=u_x5lVJMKZ0 ⭐A step-by-step guide on how to ...
Read more >
Change Links with Google Tag Manager (Part 1) - YouTube
Google Tag Manager can be used to change Links dynamically with the help of some JavaScript. This can be particularly useful when it...
Read more >
Tags, triggers, and variables in Google Tag Manager - YouTube
This is the 4th video in the series “Google Tag Manager for Beginners”. Here is the full playlist: ...
Read more >
Custom Templates Guide For Google Tag Manager
A comprehensive guide to building custom templates (both tag templates and variable templates) in Google Tag Manager.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found