In this tutorial, we'll take a closer look at what Zaraz is, how it compares to Google Tag Manager, and most importantly, how to implement it on your website. Finally, as always, we lean to a Webflow implementation.
Cloudflare's Zaraz Tag Manager is a free and powerful tool that helps website owners manage and deploy various tracking scripts and third-party tags on their sites. We’ve been promising to do a post and video on Zaraz since we did our post on optimising your Webflow site with Cloudflare and how to get it running properly, so here it is. We'll also explore how Zaraz can help improve your website's speed and performance and how that works.
What is Cloudflare's Zaraz Tag Manager?
Zaraz is a tool that allows website owners to manage their website's tags in a single place. It offers a range of features, including tag sequencing, tag monitoring, and tag bundling, that make it easy to manage and deploy multiple tags on your site.
One of the biggest advantages of Zaraz is its simplicity. It offers a user-friendly interface that makes it easy to add, modify, and remove tags from your website. Plus, it's completely free to use, which makes it an attractive option for small businesses and startups.
But, the most important benefit is the speed it offers when compared to tools like Google Tag Manager when used in conjunction with a proper Cloudflare Optimisation setup for your site. Adding tags to your website can have a significant impact on its speed and performance. Zaraz can help improve your website's speed in the following ways:
- Tag Bundling: Zaraz can bundle tags together to reduce the number of HTTP requests required to load your site, which can significantly improve page load times.
- Lazy Loading: Zaraz also offers lazy loading, which means that tags are only loaded when they're needed, reducing the initial page load time and improving the perceived speed of your website.
- Asynchronous Loading: Another way that Zaraz can help improve website speed is by using asynchronous loading. This means that tags are loaded in the background, which can reduce the impact on page load times by not creating bottlenecks.
- Fast and Reliable Infrastructure: Finally, Zaraz is built on Cloudflare's fast and reliable infrastructure with data-centres around the world. This means that your tags are served quickly and reliably, which can further improve your website's speed and performance.
- Server-Side Tagging: Instead of installing third-party tools directly onto your website, this tool manager loads them on the cloud, away from the browser.
Cloudflare's Zaraz Tag Manager vs. Google Tag Manager
Google Tag Manager (GTM) is another popular tool for managing tags on your website. While both tools are great, there are some differences worth considering.
Google Tag Manager is free to use, but it requires a Google account, and yes, there are folks who don't like that. Cloudflare's Zaraz Tag Manager, on the other hand, is completely free and doesn't require any additional accounts aside from your Cloudflare account.
Another difference between the two tools is their level of complexity. Google Tag Manager is a more advanced tool that offers a range of features, including advanced tag sequencing, tag templates, and more. Cloudflare's Zaraz Tag Manager, on the other hand, is simpler and more straightforward, which makes it a better choice for beginners. That's not to say you can't do complex event tracking etc, simply that doing the basics can be a lot easier and then more advanced tracking can also be a little harder.
Finally the speed factor we talked about above, if you have a lot of tags set up in Google Tag Manager you’ll see that Google complains more about their own tools and Tag Manager in your page speed results, here Zaraz will usually give much better test results.
Implementing Cloudflare's Zaraz Tag Manager
Implementing Cloudflare's Zaraz Tag Manager on your website is a simple process that involves the following steps:
- Sign up for a Cloudflare account: To use Zaraz, you need to sign up for a Cloudflare account. Simply visit the Cloudflare website, create an account, and follow the instructions to verify your domain.
- Create a new project: Once you've signed up for a Cloudflare account, you can create a new project for your website. This will allow you to manage your website's tags in a single place. To use Cloudflare for your Webflow DNS settings, follow the Webflow Cloudflare Guide here. If you’d like Cloudflare to cache and optimise your Webflow site, scratch the Webflow guide and follow the instructions in our post here.
- Set up Cloudflare's Zaraz Tag Manager: Once you've created a new project, you can set up Cloudflare's Zaraz Tag Manager. Simply navigate to the "Zaraz" tab and follow the instructions to set up your tags.
4. Add your tags: Finally, you can add your tags to Cloudflare's Zaraz Tag Manager. Simply click "Add new tool" and follow the instructions to add your tags. Aside from adding custom scripts, here’s the full list of current out of the box tools you can implement immediately by mostly pasting in a tracking ID or account ID. If you need to add something not currently on the list you can usually add them with either Custom HTML, Custom Image for pixels or HTTP Request.
How to Add Google Analytics 4 to Cloudflare's Zaraz
Adding Google Analytics 4 to Cloudflare's Zaraz is a straightforward process that involves the following steps which we’re just going to run through to show you how easy it is to add most of the out of the box tools in Zaraz:
- Create a new Google Analytics 4 property: To get started, you'll need to create a new Google Analytics 4 property. Simply navigate to the Google Analytics website, create a new property, and follow the instructions to set it up. We have a guide here.
- Get your Google Analytics 4 measurement ID: Once you've created a new property, you'll need to get your Google Analytics 4 measurement ID. This is a unique ID that identifies your property and allows you to track your website's traffic.
- Add your Google Analytics 4 tag to Cloudflare's Zaraz: Once you have your measurement ID, you can add your Google Analytics 4 tag to Cloudflare's Zaraz. Simply click "Add new tool" in Zaraz and select "Google Analytics 4" as the tag type.
Tick the boxes and click Continue to allow permissions.
Enter your measurement ID and hit save.
Pageview will be added automatically and you’re done.
That's pretty much that, most tools like Google Ads etc follow a similar template. The reason we like it so much at Milk Moon Studio is twofold, one the simplicity. We're a small Webflow Studio, so we love no-code or at least low-code Webflow design, which makes this perfect for us. Secondly, the speed boost we get when we run a client on Zaraz and the rest of their project is also cached on Cloudflare and optimised by it on the fly.
Cloudflare's Zaraz Tag Manager is a valuable tool that can help you better manage your website's tags and improve its performance. By taking advantage of its various features, you can streamline your website's operations, improve the user experience, and boost your website's visibility and engagement.
Implementing Zaraz is a simple process that involves signing up for a Cloudflare account, creating a new project, setting up Cloudflare's Zaraz Tag Manager, and adding your tags.
We’ll be uploading a video on the whole process soon. In the meantime, drop us a comment if you have any questions. For those of you who’d like to do more with Cloudflare, head to this post to see how to get it working with Webflow and how to get your content cached and optimised. We also have a whole post on setting up Google Tag Manager here, and a few posts on tracking clicks and form submits etc in the how-to section, so check them out.
