Why Google Tag Manager Isn’t Tracking Your YouTube Video Event

Tracking YouTube Videos with Google Tag ManagerWhile working on a recent project, I discovered one reason why Google Tag Manager may not be tracking your YouTube video event. Being new to Google Tag Manager and Video Tracking, I assumed the reason that playing the video on my page wasn’t triggering a video event was due to a newbie mistake. After Googling for a while, I read a couple of posts where it was mentioned that this could be due to the way the video is embedded in the page. The light bulb went off!

I was using InfusionSoft’s Landing Page Builder and had inserted a video element in the page. I had pasted the YouTube video URL into the field, but after saving, it had transformed the URL. To get around this, I added an HTML element into the page and pasted the YouTube embed code for the video. Saved it, tested, and success! Google Tag Manager triggered the video event! Using an HTML element allows you control over exactly how the video is embedded.

Another plus of embedding the video this way is that I can append “?rel=0” to the video URL so that when my client’s video stops playing, the suggested videos are other videos on her channel and not just random videos from YouTube.

 

YouTube Video Tracking with Google Tag Manager, Zapier, and InfusionSoft/Keap

Tracking YouTube Videos

I recently worked on a project that started out with an InfusionSoft/Keap Campaign. My client wants to send out a series of emails, with each one containing a link to an InfusionSoft/Keap landing page containing a video. She wants to know whether the contact watches 90% of each of the videos. The videos are unlisted on YouTube.

After much searching, I found out that I could use Google Tag Manager for video tracking. GTM would then send the information to a Zapier webhook, which would then send the information to InfusionSoft/Keap.

Here is how I set it up:

InfusionSoft/Keap Steps:

In InfusionSoft/Keap, create the tag, such as Watched_Video. Using the new Landing Page Builder, create a landing page with a YouTube video embedded. Do Not Use the Video element for the video – use an HTML block and paste the embed code for the video into the block. It didn’t work using the Video element because IS reformats the URL that you paste into the Video element and then for some reason, Google Tag Manager can’t pick up on the video event.

When the Landing Page is complete, copy the Landing Page URL. Next, create an email. In the email, create a hyperlink to the Landing Page by pasting the Landing Page URL. Append the following to the URL:

?Email=~Contact.Email~

This will ensure that the contact’s email address can be picked up by Google Tag Manager and then passed back to Zapier and then to IS.

Zapier Steps

In Zapier, create a Zap. Step 1 is Trigger – Webhooks by Zapier. Choose Catch Hook.
Pick off a Child Key – leave blank.
View Webhook – looks like https://hooks.zapier.com/hooks/catch/1111111/pochxn/
Step 2 is Action – Infusionsoft App
Set up Infusionsoft Tag Existing Contact
Email (required)
Tag Names – it will go look for the tag in IS – in this example, the tag is “Watched_Video”.

Google Tag Manager Steps

Go to tagmanager.google.com, and create an account if you don’t have one.
It will give you script code that goes in head and in body of the page that contains the video, so go back to InfusionSoft and edit the Landing Page. In the last step (Launch), there are places to add code that goes in the Head and Body sections. Paste the GTM script code in those sections.

Create a container.

Configure the variables – they are not all turned on for the container by default. Once they’re turned on, then you can choose from them. To Configure them, go to Variables>Configure and then check them all off.

Create a custom user variable such as user_EmailAddr1

This is used to hold the contact’s email address and send it to Zapier.
Variable Type is URL.
Component Type is Query.
Query Key is Email (note that case is important here – look back at the text that we appended to the Landing Page URL – we used ‘Email’ not ’email’. So make sure to type it in correctly)
More Settings – Page URL/Default
Check the box URI-decode cookie
For now, you will have to leave “References to this variable” blank because we haven’t set up that tag yet. Once that tag is set up, come back here and make sure to enter the new tag as the Reference for user_EmailAddr1.

Create a Trigger

