#1 TikTok Ads Spy Tool

A Better Way to Make TikTok Ads Dropshipping & TikTok For Business

  • Find TikTok winning products & TikTok dropshipping ads.
  • Analyze TikTok advertisers
  • Get the Latest TikTok Shop Data.
Try It Free

Tracking Divi Forms with Google Tag Manager via FORM ID - Divi Wordpress theme FORM conversion s

Published on: December 6 2022 by FeedbackWrench

Tracking Divi Forms with Google Tag Manager via FORM ID - Divi Wordpress theme FORM conversion s

Tracking Divi Forms with Google Tag Manager via FORM ID - Divi Wordpress theme FORM conversion s

startTime durationTime text
00:00:00 00:00:05 hey folks if you have a wordpress
00:00:03 00:00:08 website built with divi the divi
00:00:05 00:00:09 wordpress theme from elegant themes and
00:00:08 00:00:12 you're trying to do
00:00:09 00:00:14 conversion tracking by using google tag
00:00:12 00:00:16 manager you with me i'm going to show
00:00:14 00:00:19 you how to do that there are some really
00:00:16 00:00:21 difficult things if you're using divi
00:00:19 00:00:23 with google tag manager now real quick
00:00:21 00:00:26 i'm going to show you specifically how
00:00:23 00:00:29 to track a contact form
00:00:26 00:00:30 how to track a contact form by the form
00:00:29 00:00:33 submission
00:00:30 00:00:34 rather than doing a thank you page now
00:00:33 00:00:36 just so you know in order to do
00:00:34 00:00:39 excellent google ads facebook
00:00:36 00:00:41 conversions google conversions analytik
00:00:39 00:00:42 conversions
00:00:41 00:00:45 when somebody were to come to your
00:00:42 00:00:47 website and let's say fill out a form
00:00:45 00:00:50 right so here i've got a basic wordpress
00:00:47 00:00:50 website and i go to contact
00:00:50 00:00:52 and
00:00:50 00:00:54 what i would want to do is if i was
00:00:52 00:00:56 running a google ad or a facebook ad or
00:00:54 00:00:59 a linkedin ad i would want
00:00:56 00:01:01 filling out this form
00:00:59 00:01:02 to trigger a conversion now
00:01:01 00:01:05 traditionally what a lot of people will
00:01:02 00:01:07 do is they will use a redirect to a
00:01:05 00:01:10 thank you page but i've found multiple
00:01:07 00:01:12 reasons why that doesn't work well and
00:01:10 00:01:15 it tends to get really clunky i don't
00:01:12 00:01:16 like that what i do is i always use and
00:01:15 00:01:18 here at feed background so we do web
00:01:16 00:01:20 design we can help you with this we do
00:01:18 00:01:23 digital marketing we create funnels
00:01:20 00:01:24 google ads remarketing and everything um
00:01:23 00:01:27 what i've found is that tracking with a
00:01:24 00:01:29 thank you page really doesn't um give
00:01:27 00:01:31 you the precision that's needed so what
00:01:29 00:01:34 i always do with our websites on webflow
00:01:31 00:01:37 on other themes is i use the form id or
00:01:34 00:01:38 when that form submission is made then
00:01:37 00:01:40 boom we have a
00:01:38 00:01:42 a what's called a trigger now if you're
00:01:40 00:01:44 not familiar with google tag manager
00:01:42 00:01:46 i'll cover just some basics but
00:01:44 00:01:48 basically what google tag manager is is
00:01:46 00:01:50 you put one javascript code in the head
00:01:48 00:01:52 and in the body of your website um so
00:01:50 00:01:54 what i do is you set up google tag
00:01:52 00:01:56 manager so here's i've actually set up a
00:01:54 00:01:59 google tag manager already and if i were
00:01:56 00:02:00 to go to um i don't want to do that and
00:01:59 00:02:03 when you're in here if we were to go to
00:02:00 00:02:05 admin what you'll see is that there is a
00:02:03 00:02:07 container setup
00:02:05 00:02:09 install google tag manager and there's a
00:02:07 00:02:11 head and a footer and if i were to come
00:02:09 00:02:12 into my and i'm gonna move really quick
00:02:11 00:02:14 so for those of you that already get
00:02:12 00:02:17 this i'm sorry but when you come into
00:02:14 00:02:21 your your divi wordpress um themed
00:02:17 00:02:22 website divi by elegant themes that that
00:02:21 00:02:25 wordpress
00:02:22 00:02:27 has a little bit of a hiccup here so i
00:02:25 00:02:30 come into divi and i go to the theme
00:02:27 00:02:32 options here and what i can do is i'll
00:02:30 00:02:34 go over to integrations
00:02:32 00:02:36 and i will take
00:02:34 00:02:40 again the way i got here was i went in
00:02:36 00:02:43 and i went to the admin um ah
00:02:40 00:02:44 sorry guys uh oh i have two of them
00:02:43 00:02:47 that's probably why this is happening
00:02:44 00:02:50 that's funny um
00:02:47 00:02:52 so when i come to admin i'll grab the
00:02:50 00:02:54 container so install google tag manager
00:02:52 00:02:56 or when you set it up it'll actually pop
00:02:54 00:02:58 up you grab the head code and you're
00:02:56 00:03:01 going to install that into the head
00:02:58 00:03:03 and then you will grab the body code
00:03:01 00:03:04 the body tag and put it in the body and
00:03:03 00:03:06 once you've done that you're going to
00:03:04 00:03:08 come in and you're just going to hit
00:03:06 00:03:10 save changes all right so that's normal
00:03:08 00:03:13 now usually what would be happening here
00:03:10 00:03:16 in a google tag manager is that google
00:03:13 00:03:19 tags has kind of two situations here
00:03:16 00:03:22 okay there are if then statements
00:03:19 00:03:23 happening okay so basically there's
00:03:22 00:03:26 triggers
00:03:23 00:03:29 and tags the triggers are the if so if
00:03:26 00:03:31 you fill out my form
00:03:29 00:03:34 that's a trigger or if you click the
00:03:31 00:03:36 link that's a trigger then the tag
00:03:34 00:03:39 is where we would say
00:03:36 00:03:40 fire a google analytiks tag fire a
00:03:39 00:03:43 google
00:03:40 00:03:44 conversion in google ads fire a facebook
00:03:43 00:03:47 conversion i'll show you how to do that
00:03:44 00:03:49 but that's the basics here well in order
00:03:47 00:03:52 to have a trigger what has to happen is
00:03:49 00:03:54 we have to have google tag manager
00:03:52 00:03:56 recognizing what's happening on your
00:03:54 00:03:57 website so usually so when you're in
00:03:56 00:03:59 google tag manager i'm going to move
00:03:57 00:04:01 quick now you would go to preview here
00:03:59 00:04:02 and what it'll do is it'll actually open
00:04:01 00:04:04 up this website
00:04:02 00:04:07 in two different
00:04:04 00:04:09 um tabs right so over here now i've got
00:04:07 00:04:11 this is tracking i'm previewing what's
00:04:09 00:04:14 going on in this whole website so i can
00:04:11 00:04:15 move around in fact if i click here over
00:04:14 00:04:18 here i can see that i click the link and
00:04:15 00:04:19 then the whole thing open okay so link
00:04:18 00:04:20 click
00:04:19 00:04:23 and then the new page is open here's the
00:04:20 00:04:25 second page from bottom to top these are
00:04:23 00:04:26 the actions that are occurring okay so
00:04:25 00:04:28 now
00:04:26 00:04:30 take a breath those of you that are new
00:04:28 00:04:31 for those of you that are already into
00:04:30 00:04:33 this um
00:04:31 00:04:36 fast forward a little bit so here's
00:04:33 00:04:38 what's going to happen usually on a
00:04:36 00:04:40 normal website that's not divi when you
00:04:38 00:04:42 do that
00:04:40 00:04:45 as you're clicking if you were to come
00:04:42 00:04:47 to a form and you filled it out
00:04:45 00:04:49 all of a sudden over here there would be
00:04:47 00:04:51 a form submit thing it would say form
00:04:49 00:04:52 submission
00:04:51 00:04:54 what you'll notike with divi is that
00:04:52 00:04:57 that does not occur
00:04:54 00:04:59 that doesn't happen and when that form
00:04:57 00:05:02 submits there would be some variables in
00:04:59 00:05:04 there a form id a form element id a form
00:05:02 00:05:06 class
00:05:04 00:05:08 that doesn't happen with divi well i
00:05:06 00:05:10 have a solution for you okay
00:05:08 00:05:11 and what will happen is the solution
00:05:10 00:05:14 will make it so that when you fill out
00:05:11 00:05:17 an actual divi now this is only a divi
00:05:14 00:05:20 form you could go in and use ninja forms
00:05:17 00:05:22 wp forms whatever it is but if you have
00:05:20 00:05:25 this type of form i'm going to show you
00:05:22 00:05:27 a workaround that will help you out so
00:05:25 00:05:30 now in the in this video in the
00:05:27 00:05:32 description is a little code okay and
00:05:30 00:05:34 this code
00:05:32 00:05:36 is a little javascript that we're going
00:05:34 00:05:38 to put in the body of our website okay
00:05:36 00:05:40 and you're gonna have to edit this just
00:05:38 00:05:42 a little bit it's not hard
00:05:40 00:05:44 so it's this simple script right here so
00:05:42 00:05:46 you have script and script okay
00:05:44 00:05:48 and what you'll see here
00:05:46 00:05:50 is that
00:05:48 00:05:53 it's a jquery it opens and all of a
00:05:50 00:05:54 sudden it starts looking for
00:05:53 00:05:58 this form and then we're going to give
00:05:54 00:06:00 it an attribute id a form id and that's
00:05:58 00:06:03 going to be we're going to
00:06:00 00:06:05 change this where it says your form here
00:06:03 00:06:07 this is where you're going to change so
00:06:05 00:06:09 all i'm going to do real quick is i in
00:06:07 00:06:11 fact i already typed it in
00:06:09 00:06:14 you can't have any spaces so make sure
00:06:11 00:06:16 there are no spaces in this name so just
00:06:14 00:06:19 change between the parentheses with no
00:06:16 00:06:20 spaces and this is going to be the form
00:06:19 00:06:23 id
00:06:20 00:06:26 when the elegant themes jquery fires
00:06:23 00:06:27 once you've changed that
00:06:26 00:06:28 without any spaces we're going to copy
00:06:27 00:06:31 this okay
00:06:28 00:06:33 and this is how you solve this you can't
00:06:31 00:06:36 see the form in google tag manager
00:06:33 00:06:37 with your elegant themes website so what
00:06:36 00:06:39 we're going to do here elegant themes
00:06:37 00:06:41 divi website we're going to hit
00:06:39 00:06:42 dashboard
00:06:41 00:06:44 and we're going to come back down to
00:06:42 00:06:46 that same place so divi and then theme
00:06:44 00:06:48 options and we're going to go over to
00:06:46 00:06:52 the integration tab again
00:06:48 00:06:54 and we are going to paste this
00:06:52 00:06:56 underneath where it says google and
00:06:54 00:06:59 google tag manager on a clean line we're
00:06:56 00:07:00 going to paste this in the body
00:06:59 00:07:03 inside the body and we're going to hit
00:07:00 00:07:04 save okay so once we save those changes
00:07:03 00:07:07 the next thing you have to do is you
00:07:04 00:07:08 have to dump your cache whatever you're
00:07:07 00:07:10 using to dump cache i kind of hate that
00:07:08 00:07:13 about wordpress caching is really
00:07:10 00:07:16 obnoxious it doesn't happen quickly once
00:07:13 00:07:19 that happens i'm going to show you
00:07:16 00:07:22 something so once you've done that
00:07:19 00:07:24 if you then come in and test it so
00:07:22 00:07:25 you'll have to dump the cache reload
00:07:24 00:07:28 your preview
00:07:25 00:07:30 and then what will happen is when you go
00:07:28 00:07:35 to your contact form and you fill out
00:07:30 00:07:37 the contact form as this is analyzing
00:07:35 00:07:38 it will recognize the form so this
00:07:37 00:07:41 solves
00:07:38 00:07:43 this major problem of not seeing the
00:07:41 00:07:45 form so now we have a form submit if i
00:07:43 00:07:47 look at the form submit now i've fired a
00:07:45 00:07:48 tag i've actually done some stuff around
00:07:47 00:07:49 this but when we look at the variables
00:07:48 00:07:50 here
00:07:49 00:07:52 we can come down and we can see that
00:07:50 00:07:54 when this click class happened
00:07:52 00:07:56 um down towards the bottom we're going
00:07:54 00:07:58 to have some um
00:07:56 00:08:00 some so you can see click text was the
00:07:58 00:08:02 send message you could do this by click
00:08:00 00:08:04 text if you got really stuck but down
00:08:02 00:08:05 here you're gonna see
00:08:04 00:08:09 form id
00:08:05 00:08:12 is the form id that i put in so bk now
00:08:09 00:08:14 i've done this video three times now
00:08:12 00:08:15 there's my form id so now once i have
00:08:14 00:08:17 that
00:08:15 00:08:20 what i can do is i can say when that
00:08:17 00:08:21 form id let's make a new recipe
00:08:20 00:08:22 in our google tag manager so what i'm
00:08:21 00:08:25 going to do is i'm going to come back
00:08:22 00:08:27 here and i'm going to create a trigger
00:08:25 00:08:30 that causes that to happen out all of
00:08:27 00:08:31 you advanced folks already know this but
00:08:30 00:08:32 basically what we're going to do is
00:08:31 00:08:35 we're going to go into we have to
00:08:32 00:08:36 increase our recipe or our ingredients
00:08:35 00:08:38 so we
00:08:36 00:08:39 right now you have to go to variables
00:08:38 00:08:42 and go to configure and we're going to
00:08:39 00:08:44 add in this form id as a recipe piece
00:08:42 00:08:46 and as you scroll down you hit this
00:08:44 00:08:48 configure again we have to add it and go
00:08:46 00:08:51 variables configure and then come in and
00:08:48 00:08:53 go down to i always turn on the clicks
00:08:51 00:08:55 and i turn on the form so all you do is
00:08:53 00:08:59 you just click all this stuff cancel
00:08:55 00:09:00 click click click click click x out
00:08:59 00:09:03 and now you've added them they are
00:09:00 00:09:04 potential ingredients within your google
00:09:03 00:09:06 tag manager now what we're going to do
00:09:04 00:09:08 is we're going to create a trigger okay
00:09:06 00:09:12 and so we're going to take a trigger
00:09:08 00:09:14 and i still have that form id i had i
00:09:12 00:09:15 copied it right i have that name and now
00:09:14 00:09:17 we're going to create a trigger we're
00:09:15 00:09:20 going to go new
00:09:17 00:09:22 trigger i already did one here um a new
00:09:20 00:09:25 form trigger so i'll show you what it
00:09:22 00:09:27 looks like from the beginning new
00:09:25 00:09:28 and i i'm going to paste this up here so
00:09:27 00:09:31 form
00:09:28 00:09:33 bksc that form id
00:09:31 00:09:34 equals this
00:09:33 00:09:37 and again this is going to be the
00:09:34 00:09:40 initiate initial initialization go to
00:09:37 00:09:43 form submission the initialization of a
00:09:40 00:09:44 recipe that we will make as a tag
00:09:43 00:09:46 so now we're saying when a form
00:09:44 00:09:48 submission happens all forms well we
00:09:46 00:09:50 don't want this to occur when all forms
00:09:48 00:09:51 happen we just want some forms and then
00:09:50 00:09:52 we're going to go here and we're going
00:09:51 00:09:56 to go
00:09:52 00:09:58 when the form id so some forms gives us
00:09:56 00:10:00 drop down when the form id
00:09:58 00:10:02 equals
00:10:00 00:10:03 that
00:10:02 00:10:06 form id
00:10:03 00:10:06 now we have a trigger okay
00:10:06 00:10:09 so
00:10:06 00:10:10 we have that trigger now i'm gonna quick
00:10:09 00:10:12 delete that because i've already made
00:10:10 00:10:14 this twice okay
00:10:12 00:10:16 now once we have that trigger we can do
00:10:14 00:10:18 some cool things so here are some of the
00:10:16 00:10:21 tags that we can make okay so you can
00:10:18 00:10:23 come in and you can say let's fire an
00:10:21 00:10:25 event in google analytiks
00:10:23 00:10:27 when that happens so that you can track
00:10:25 00:10:29 it okay you could also come in and
00:10:27 00:10:31 create a google ad conversion and maybe
00:10:29 00:10:34 that's what i'll do right now
00:10:31 00:10:36 let's just go into google ads
00:10:34 00:10:38 and as you set up a new account in fact
00:10:36 00:10:40 i'm setting up an account for this i'm
00:10:38 00:10:43 going to be the admin
00:10:40 00:10:45 and as this happens save and continue
00:10:43 00:10:47 there's two pieces to this i want to add
00:10:45 00:10:50 for you so this next video is going to
00:10:47 00:10:51 be how to use this trigger in a google
00:10:50 00:10:53 ad okay
00:10:51 00:10:55 hopefully this is helpful if you have a
00:10:53 00:10:57 divi themed wordpress website you're
00:10:55 00:10:59 trying to track
00:10:57 00:11:00 your form submissions using google tag
00:10:59 00:11:03 manager that's how you do it with a form
00:11:00 00:11:04 id how do you fix the form id tracking
00:11:03 00:11:06 system
00:11:04 00:11:08 on elegant themes good luck god bless
00:11:06 00:11:12 hopefully that was helpful because it
00:11:08 00:11:12 was a pain for me to figure out