Comments (12)
mijewe
commented on June 2, 2024
3
For me this final method appears to work fine, however it looks to me like SEOmatic is rendered too far down the head.
In my Google Tag Assistant, it complains that the default consent state wasn't set in time.
If I hardcode the gtag consent + gtm tag directly in the head as the first thing, the error goes away.
from craft-seomatic.
robzor
commented on June 2, 2024
Ah i think this might be a duplicate of #1417
from craft-seomatic.
robzor
commented on June 2, 2024
Your solution in #1417 was to tweak the GA script in the tracking scripts area, but because we do not have access to the wrapping <script> tag in that config area I don't think this is going to work here.
I'm struggling to work out how to actually just render the GTM tag inbetween those 2 tags.
from craft-seomatic.
robzor
commented on June 2, 2024
Ok, so i've got to this:
{% set gtmSEOMatic = seomatic.script.render('googleTagManager')|json_decode %}
{{ gtmSEOMatic.script|raw }}
With automatic rendering disabled. Ideally I wouldn't want to disable automatic rendering though, so open to your ideas/suggestions on this one.
The .script renders both the head and the body script areas though, which adds an <iframe> into the <head> area, which is obviously not valid HTML :(
Maybe it would be good if you could add another node to the JSON of headScript (as you already have the bodyScript node on that array)?
It would be great to be able to do something like (with automatic rendering turned on):
in the <head>
{# Disable automatic placement of GTM script #}
{% do seomatic.script.get('googleTagManager').include(false) %}
{# Grab SEOMatic GTM script object #}
{{ seomatic.script.render('googleTagManager')|json_decode }}
{# Output head portion of SEOMatic GTM script object #}
{{ gtmSEOMatic.headScript|raw }}
in the <body>
{# Output body portion of SEOMatic GTM script object #}
{{ gtmSEOMatic.bodyScript|raw }}
But currently, the render() function will return nothing if I have set include() to false. (and ofc headScript doesn't actually exist :))
from craft-seomatic.
khalwat
commented on June 2, 2024
Your solution in #1417 was to tweak the GA script in the tracking scripts area, but because we do not have access to the wrapping <script> tag in that config area I don't think this is going to work here.
You do, in that you can add whatever attributes you want to it:
The ability to do that was added specifically to allow you to work with things like CookieBot, CookieConsent, etc.
from craft-seomatic.
robzor
commented on June 2, 2024
Hi Andrew, thanks for getting back to me, but what I meant by my comment about 'not having access to the <script> tag' is that I can't insert the other 2 script tags that are required both above and below the GTM SEOmatic script tag.
In a nutshell, SEOMatic forces itself to insert the script tag into the source just before the </head> tag. If I use the render function to control this, it requires me turning off auto-matic rendering and it will also then put an invalid <iframe> tag into the <head> area.
I need to do this:
<Consent Mode script tag><SEOMatic GTM script tag><CookieBot script tag>
plz obi wan welch, you're my only hope!
from craft-seomatic.
khalwat
commented on June 2, 2024
Well, I see two choices, if I'm understanding the issue properly:
-
You can just manually put the GTM script in yourself, as you are the Consent Mode and CookieBot scripts, and not use the SEOmatic tracking scripts
-
You can edit the script template for the GA script in SEOmatic -> Tracking Scripts to add in the Consent Mode script along with the GA script, so it's together, like this:
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments)
}
gtag("consent", "default", {
ad_personalization: "denied",
ad_storage: "denied",
ad_user_data: "denied",
analytics_storage: "denied",
functionality_storage: "denied",
personalization_storage: "denied",
security_storage: "granted",
wait_for_update: 500
});
gtag("set", "ads_data_redaction", true);
gtag("set", "url_passthrough", true);
{% if googleTagManagerId.value is defined and googleTagManagerId.value and not seomatic.helper.isPreview %}
{{ dataLayerVariableName.value }} = [{% if dataLayer is defined and dataLayer %}{{ dataLayer |json_encode() |raw }}{% endif %}];
(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'{{ googleTagManagerUrl.value }}?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','{{ dataLayerVariableName.value }}','{{ googleTagManagerId.value }}');
{% endif %}..and add the script attribute in:
And then include the CookieBot script in the <body> tag or you could create your own tracking script in SEOmatic for the CookieBot script
from craft-seomatic.
robzor
commented on June 2, 2024
For me this final method appears to work fine, however it looks to me like SEOmatic is rendered too far down the head.
In my Google Tag Assistant, it complains that the default consent state wasn't set in time.
If I hardcode the gtag consent + gtm tag directly in the head as the first thing, the error goes away.
Yes, I'm currently just hardcoding it all into the head which is a shame :(
from craft-seomatic.
khalwat
commented on June 2, 2024
I'm going to re-open this to see if there's something more interesting I can do about it
from craft-seomatic.
robzor
commented on June 2, 2024
Thanks @khalwat , I really appreciate all your work and how many hours your plugins have saved me, so I hope you haven't thought I was moaning too much in this thread!
If you look at the https://support.cookiebot.com/hc/en-us/articles/360009192739-Google-Tag-Manager-and-Automatic-cookie-blocking page, and code example on that page, I guess my request would be "how could I replicate this identically with the GTM tracking scripts area in SEOMatic, with the proviso that <script> tag 1 and 3 were manually added into the template by me"
from craft-seomatic.
khalwat
commented on June 2, 2024
Relevant here is also:
https://developers.google.com/tag-platform/security/guides/consent?consentmode=advanced
I think it's possible that if I bake this into the scripts in SEOmatic, this might get us most of the way there
from craft-seomatic.
robzor
commented on June 2, 2024
My only thought is that maybe <script data-cookieconsent="ignore"> being on both the Consent Mode and GTM init tags is important? Or rather, that they are 2 separate script tags is important?
Otherwise, the main issue I had in a nutshell was that SEOmatic injected the script right before the closing </head> tag so it was impossible to 'add' anything after it, which is what CookieBot required.
from craft-seomatic.
Related Issues (20)
- The body tag is hidden when the scripts are loaded HOT 2
- SEOMatic tags don't auto render on website HOT 4
- Draft entries show wrong social media preview images
- Duplicated Section in Content SEO and Sitemap HOT 1
- SEO Title Source Field does not show all available fields HOT 2
- Set Meta Robots value on per-entry basis HOT 3
- Fallback if fields used for description are empty HOT 7
- Title and description for custom pages HOT 6
- Empty values in JSON should be null not [] HOT 3
- Craft 5 Type Error caused by missing SourceId when trying to edit matrix block (entry type) HOT 6
- SEO Meta Descriptions and Page Titles not matching in Google Search HOT 1
- Allow to set noindex,follow in the SEO settings field HOT 3
- Use entry variables in meta tags HOT 3
- Including indexable files within the XML sitemap via related download entries HOT 3
- Alt Tags not being seen through site audit on multiple crawlers HOT 1
- Google Web Stories HOT 1
- Error on save SeoMatic settings HOT 2
- Unable to change SEO metafields after changing entry type HOT 5
- How to update frontendTemplatesContainer via content migration HOT 2
- [5.0.2] - Error rendering template string -> Variable "date" does not exist HOT 4
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from craft-seomatic.