I am trying to create a product catalog on Facebook using their pixel
The docs are here: https://www.facebook.com/business/help/887775018036966
Facebook detects the product information using the microdata (which is a json inside script tag)
The problem is that Facebook pixel reads this data automatically and it doesn't happen on a single page application except for the first page.
Is there any way to make Facebook read the microdata manually?
Create a new html file for your product page and then set URL redirects to go to that Html then every time someone views a product the FB pixels runs again and automatically detects the microdata
I found a way to force it to re-read microdata by adding a listener on routeChange event in next/router and replacing the href property in window.location object
router.events.on("routeChangeStart", (url) => {
window.location.href = url;
})
Related
Let's say I have a landing page URL that is not on my own site, www.notmysite.example/somepage and I want to advertise this link. I would like to create a URL that is tracked through my G4A Tag Manager, whereby the link click, referrer, etc., are all tracked in a G4A campaign.
I found this video that uses the older Universal Analytics and it's looks like a convoluted solution.
Basically, I just want an intermediary link that tracks the click and redirects to the proper page.
Since I do have access to a WordPress site that has G4A tracking, I'm thinking of creating a redirect on that page that reads the URL parameters. However I'd rather not have to deal with another system and configure redirects this way.
How can I accomplish this with G4A and Google Tag Manager?
-- UPDATE --
I'll try to clarify. Given a link like a GoFundMe campaign link, GoFundMe has their own internal tracking and analytics. However, I can't see how to add tracking to that link for my own personal use and/or see analytics on their site. Therefore, I want to create my own link that does the analytics tracking then forwards the user to the desired page.
In following the video I cited above, I was able to create an intermediary link capture but it does require a page on your website, where you can add a brief "loading" image or something.
This solution involves the following steps:
url-redirect_parameter URL variable, where if the "redirect" query key is present, it will fire
Create a redirect CUSTOM JavaScript variable that reads the url-redirect_parameter variable
function() {
try {
return {{url-redirect_parameter}}?setTimeout(function(){window.location='{{url-redirect_parameter}}'},500):false;
}
catch(e) {
return e;
}
}
This custom JS variable references a redirect tag with the following configurations
redirect Trigger trigger that to your GA tag on your website
What this captures now is whenever there is a "redirect=" in the query string, the trigger will fire, record and redirect.
Another solution is just to add UTM parameters to a page you control on your site and have code on that page to auto-redirect to a QS parameter as well. This essentially does just that by injecting JS that does the redirect if the QS is present.
I hope his helps someone else looking for a similar solution and open to other solutions, like a G4A solution.
Here is the Universal Analytics result:
Not quite understand your situation and your goal based on your explation.
But assuming you have back-end access to where you'll be adding the link you wanted to track, you can also track event using google data layer instead of redirects
All you have to do is listen to the click event of the button
e.g.
Click Me
event and datalayer
const link = document.getElementById('track-me')
link.addEventListener('click', function() {
window.dataLayer = window.dataLayer || [] // this should have been already in your script if you are using GA script
dataLayer.push({
'event': 'click',
'time': new Date().toLocaleString(),
'clickFrom': window.location.href,
'referrer': document.referrer
})
})
I'm building a wordpress site with elementor pro.
I want to make a form (in which you enter some numerical data as metric cubes and other numbers) that redirects you to another page where that data is transformed. How can I do that?
maybe you can use a template with html javascript linked by an external link button
When redirecting to the other page (eg: site.com/other-page) you could include the "numerical data" as a Query String directly in the redirected URL (eg: site.com/other-page?data=1234). Then, upon initial loading of the other page, the data can be retrieved from the URL
With Google Tag Manager, I want to create a tag that tracks the originating page that links to a form that is in an Iframe, why is a form in an Iframe, because I deal with netsuite, I know, horrible. Anyways, I want to be able to submit the form and pull the url or element by id from the original page where it was linked from. No cross domain as it is all within the same domain. Thank you all for any help.
Well for Form ID and Page url you will need you have predefined variable in GTM
http://take.ms/PPdTj
And for Url of the page on which the iframe exist you would have to modify the href of the iframe and append a parameter with required page url
and then extract the query param using gtm
Does anyone know if/how I can escape the shebang or encode the uri to make a link work properly in google analytics url builder? I want to add campaign parameters to product page urls to track ads success. The url for each individual product page looks like this:
http://www.oursite.com/classic-movies/#!/Title-of-Movie/p/12345678
When I put the product page url into the url builder, it says the url is invalid. I think it is because of the #!. I have tried escaping out the special characters, replacing the shebang with %23%21 or %21!
It appears valid in the url builder, and the builder generates a link with utm tags, BUT when you paste the tagged link into the browser, it does not take you to our product page. It takes you to our website, but gives a "sorry does not exist" message.
I also tried this:
http://www.oursite.com/classic-movies/?_escaped_fragment_=/Title-of-Movie/p/12345678
It generates a link in the builder and does link to the product page of our website (yay!), but the url adds this after the campaign name: #!/Title-of-Movie/p/1234567
The shebang is back! Will that be a problem?
For reference, we're using the Ecwid storefront plugin for a wordpress site.
Thanks in advance.
Short answer
You should use the URL without fragment (hash part) as a base for building URLs with queries (the part starting with '?') and then append the hash part to the end of URL.
Example:
1) Take http://www.example.com/classic-movies/#!/Title-of-Movie/p/12345678
2) Remove hash part: http://www.example.com/classic-movies/
3) Use this hash-free URL as a base and add query parameters yourself or use any automatic builder. Example: http://www.example.com/classic-movies/?utm_source=myblog&utm_campaign=xyz&abc=def
4) Append the hash part to the end of the URL: http://www.example.com/classic-movies/?utm_source=myblog&utm_campaign=xyz&abc=def#!/Title-of-Movie/p/12345678
You're done – the final URL is valid URL which will work fine for browser/customer, your site server and tracking tools like Google Analytics
Long answer
1) URLs could be very different, but their structure is actually quite the same and that's a part of the web standards.
URL is built this way:
protocol://site/path?query#fragment
(I simplified it and take in consideration only the parts we're talking about, the actual scheme is a bit more complicated)
Taking your product page URL, that will be:
protocol: http
site: www.example.com
path: classic-movies/
query: (empty)
fragment: !/Title-of-Movie/p/12345678
Now, if you want to add query parameters, you know where to insert them. As to the fragment part, it should be always in the end, regardless of whether it contains !
2) Google Analytics doesn't track the fragment parts of the URLs.
Urls like http://www.example.com/coolpage and http://www.example.com/coolpage#!anyparameter=anyvalue are the same for Goolgle Analytics. That's likely the reason why their URL builder tool doesn't accept that.
By the way, Ecwid uses fragment part of the URL all the time to address the product and category pages, but that's not an issue if you want to track your product pages in Google Analytics. Ecwid solved that problem by sending special 'virtual' page views to Google Analytics every time a customer browses your store. So in your GA reports you will see your store pages.
3) If you use Google Adwords for your ad campaigns, I'd suggest linking your Google Analytics and Google Adwords profiles to have better picture of customer behavior and the campaign performance. Check out this thread on Ecwid forums for the details:
http://www.ecwid.com/forums/showthread.php?t=10835
How can I preview or view WooCommerce endpoint pages such as the /order-received/ page without placing an order each time I want to view it?
I know how to edit the contents of WooCommerce endpoint pages, but I find it hard to work on the front-end if I can't preview the page.
There is no need to place a new order each time you want to preview the endpoint page.
Just place the order once and store the endpoint URL somewhere. You can re-visit the endpoint page as often as you want or even refresh the page after making changes in your code/styling.