omktg
Active Member
CLICK HERE FOR THE UPDATE: Adding Your Facebook Pixel and Track Pixel Events OnClick on your store tutorial
Click here to read the first part: [It looks that i cant add more that 1000 characters in a single post here]
https://forum.alidropship.com/threa...-pixel-to-your-alidropship-theme-part-1.7812/
And here the InitiateCheckout event code.
Now go to your Alidropship store, and open the Customization tab at the bottom left of the page.
Now click on the Head tab, and paste your Pixel code in the <head> section and hit save settings.
Now, install the FB Pixel Helper addon for Google Chrome:
Facebook Pixel Helper Addon
Then Purge all cache form your site. If you are using Cloudflare purge all chache there too.
Now open your site in an incognito window, and navigate to the homepage, if you have the pixel helper installed, click on it, and your will see that the default PageView event is loading correctly.
Now, lets return to your site dashboard, and navigate to customization > Single Product > and paste the ViewContent event at the end of the shipping and payment box and hit save. I did it, and it worked fine, because that box loads every time a user arrives into a product page, so this means that our ViewContent Event on Facebook will show every user that lands in one of our product pages.
Next, click the Thank You tab, and Paste Your Purchase event code into the first conversion tracking script box. This will load each time a user completes a purchase successfully.
Now lets do the same for the Payment Fail box [Conversion tracking script]
But this time, we are going to change it a little bit. We need to change this because we dont want to track a purchase if the payment failed. So i changed the track to trackCustom [this is how Facebook knows it s a custom event], and i added NOPurchase instead of purchase. You can change it yourself, or just copy the one i pasted before and hit save.
So each time the payment failed for any reason: maybe the user did not complete the order, etc you will see that this event will track that inside your FB account.
Now, go to Checkout, and paste your InitiateCheckout event code after the footer text you have there and hit save.
This will add the code to the cart page. So our Initial Checkout event will be the cart page, before the user fills out his information.
Now, remember, purge all cache, and open your site in an incognito window to test the events.
Here you can see that the PageView default event is working fine in the homepage.
In the image below, you will see that in my test, the ViewContent Event is working perfectly in a product page.
Now here you can see that my InitiateCheckout event is loading, but it has an alert sign. i clicked on it to see what was happening, and it showed that the pixel here fired 2 times.
That was weird, so i checked the source code of that page, and noticed that the theme i was testing on [Michelangelo] was still creating a pixel code here, like in the past theme versions.
So this could be because some part of my site was still cached, or because the theme or plugin is really creating the pixel there, maybe the Alidropship team forgot to delete something there.
But anyway, i checked my FB account, and even with that alert sign, the pixel loaded fine.
And finally, here you can see the custom event i set up in case the purchase failed. As you can see it loads correctly.
So i assume, that the purchase event will load fine. You will need to make a purchase or maybe via COD to test it.
Hope this help guys.
But if you find of all this too difficult, maybe it is a better idea to buy the Facebook Business Addon Here. I haven't test it yet, but an advantage could be that it will let your create product catalogs, it includes 6 events already added to the plugin, it works with both version, WOO and Alidropship original, and you wont have to worry about adding or changing codes in your site.
Click here to read the first part: [It looks that i cant add more that 1000 characters in a single post here]
https://forum.alidropship.com/threa...-pixel-to-your-alidropship-theme-part-1.7812/
And here the InitiateCheckout event code.
Now go to your Alidropship store, and open the Customization tab at the bottom left of the page.
Now click on the Head tab, and paste your Pixel code in the <head> section and hit save settings.
Now, install the FB Pixel Helper addon for Google Chrome:
Facebook Pixel Helper Addon
Then Purge all cache form your site. If you are using Cloudflare purge all chache there too.
Now open your site in an incognito window, and navigate to the homepage, if you have the pixel helper installed, click on it, and your will see that the default PageView event is loading correctly.
Now, lets return to your site dashboard, and navigate to customization > Single Product > and paste the ViewContent event at the end of the shipping and payment box and hit save. I did it, and it worked fine, because that box loads every time a user arrives into a product page, so this means that our ViewContent Event on Facebook will show every user that lands in one of our product pages.
Next, click the Thank You tab, and Paste Your Purchase event code into the first conversion tracking script box. This will load each time a user completes a purchase successfully.
Now lets do the same for the Payment Fail box [Conversion tracking script]
But this time, we are going to change it a little bit. We need to change this because we dont want to track a purchase if the payment failed. So i changed the track to trackCustom [this is how Facebook knows it s a custom event], and i added NOPurchase instead of purchase. You can change it yourself, or just copy the one i pasted before and hit save.
So each time the payment failed for any reason: maybe the user did not complete the order, etc you will see that this event will track that inside your FB account.
Now, go to Checkout, and paste your InitiateCheckout event code after the footer text you have there and hit save.
This will add the code to the cart page. So our Initial Checkout event will be the cart page, before the user fills out his information.
Now, remember, purge all cache, and open your site in an incognito window to test the events.
Here you can see that the PageView default event is working fine in the homepage.
In the image below, you will see that in my test, the ViewContent Event is working perfectly in a product page.
Now here you can see that my InitiateCheckout event is loading, but it has an alert sign. i clicked on it to see what was happening, and it showed that the pixel here fired 2 times.
That was weird, so i checked the source code of that page, and noticed that the theme i was testing on [Michelangelo] was still creating a pixel code here, like in the past theme versions.
So this could be because some part of my site was still cached, or because the theme or plugin is really creating the pixel there, maybe the Alidropship team forgot to delete something there.
But anyway, i checked my FB account, and even with that alert sign, the pixel loaded fine.
And finally, here you can see the custom event i set up in case the purchase failed. As you can see it loads correctly.
So i assume, that the purchase event will load fine. You will need to make a purchase or maybe via COD to test it.
Hope this help guys.
But if you find of all this too difficult, maybe it is a better idea to buy the Facebook Business Addon Here. I haven't test it yet, but an advantage could be that it will let your create product catalogs, it includes 6 events already added to the plugin, it works with both version, WOO and Alidropship original, and you wont have to worry about adding or changing codes in your site.
Last edited: