Pushes events to the data layer about hover interactions that occur over the given CSS selectors in the page.

(This recipe is for a listener only. It has no visible effect on your site and does not send data to Google Analytics or other tools unless you create additional triggers and tags to do so.)

Instructions

1. Download Container File

Download the container JSON file.

(You may need to right-click on the link and choose “Save Link As” or “Save Target As” to save the JSON file to your computer.)

2. Import JSON File into GTM

Log into your own Google Tag Manager container and head to the Admin section of the site. Under Container options, select Import Container. Check out this blog post for more details about importing a container file.

3. Customize Items to Track

Edit the variable “Constant – Hover Listener CSS Selectors” with a list of CSS selectors, separated by commas, on which you want to listen for hover activity.

4. Create Your Own Tags, Triggers, and Variables.

This particular recipe won’t actually create any tags for you. Create the appropriate Variables to pull out information from the data layer push. You’ll need to create your own trigger using the Custom Event = hover, and then attach that to any tags that you would like to fire.

5. Preview & Publish

Use the Preview options to test this container on your own site. Try testing each of the events to make sure they’re working properly. If everything looks good, go ahead and publish!