- This topic has 6 replies, 2 voices, and was last updated 3 years, 8 months ago by David.
-
AuthorPosts
-
July 9, 2020 at 7:47 am #1357926Marcelo
Hello Team,
i am using AMP Story, and i am configuring Analytics, i did it well with a code from a blogger, but i want to use the Elements to do it instead the function.phpBut, when i try to do it using the Elements Analytics ¿dont work, if i use the code in the function it work.
Look,this is the code that can use in the function.php file to add Analytics on AMP:
function print_analytics_script() { if (is_singular('web-story')) { ?> <meta name="amp-google-client-id-api" content="googleanalytics"> <?php } } add_action('web_stories_story_head', 'print_analytics_script'); function print_body_analytics_script() { if (is_singular('web-story')) { ?> <amp-analytics type="gtag" data-credentials="include"> <script type="application/json"> { "vars": { "gtag_id": "UA-XXXXXXXXX-X", "config": { "UA-XXXXXXXXX-X": { "groups": "default" } } }, "triggers": { "storyProgress": { "on": "story-page-visible", "vars": { "event_name": "custom", "event_action": "story_progress", "event_category": "${title}", "event_label": "${storyPageIndex}", "send_to": ["UA-XXXXXXXXX-X"] } }, "storyEnd": { "on": "story-last-page-visible", "vars": { "event_name": "custom", "event_action": "story_complete", "event_category": "${title}", "event_label": "${storyPageCount}", "send_to": ["UA-XXXXXXXXX-X"] } } } } </script> </amp-analytics> <?php } } add_action('web_stories_print_analytics', 'print_body_analytics_script');
If i want to use it with elements i take the next code and create an Elements that can be read in a Single Story page and put it in the head or the body:
<amp-analytics type="gtag" data-credentials="include"> <script type="application/json"> { "vars": { "gtag_id": "YOUR_GOOGLE_ANALYTICS_ID", "config": { "YOUR_GOOGLE_ANALYTICS_ID": { "groups": "default" } } }, "triggers": { "storyProgress": { "on": "story-page-visible", "vars": { "event_name": "custom", "event_action": "story_progress", "event_category": "${title}", "event_label": "${storyPageId}", "send_to": ["YOUR_GOOGLE_ANALYTICS_ID"] } }, "storyEnd": { "on": "story-last-page-visible", "vars": { "event_name": "custom", "event_action": "story_complete", "event_category": "${title}", "send_to": ["YOUR_GOOGLE_ANALYTICS_ID"] } } } } </script> </amp-analytics>
How can i put the first code on an elements that works?
July 9, 2020 at 7:54 am #1358065MarceloI am thinking, the Story Rule Position work well, can i debug it?
July 9, 2020 at 8:05 am #1358085DavidStaffCustomer SupportHi there,
your first script is using the
web_stories_story_head
hook:add_action('web_stories_story_head', 'print_analytics_script');
in elements Hook List you can select Custom Hook – then you can paste in
web_stories_story_head
July 9, 2020 at 8:25 am #1358112MarceloStill dont work, i use that hook and i insert this code with my Analytic ID:
<meta name="amp-google-client-id-api" content="googleanalytics"> <script type="application/json"> { "vars": { "gtag_id": "UA-XXXXXXXXX-X", "config": { "UA-XXXXXXXXX-X": { "groups": "default" } } }, "triggers": { "storyProgress": { "on": "story-page-visible", "vars": { "event_name": "custom", "event_action": "story_progress", "event_category": "${title}", "event_label": "${storyPageIndex}", "send_to": ["UA-XXXXXXXXX-X"] } }, "storyEnd": { "on": "story-last-page-visible", "vars": { "event_name": "custom", "event_action": "story_complete", "event_category": "${title}", "event_label": "${storyPageCount}", "send_to": ["UA-XXXXXXXXX-X"] } } } } </script> </amp-analytics>
July 9, 2020 at 8:37 am #1358133DavidStaffCustomer SupportThere two functions hooks.
Hook #1
Hook Content:
<meta name="amp-google-client-id-api" content="googleanalytics">
Hook name:
web_stories_story_head
Display Rules:web-story
Hook #2
Hook Content:
<amp-analytics type="gtag" data-credentials="include"> <script type="application/json"> { "vars": { "gtag_id": "UA-XXXXXXXXX-X", "config": { "UA-XXXXXXXXX-X": { "groups": "default" } } }, "triggers": { "storyProgress": { "on": "story-page-visible", "vars": { "event_name": "custom", "event_action": "story_progress", "event_category": "${title}", "event_label": "${storyPageIndex}", "send_to": ["UA-XXXXXXXXX-X"] } }, "storyEnd": { "on": "story-last-page-visible", "vars": { "event_name": "custom", "event_action": "story_complete", "event_category": "${title}", "event_label": "${storyPageCount}", "send_to": ["UA-XXXXXXXXX-X"] } } } } </script> </amp-analytics>
Hook name:
web_stories_print_analytics
Display Rules:web-story
July 9, 2020 at 9:12 am #1358178MarceloNice, with only one hook, the second and it work.
Thank you!July 10, 2020 at 1:29 am #1358742DavidStaffCustomer SupportGlad to hear that
-
AuthorPosts
- You must be logged in to reply to this topic.