Give it a name, such as Watched Video 1
Select Trigger Type – YouTube Video
Track Start, Complete, Progress – put in 90 for 90 percent
Under Advanced, check this box: Add JavaScript API support to all YouTube videos
Trigger fires on some videos
Video URL contains – get the unique code from the video’s url, such as iNUGeTXXyTA
Video Percent greater than or equal to 90
Save

Create a new Tag called user_EmailCookie1.

Tag type is Custom Image (we’re not using an image, but this option handles URLS, which is what we need)
Image URL is the hook from Zapier: https://hooks.zapier.com/hooks/catch/1111111/pochxn/?email={{user_EmailAddr1}}
Append this to the URL: ?email={{user_EmailAddr1}}
That will send the email address of the contact to Zapier
Make sure to use the Custom User Variable that you created
Check the box Enable Cache Busting
Parameter should be gtmcb (not sure why, this was the default value)
Advanced settings should all be blank
Set the firing Trigger to be the one you set up.

Everything is set up now. Make sure everything you set up has been Saved, then Publish it.

Testing

Use Chrome Extension “Google Tag Assistant” to watch it in action.
GTA will show up automatically at the bottom of the page you’re testing since it detects the GTM script in the page.
If not, just click the GTA icon in the bar.

You should see the actions taking place and the tag being executed. Check in Zapier to ensure that the task was completed. Check in IS to make sure the contact was tagged.

Thank you to AKATheAlchemist, who has a video that explains the same type of setup.

 

Unknown Collation Error Migrating Newer MySQL DB to Older MySQL DB

Today I will explain how I was able to fix the Unknown collation error when importing a MySQL database.

I was moving a completed WordPress site this weekend from my hosting account to a client’s hosting account and was surprised to receive an error upon importing the database into the new empty database.

The error was:

Unknown collation: ‘utf8mb4_unicode_520_ci’

Upon Googling it, I discovered that this is a typical error when importing a database from a newer version of MySQL to an older version of MySQL.

The solution was pretty simple. Export the database in a format that is compatible to both, which turned out to be MYSQL40.  I also chose that format when importing the database. Worked fine and I was back on track again.

Changing WordPress Max File Upload Size

I was Googling around, looking for an easier way to change the max file upload size when uploading files to the WordPress Media library and ran across this post on Brian’s Tips and Tricks for Web Developers website.

You can easily change PHP values by going to the Select PHP Options page under Select PHP version in the Software section of cPanel. When you’re on the Select PHP version page, choose Switch to PHP Options at the top right.

Click on the value, make a selection, Apply and Save.

Troubleshooting Reasons for an Unusually Large WordPress Database

My client informed me that when she viewed her website, it was displaying the “Error Establishing Database Connection” message.

When I went to wp-admin, it was displaying another similar message about the database. I logged into the Control Panel and was able to view the database in PHPMYADMIN. I checked to make sure the database name, username, and password matched. Called GoDaddy and found out that the database was over the limit allowed by the hosting plan and so the database user was disabled. We had one week to resolve the issue either by reducing the size of the large WordPress database or moving to a hosting plan that had unlimited database space.

I  browsed the database using PHPMyAdmin, and eventually found that there were over 1 million records in wp_posts! Next, I asked the client to move to a higher level hosting plan and got the site back online. There were only about 1,000 actual posts when viewing Posts from the Dashboard. I continued to browse wp_posts and finally something caught my eye. There were lots of posts of Post-type Http, and a field contained ‘core_control_http_log_item’. I Googled the character string and came up with one match! Googled translated the page from French and I found the answer. It was the Core Control plugin, which had been active for several months and had been logging activity in the database. I had been using it to debug Paypal connection problems and had not disabled it.

Next, I had to remove all posts of post-type http. I used the query:

DELETE a,b,c FROM wp_posts a LEFT JOIN wp_term_relationships b ON (a.ID = b.object_id) LEFT JOIN wp_postmeta c ON (a.ID = c.post_id) WHERE a.post_type = ‘http’.

I hope this may help someone else who discovers that they have a large WordPress database that shouldn’t be so excessive in size and need to find the reason why.

How to Troubleshoot Contact Form 7 Configuration Error

Process of Elimination for Contact Form 7 Configuration Error

I use the Contact Form 7 plugin on almost all of the WordPress sites I create. Recently, I was creating a very long form, saving frequently, and then noticed there was a configuration error: “Multiple form controls are in a single label element. ”

I looked through the code and nothing jumped out at me that could have been wrong.

So I thought, how am I going to find the error? There were almost 50 input fields!

Answer: Process of elimination

I opened up Notepad, copied the entire form, and pasted it into Notepad.

Next I went back to the form, and deleted all but the top several fields. Saved it. No error.

This told me that the error was somewhere in the remaining part of the form.

I copied the next few fields from Notepad and pasted it at the bottom of the form.

Saved again. The error showed up! So now I knew the error was in the fields I had just pasted.

So, I used this process to isolate the part of the form with the error. It saved a lot of time that I would have spent going over the code repeatedly, looking for some problem.

I hope this tip will save you time. It can be applied in situations other than just html forms, too.

Turned out the error was a misplacement of the closing ‘label’ tag.

Embedding Javascript HubSpot Contact form into DNN page

I found that just pasting the HubSpot javascript code into the DotNetNuke HTML module wouldn’t work – the editor just erases the javascript.

After Googling around for an hour or two, I found this article, How to Integrate HubSpot Forms with LeadPages, by Mike Hollis, on DoInbound.com’s blog. He created a ‘quick little script’ that converts the HubSpot Javascript to HTML. I plugged in the Portal ID and Form ID, copied the resulting HTML, pasted it into the HTML module, and it worked!

Thanks Mike!

Troubleshooting Outlook Express Errors 0x800CCC0D and 0x008CCC0E

Every once in a while, Outlook has an error such as “Can’t find host – cannot Locate Server” or “Failed to Connect – Cannot Connect to Server”, error codes 0x800CCC0D and 0x008CCC0E. I found the notes below and thought posting it would be a great way to store the info in case I need it in the future.

I found this very helpful link for troubleshooting those errors and other Outlook errors such as Client Response Invalid.

Some other tips:

  • If outgoing port 25 is being blocked, try setting the port to 587.
  • To clear cache and flush DNS, go to DOS command prompt and enter ‘ipconfig/flushdns’
  • Try Control Panel > Network Connections > Local Area Connections. Right-click and choose Repair

Starting Outlook in SafeMode – Tools > Options > Other > Advanced – Add-in manager, clear checkboxes; restart Outlook

 

By |April 30th, 2017|DNS, email, outlook, WordPress|Comments Off on Troubleshooting Outlook Express Errors 0x800CCC0D and 0x008CCC0E

Getting the URL for Google+ Reviews for Your Business

I like to give my clients the link to the Reviews page of their Google+ profile so they can easily give it to clients to write those valuable Google reviews. Sometimes I will create a page on their website with links to their business listings so they can give clients the link to the page and then the client can post their review in one or more places.

On your phone, go to Google.com and search for the business name as it appears in their Google+ listing.

When the Google+ listing appears, touch the blue circle to display more of the listing. Scroll down to Rate and Review section, tap the 5th star and then copy the url. Paste it into an email and send it to yourself.

That’s it!

Site Not Found After Installing WordPress in Subdomain

I installed WordPress in a subdomain so I could develop a new site, however, when visiting the new URL, I got a site not found error. Called tech support, and found out that the main domain’s DNS was the cause. For this particular domain, the email is hosted elsewhere. All I had to do was add an “A” record to the domain’s DNS with a value equal to the name of the subdomain, in this case “preview” and with the IP address of the domain.