Perhaps you’ve heard about it: Google Tag Manager. Google introduced this tool 5 years ago, a tool that would make marketers less dependent on developers and that would, therefore, speed up your marketing process. Google Tag Manager has evolved over the years becoming a more complete and easy to use tool. Here I want to explain why you should sign up today, if you aren’t using Google Tag Manager already. 

Become a technical SEO expert with our Technical SEO 1 training! »

Technical SEO 1 training$ 199 - Buy now » Info

Before I go on to introduce Tag Manager, I do want to say a word of warning. Tag Manager is a powerful tool, and like any power tool, it should be used with care. Don’t just add tags that look appealing to you but you don’t fully understand. For instance, you might bring in a tag that could harm your site because the code is not safe. Or use a tag that influences your data tracking. If you’re not sure or in doubt of a certain tag, have someone who knows JavaScript take a look at it. Luckily, Tag Manager has a great Preview and Debug mode that lets you validate code before you publish.

What is Google Tag Manager?

If you have closer look at the term Google Tag Manager, you can guess what it’s about. It’s a tool developed by Google to manage your tags. But then the next question arises: what’s a tag? A tag is a snippet of code. There’s a whole bunch of analytics and marketing tools out there that work with JavaScript code. For instance, the Google Analytics tracking code – the one you add to your site to track your site’s traffic with Google Analytics – is JavaScript code.

Did you ever had to wait for a developer to add a piece of JavaScript to your site? Or to test whether that code wasn’t harming your website? Then you know how much valuable time that can take. With Google Tag Manager you can add these pieces of JavaScript or tags yourself. Google Tag Manager even has the ability to test whether you’ve implemented the tag correctly.

Running every tag from Google Tag Manager has two big advantages. First of all, you’ll have an overview of the tags you’ve added. Secondly, you’re in full control of measuring the effects of your marketing efforts.

What can you use it for?

Because Google Tag Manager allows you to add JavaScript to your site, you can use it for a lot of things. You can use it to get more insight in the behaviour of visitors on your site – ‘events’ like clicking on a button – but also to get tags of third party tools on your site. It will even help you to add structured data to your pages!

Google Analytics and Tag Manager

One of the most used tags that’s managed in Google Tag Manager is the Google Analytics tag. Not only can you add the Google Analytics tracking code. You can use Google Tag Manager to create, for instance, custom dimensions, events or content grouping. This means that you can track if people click on your buttons, if they scroll down to a certain point on your page, if they watch your videos and so on. All the cool things you can do with Google Analytics events, can now be managed in Google Tag Manager. And you won’t need a developer for it!

Other third party tools

Google Tag Manager supports a lot of third party tags, like: Adwords, Adobe Analytics, Bing ads, Hotjar, Crazyegg and so on. You can find the complete list on the Google Google Tag Manager support forum. You can use Hotjar tags to finally get those heatmaps – a visual representation of where people click on your site – you wanted to have. Or run surveys and A/B tests on your site. Getting data like that can help you bring your conversion rate to the next level.

Google Tag Manager and structured data

But there’s more! You can also use Google Tag Manager to implement structured data on your site. Structured data is extra information you add to your page in a specific format. Google can show this information in the search results, which makes it more likely people click on your result and engage with your page.

At the moment, we’re working on a new and practical course about structured data. In this course, you’ll learn how structured data works and how to implement it with Google Tag Manager yourself. Don’t miss the launch and keep an eye on our newsletter!

Where to find Google Tag Manager?

Google is ubiquitous with its tools. If you visit: google.com/analytics/  you can see all tools Google has developed to help you with your marketing strategy. In addition to Google Analytics, there are tools to help you boost conversion or perform customer surveys. And, of course, there’s Google Tag Manager. You can sign up for free! Wait! Free, you say? Yes, free!! So what’s stopping you?

After you’ve signed up, you can create an account for your website, your iOS or Android app or your AMP pages:

Create a container in Google Tag Manager

Just provide the URL of your site as the container name and then select web – if you want to implement it on your website. After you’ve created this container, Google Tag Manager will ask you to add a piece of code in the <head> and <body> of the page. I promise, this is one of the few things you might need a developer for, when it comes to using Google Tag Manager.

