Popup in Google Tag Manager as CTA Hubspot
Popup in Google Tag Manager as CTA Hubspot
Hi @HPrzygoda,
unless you really need the CTA (function) I would go with a custom button module.
The most basic custom button module contains:
- Link function
- text function (name: Button label; not rich-text)
and looks like this:
{% set href = module.link_field.url.href %}
{% if module.link_field.url.type is equalto "EMAIL_ADDRESS" %}
{% set href = "mailto:" + href %}
{% endif %}
<a href="{{ href }}" {% if module.link_field.open_in_new_tab %}target="_blank"{% endif %}{% if module.link_field.rel %}rel="{{ module.link_field.rel }}"{% endif %}>
{{ module.button_label }}
</a>
you can expend it to your needs. Since you want to add GTM parameters/tags to it you can add another text field called "Google tag"(feel free to rename it) like it
{% set href = module.link_field.url.href %}
{% if module.link_field.url.type is equalto "EMAIL_ADDRESS" %}
{% set href = "mailto:" + href %}
{% endif %}
<a href="{{ href }}" {% if module.link_field.open_in_new_tab %}target="_blank"{% endif %}{% if module.link_field.rel %}rel="{{ module.link_field.rel }}"{% endif %} id="{{ module.google_tag }}">
{{ module.button_label }}
</a>
if you want to add CSS classes you have several ways. My recommendations are:
- choice fields with the css class(es) as values
- text fields
- booleans (if you want to trigger a single class)
the code for choice and text fields looks like this
{% set href = module.link_field.url.href %}
{% if module.link_field.url.type is equalto "EMAIL_ADDRESS" %}
{% set href = "mailto:" + href %}
{% endif %}
<a href="{{ href }}" {% if module.link_field.open_in_new_tab %}target="_blank"{% endif %}{% if module.link_field.rel %}rel="{{ module.link_field.rel }}"{% endif %} id="{{ module.google_tag }}" class="{{ module.css_class }}">
{{ module.button_label }}
</a>
for booleans like this
{% set href = module.link_field.url.href %}
{% if module.link_field.url.type is equalto "EMAIL_ADDRESS" %}
{% set href = "mailto:" + href %}
{% endif %}
<a href="{{ href }}" {% if module.link_field.open_in_new_tab %}target="_blank"{% endif %}{% if module.link_field.rel %}rel="{{ module.link_field.rel }}"{% endif %} id="{{ module.google_tag }}" class="btn {% if module.secondary_button %}secondary{% endif %}">
{{ module.button_label }}
</a>
There are almost no limitations how many options you'd like to add.
If you don't have experience in custom module development - take a look how/where to start here in the docs
hope this helps
best,
Anton
Popup in Google Tag Manager as CTA Hubspot
Popup in Google Tag Manager as CTA Hubspot
Hi @HPrzygoda,
no problem - to get it right: You're placing the id from the img(CTA) to the GTM, right?
If so - is the GTM script loaded in the header or footer? I only can assume that if the GTM is loaded after the CTA script it might not get the code but maybe I'm completly off.
So if your GTM code is - for some reason - in the footer area, try moving it to the header area
best,
Anton