install Google Tag manager on your site

Luckily, if you’re using WordPress, you can easily add the Google Tag Manager code using a plugin called DuracellTomi’s Google Tag Manager for WordPress. Please note that you only have to use the GTM-XXXX code.

If you’re using another CMS, please check out the quick install guide for more information on how to get started.

After you’ve inserted the Google Tag Manager code to your pages, you’re ready to create your own tags. This can be done in a so called workspace that looks like this:

So now you’re all set up and ready to add those tags to your site.

And now?

We’ll be doing more posts on Google Tag Manager soon. Explaining the practical side of things like how to create variables, triggers and tags, and how to implement structured data with it. We’ll also help you understand how to combine Google Tag Manager with Google Analytics to use it to its full extent. So stay tuned!

Read more: ‘How to use Custom Dimensions in Google Analytics’ »

If you check your site speed with Google PageSpeed Insights you might get the advice to minify your Javascript (JS) and Cascading Style Sheets (CSS) files. Your JS files contain the code for the interactive elements of your website. And in your CSS files you specify the design of your pages. Minifying those files will decrease your page load time, thereby providing a better user experience.

We received a question about minification of JS and CSS files at Ask Yoast. Besides that, we also get the following question quite often when performing one of our SEO reviews:

“Why and how should I minify my JS and CSS files?”

Check out the video or read the answer below!

Optimize your site for search & social media and keep it optimized with Yoast SEO Premium »

Yoast SEO for WordPress pluginBuy now » Info

Minify your JS and CSS files

“JavaScript (JS) is the stuff that makes your web page interactive and CSS is the stuff that makes your web page look good. Basically, these two things are code that you send to the browser, and that the browser needs to render.

A browser, like any other computer program, doesn’t care what the language that it receives, looks like. It doesn’t need the spacing and the comments and all other stuff, that your developer needs to make sense of it all. He needs the structure to get through the code, however the browser has no benefit from that.

Stripping all of that down, actually makes the file that you send to the user a lot smaller. Because when you minify it, you remove all the extra spaces, all the line breaks and all the comments. Stripping all that, can save up to 30-40%, or even 50% of file size in some cases. There really is no benefit of sending that stuff to the end-users, so minifying saves time and money for everyone. 

That’s why you should do it. Good luck!”

If you’re on WordPress, there’s a vast amount of plugins that can help you minify your HTML, CSS and JS files. We generally recommend WPRocket for this and some further improvements to speed up your site.

Ask Yoast

In the series Ask Yoast we do our best to answer your SEO question! Need some help with your site’s SEO? Send your question to ask@yoast.com. You might get a personal answer on video!

Read more: ‘DIY: optimize your browser cache’ »

This site offers natural healing techniques and coaching based on traditional ayurvedic medicine.

Urban Legend web was contracted to create the front-end and back-end using a WordPress framework.

For the front-end, a child of the ‘cardinal’ theme was used to provide a basis for the PHP, HTML, CSS, and Javascript used for the theme files, layout, style, and user interaction respectively.

For the backend, theme files were edited in PHP to provide user options for content management and editing.

Davis Ogilvie - http://do.co.nz

For this project I was under contract to a Christchurch agency, PublicaDDM.
My role was working within the WordPress framework to set up the frontend theme, as per supplied files. That involved creating and editing CSS, HTML, and Javascript to meet the project requirement. The layout is responsive. My role also involved setting up the backend content management system, using PHP.

I’ve been snuffling around in my archives, dusting off long-forgotten back-up CDs and such, and found an interesting  wee toy I’d almost forgotten writing.

It’s a basic palette picker, written as a web-page, which allows the user to choose a web-page colour scheme from the 216 basic colours.

There are four colour-able areas. You fill them by clicking a colour from the panel on the left, and then in one of the colour-able areas. A cookie will save the scheme you decided on, and CSS codes for the color are given.

I did say it’s basic : I wrote it in 2002, using Javascript,  before the days of JQuery. The code is embedded rather than linked, so it’s easy to see ( and modify if you choose ).

Who knows, it may be useful, but probably more likely a 5-minute diversion. Have at it!