All things Shopify and commerce
All scripts which are included as "web pixels" via the new Shopify Web Pixels API are running in a sandboxed environment in an iFrame.
Unfortunately, this causes, that the UET tag from Microsoft Ads (formerly Bing Ads) does not track conversions correctly. I assume, that the tag is unable to get the correct URL parameters (including the MSCLKID), which is responsible for the conversion tracking.
One way would be to extract the parameter and send it along with the tag, but unfortunately the documentation from Microsoft is awful about the UET tag and does not state how to overwrite the parameters.
Is there any workaround for this? How do you guys track conversion from Microsoft Ads with the new Web Pixels API?
Solved! Go to the solution
This is an accepted solution.
An update on this for many of you following and questions.
I had prior set this up to look for a URL match but it seems Shopify has moved where the event fires, so I've made a slight change.
First, you need to set up the tag on the Microsoft side for an "event" type:
Then simply update your pixel code to this (note to put in YOUR tag id):
(function(w,d,t,r,u){var f,n,i;w[u]=w[u]||[],f=function(){var o={ti:"YOUR ID HERE", enableAutoSpaTracking: true};o.q=w[u],w[u]=new UET(o),w[u].push("pageLoad")},n=d.createElement(t),n.src=r,n.async=1,n.onload=n.onreadystatechange=function(){var s=this.readyState;s&&s!=="loaded"&&s!=="complete"||(f(),n.onload=n.onreadystatechange=null)},i=d.getElementsByTagName(t)[0],i.parentNode.insertBefore(n,i)})(window,document,"script","//bat.bing.com/bat.js","uetq");
analytics.subscribe("checkout_completed", (event) => {
uetq = uetq || [];
uetq.push('event','purchase',
{
'revenue_value': event.data.checkout.totalPrice.amount,
'currency' : event.data.checkout.currencyCode
});
});
Shopify will always fire the
checkout_completed
event, so no need to worry about where it's firing.
One of the commenters below, I agree, check your scope. I see one user was setting the event on a product type. Probably not your intent, it would only track the purchase of that one product.
I just turned off my old "additional script" and updated the Microsoft Channel app. It looks like they are handling this completely. See the attached screenshot.
My prior reply wasn't quite right. The app is using the scripts api to inject that.
However, I got this all to work.
Create a custom pixel with the following code:
(function(w,d,t,r,u){var f,n,i;w[u]=w[u]||[],f=function(){var o={ti:"PUT YOUR ID HERE", enableAutoSpaTracking: true};o.q=w[u],w[u]=new UET(o),w[u].push("pageLoad")},n=d.createElement(t),n.src=r,n.async=1,n.onload=n.onreadystatechange=function(){var s=this.readyState;s&&s!=="loaded"&&s!=="complete"||(f(),n.onload=n.onreadystatechange=null)},i=d.getElementsByTagName(t)[0],i.parentNode.insertBefore(n,i)})(window,document,"script","//bat.bing.com/bat.js","uetq");
analytics.subscribe("checkout_completed", (event) => {
uetq = uetq || [];
uetq.push('event','',
{
'revenue_value': event.data.checkout.totalPrice.amount,
'currency' : event.data.checkout.currencyCode
});
});
Then in your Microsoft ads conversion, change it to track the destination URL to:
Contains: processing?completed=true
The sandbox fires on this, not the "thank-you" so that's how you can get it to track. I tested this with the UET testing tool in Microsoft ads, it works beautifully.
I don't really understand your reply, because your uetq event does not event have an event name.
Also, the problem on our side is not that the event and the value are not sent, they are and Microsoft receives them with correct values. But the problem is, it can't match it to the conversions. So I think the msclkid parameter is somehow missing.
If I use the UET chrome plugin to test conversions, I get a valid test when my goal conversion has the destination URL set to "contains:thank_you" and when I set it to "contains:processing?completed=true" the conversion no longer gets recorded.
However, regardless of whether or not my conversion is getting recorded in the UET chrome plugin helper, my tracking status is "no recent conversions"
Do you know if this will remain as "no recent conversions" until I have an actual conversion from Bing OR will any conversions on my site cause the tracking status to be set to "recording conversions"
(Also replying to @wearebandb here)
If you are getting a valid test on "contains:thank_you" are you testing on the new checkout with extensibliity or still the old? That's the final url of the old checkout, if you make the new one active you'll notice it ends on "thank-you" which is subtly different.
Everything I put above is assuming you've already switched. There's no way to test this side-by-side that I know of, because it's so completely different. The good news is that the new checkout extensibility will let you revert; just make sure you save off your code in "additional scripts" because it makes you delete that before you can upgrade.
When you set up the conversion event with Microsoft of the destination url type, then it gives you the code to insert on the page, you only get a recorded conversion if that event pushes on the page you defined.
In the new shopify pixels model you need to subscribe to the events in the javascript as a more reliable trigger and to access certain data. There's a checkout complete event, and that's where you put the code Microsoft provides for conversion, which in my script above is the call to uetq.push() passing in the dollar amounts. Note, that's code I've cleaned up to work in the scope of Shopify's pixel sandbox.
I specifically found that this Shopify event fires in the scope of a dynamic URL but has "processing?completed=true" in the query string.
If microsoft code fires && url = destination url configured in ads, conversion happens. @wearebandb It doesn't matter that it doesn't have an event name. Their logic is taking care of that and when you push it the revenue fields it sees that as the conversion. That's why they give you this block of code to record it.
So here's how you can test it:
It's working perfectly for me; if it's not working for you, it's most likely something you've done wrong / don't understand about the eventing model.
I guess I must be testing on the old checkout. Do you know if we have to switch over to the new checkout for UET to work properly?
I tried following the implementation directions here: https://help.ads.microsoft.com/apex/index/3/en/56901
But my revenue information wasn't getting passed through when testing with the UET chrome plugin. Shopify was suggesting I set up tracking with pixels, which is what led me to this thread. When I use your pixel code to pass the revenue information, I see the revenue information appear in my UET plugin when testing. HOWEVER, I still get the following error message:
What I'm outlining is undocumented and unsupported. Microsoft has yet to publish guidance on UET conversion tracking with the new pixels api. It's all just javascript, I figured out how and where to make it work just as it does today. In the future, I'm sure Microsoft will back this into their Shopify Channel app, in which case I'll have to quickly disable this in order to not record conversions more than once.
So, as I mentioned above, yes you would have to be on the new checkout for my steps above to work. It's all specific to the changes that happen as a result of the new checkout.
As far as your last question, I do not know for certain but I'd say it only shows "Recording conversions" if it's actively recording a conversion, which requires a purchase that was influenced by an ad.
This is why the UET tag helper is your friend. It mocks a conversion. If it completes, then you can rest assured that conversions will record when you are running successful ads.
Understood, thanks for the quick replies!
Thanks for your reply.
We had Bing conversion goal of the type "Product" and category "Purchase" set up, as you can see here:
Now I've set up a second one which doesn't listen on the "Purchase" event, instead as you said on the URL. I don't know why this should be the problem, but it's possible that this is the solution.
Will keep you updated.
It's the solution, because the documented and preferred method from Microsoft currently is to set up a destination URL conversion event using the code the wizard gives you to record the conversion and dollar amount.
What they have not accounted for in their docs (or official app) is the changes due to the new checkout, which are:
That said, you can absolutely use some other means of doing it. Depending on the type of conversion set up, they will give you different javascript snippets, which fire different types of events in their API. You can make those work, but you will have to modify to work in the new pixel sandbox. Specifically they have an "event" type conversion which is not dependent on the URL. It's an explicit "this is a conversion" type event. Whenever you fire it, that's it, that's your conversion. Similarly, you'll have to take the starter code that Microsoft gives you and modify to work in the new pixels sandbox. Subscribe to the checkout complete event and find the values you need in the data that's passed to the event.
Again, it will only work if you've turned the new extensibility on.
Thanks for this info @jtaylormatchles . Did not realize how simple creating your own pixel was.
Only thing different I did was instead of using the URL as the conversion destination, I changed that to a purchase event and then send the data to that purchase event inside the checkout_completed event Shopify subscription.
Appreciate it!
Glad you found it helpful!
Hey @jtaylormatchles
We still have problems with our conversions. The strange thing is, that they are sent correctly, but not attributed correctly to a campaign (campaign is showing 0 conversions).
The tag setup is correct, as you can see on these screenshots (tested with Bing UET helper extension):
Also, the MSCLKID, which is responsible for matching the conversion to an ad campaign (which I set to 12345 in this test) is sent.
In Microsoft Ads, we can see that the event is received:
Exported data (you can see the same transaction ID):
Is there anything we forgot? Any campaign-related setting? Any help is appreciated.
With the UET helper, is it triggering an actual conversion? Or just an event? If it's not triggering the conversion then you haven't set it up properly. Depends on what your conversion event is. (URL, event, etc)
It triggers a "custom event". But what is the correct event name for a conversion? We already tried multiple names, i.e. "purchase" and now "PRODUCT_PURCHASE", which is shown by Microsoft Ads in the setup:
The tag setup:
Also keep in mind that conversions aren't going to show real time. That's what the helper is for, to validate that the criteria have been met for it to record.
@wearebandb Another thing to check is the Scope of your UET tag and scope of your conversion goals are matching.
The scope of the conversion goal is adjusted when setting up the goal.
The scope of my UET and the goal are not matching, yet when I get to the Edit Event Goal screen, I can only choose the one it's set to (not matching) or all accounts. I've set it to all accounts now, but is this right? Is there something different I should be doing?
Hi Wearebandb, what was your solution to getting it to attribute to the proper campaign? I'm having troubles with this at the moment.
Hey @Timed_Ecom ! Any possibilites to share your created pixel using the purchase event? Need to setup conversion tracking for Microsoft Ads with a custom pixel.
Also looking for an update on this whole issue. We are wanting to utilize the new Status and TY pages but cant due to conversions not working correctly for Bing.
See my latest update. You need to change to use an event trigger, not a URL trigger. Then one small change to the pixel code.
Use:
(function(w,d,t,r,u){var f,n,i;w[u]=w[u]||[],f=function(){var o={ti:"YOUR ID HERE", enableAutoSpaTracking: true};o.q=w[u],w[u]=new UET(o),w[u].push("pageLoad")},n=d.createElement(t),n.src=r,n.async=1,n.onload=n.onreadystatechange=function(){var s=this.readyState;s&&s!=="loaded"&&s!=="complete"||(f(),n.onload=n.onreadystatechange=null)},i=d.getElementsByTagName(t)[0],i.parentNode.insertBefore(n,i)})(window,document,"script","//bat.bing.com/bat.js","uetq");
analytics.subscribe("checkout_completed", (event) => {
uetq = uetq || [];
uetq.push('event','purchase',
{
'revenue_value': event.data.checkout.totalPrice.amount,
'currency' : event.data.checkout.currencyCode
});
});
with your tag ID
Set your tag up to track on an event not a URL match.
(this is the uetq.push('event','purchase'..... )
This is an accepted solution.
An update on this for many of you following and questions.
I had prior set this up to look for a URL match but it seems Shopify has moved where the event fires, so I've made a slight change.
First, you need to set up the tag on the Microsoft side for an "event" type:
Then simply update your pixel code to this (note to put in YOUR tag id):
(function(w,d,t,r,u){var f,n,i;w[u]=w[u]||[],f=function(){var o={ti:"YOUR ID HERE", enableAutoSpaTracking: true};o.q=w[u],w[u]=new UET(o),w[u].push("pageLoad")},n=d.createElement(t),n.src=r,n.async=1,n.onload=n.onreadystatechange=function(){var s=this.readyState;s&&s!=="loaded"&&s!=="complete"||(f(),n.onload=n.onreadystatechange=null)},i=d.getElementsByTagName(t)[0],i.parentNode.insertBefore(n,i)})(window,document,"script","//bat.bing.com/bat.js","uetq");
analytics.subscribe("checkout_completed", (event) => {
uetq = uetq || [];
uetq.push('event','purchase',
{
'revenue_value': event.data.checkout.totalPrice.amount,
'currency' : event.data.checkout.currencyCode
});
});
Shopify will always fire the
checkout_completed
event, so no need to worry about where it's firing.
One of the commenters below, I agree, check your scope. I see one user was setting the event on a product type. Probably not your intent, it would only track the purchase of that one product.
Hey @no_robotocha @oskarnym @wcolton48 @Timed_Ecom
Sorry for the late reply. But yes, as @jtaylormatchles stated above, the problem in our case was not in the tracking code, it was in the settings of Microsoft Ads, because they are really confusing and unclear.
However, conversion tracking works again, you have to make a conversion of goal type Event, not Product. Then you can push an event to ueq (name it as you want, but I recommend purchase) and make sure the same event name is configured in the "action equals to" setting in the Microsoft conversion settings.
Thanks for any help until here.
Hi Jyaylor, do you know how long it takes for Microsoft to update the dashboard? I see the events firing in the UET tag section within Microsoft, but it shows no conversions on the dashboard. I've followed all instructions
I do not know, but it's easy to fire events and not capture the conversion, there is subtlety to how this is set up and it's easy to get wrong.
Bottom line is that you should be testing a checkout and conversion with the UET tag helper, which will show you real time whether or not it recorded a conversion. If so, you should be good.
Interestingly, the UET tag tracks the custom event saying 'purchase', but says there is an error and the Microsoft dashboard never tracks it. Very weird.
I did so, Added code to customer events and set up conversion goal type as event , but still I getting iframe error,
Hi @Mohnish01
This shouldn't be a problem. It's more of a warning than an error. We also have this, and the conversion tracking works.
Hi @wearebandb ,
Thank you for replying, I am unable to track any conversion from very long.
Can you send a screenshot of the event tracking settings in Bing?
Yes sure, @wearebandb
And here's my code:-
(function(w,d,t,r,u){var f,n,i;w[u]=w[u]||[],f=function(){var o={ti:"my_UET_id", enableAutoSpaTracking: true};o.q=w[u],w[u]=new UET(o),w[u].push("pageLoad")},n=d.createElement(t),n.src=r,n.async=1,n.onload=n.onreadystatechange=function(){var s=this.readyState;s&&s!=="loaded"&&s!=="complete"||(f(),n.onload=n.onreadystatechange=null)},i=d.getElementsByTagName(t)[0],i.parentNode.insertBefore(n,i)})(window,document,"script","//bat.bing.com/bat.js","uetq");
analytics.subscribe("checkout_completed", (event) => {
uetq = uetq || [];
uetq.push('event','purchase',
{
'revenue_value': event.data.checkout.totalPrice.amount,
'currency' : event.data.checkout.currencyCode
});
});
analytics.subscribe("checkout_started", (event) => {
window.uetq = window.uetq || [];
window.uetq.push("event", "BeginCheckout", {"revenue_value":event.data.checkout.totalPrice.amount,"currency":"USD"});
});
Looks correct. And you have set the correct conversion action in your campaign settings?
Yes @wearebandb ,
its correct, also I are able to get insights of events, but the tracking status doesn't shows any conversion, which is hampering the performance of my ad campaigns
Unfortunately not, everything looks correct. Probably @jtaylormatchles can help?
An event doesn't necessarily equal conversion. When you set up the pixel and track events, you're always going to get that data (if you're looking at the UET data). It's only going to show a conversion if it truly is a conversion. In your case, the customer clicked on that exact ad, and within your conversion window.
There's nothing really more to explain than what you show in your screenshot. It defines the time window in which a click turns into a conversion. If you set to 30 days, and the purchase happens on day 31, it won't count as a conversion.
What should be the ideal setup for this, is this causing any issue, I have selected event type and inline action , my event tracked set as "track event on inline action" in next steps.
I am able to track the purchase event in UET tag helper but still I can't see any recent conversion in my conversion goal
Sorry, there's nothing more I can really do for you here. Everything is documented in this thread on how I got it to work. My guess is that you don't actually have any conversions happening. If you are seeing the event data, and the UET tag helper shows that it's working, that's pretty much what it has to be. Either that or you have a problem with your pixel code somewhere, but I'm afraid I can't support this for you. I'm just a fellow store owner, sharing what worked for me.
@jtaylormatchles
Here's my pixel code:-
(function(w,d,t,r,u){var f,n,i;w[u]=w[u]||[],f=function(){var o={ti:"tag_ID", enableAutoSpaTracking: true};o.q=w[u],w[u]=new UET(o),w[u].push("pageLoad")},n=d.createElement(t),n.src=r,n.async=1,n.onload=n.onreadystatechange=function(){var s=this.readyState;s&&s!=="loaded"&&s!=="complete"||(f(),n.onload=n.onreadystatechange=null)},i=d.getElementsByTagName(t)[0],i.parentNode.insertBefore(n,i)})(window,document,"script","//bat.bing.com/bat.js","uetq");
analytics.subscribe("checkout_completed", (event) => {
uetq = uetq || [];
uetq.push('event','purchase',
{
'revenue_value': event.data.checkout.totalPrice.amount,
'currency' : event.data.checkout.currencyCode
});
});
analytics.subscribe("checkout_started", (event) => {
window.uetq = window.uetq || [];
window.uetq.push("event", "BeginCheckout", {"revenue_value":event.data.checkout.totalPrice.amount,"currency":"USD"});
});
Sorry, just want to clarify. I'm not any official support channel and I'm not going to be able to resolve this one for you. I've already put an incredible amount of effort and detail into the solution shared, but at this point you're going to have to dig in and debug and troubleshoot what could be different and / or configured incorrectly.
At this point I would suggest you:
After having it for years, my Microsoft channel still does not work, and their tech support is totally useless.
Conversions do not work.
I am not sure what to do.
First issue is the MS pixel shows as disconnected. I can't edit it, delete it, or change it. When I click on the pixel, it just opens the MS Channel App.
When I created my own pixel, it says it is in sandbox. I don't know what that means, but it must not be good. What do I do about that?
In the accepted solution, it says to put "YOUR tag id." What is that? Where do I find it?
When I showed MS Tech support your solution, they spent 2.5 hours doing everything other than the code you provided. It was comical. It would have taken 5 min to follow your instructions, but kept babbling stuff that did not seem relevant to me. Then after failing, they said it was all Shopify's fault and that it can't work until Shopify fixes it.
I'm going to reply to this post that you made, but I see your follow-ons as well.
First off, I think your anger at Microsoft is a bit misguided. The solution I present here is completely my own, unsupported, and not endorsed by Microsoft in any way. Of course they know nothing about it. Of course they aren't going to help you put unsupported code from a forum into your store. It also seems like throwing stones in a glass house here, when you don't know what a sandbox is, or where to get your UET Tag ID. Clearly, this is far out of your comfort zone and you aren't a coder. You should probably not be undertaking this without some help. You have a question below about testing it. Again, this is something that should already be known by someone doing this type of work (and, btw, if you read this thread there are multiple references to testing the change).
I want to make sure you're aware at how this came about:
In my own case, I made a conscious decision to upgrade my checkout, knowing it would break conversion tracking, and then I decided to find a solution, because I do understand how it all works, and I'm a coder.
So, I'd just say, before you start blaming a multi-trillion dollar company (yes, that's right. Their market cap is in the trillions, not billions), did you go and upgrade to checkout extensibility without understanding the repercussions, researching mitigation, and having the means to implement your own solution?
The quality of support you get from any company is in direct correlation to the level of information you give them to work with. Based on what I've seen here, I can understand how and why you may have had a less than ideal support outcome.
You're welcome for the solution. But if you just c/p'd the pixel, you only have half of the solution implemented.
I spend $400 daily with Meta and $200 with Google. Rudimentary conversion tracking is the minimum feature needed to get a good ROAS. It is a must.
Nothing fancy. Just the very, very basic to track ROAS.
I have my credit card in hand and am ready to go. MS needs to provide a basic feature that everyone, even pros and amateurs, can agree is essential.
Without that basic function, Microsoft has nothing to sell.
For a well known bug that stops thousands of potential Shopify stores from spending hundreds if not thousands per day, there should be SOP script their people should have access to.
I can't be the first person to hit this problem on Shopify.
Meta works fine. Google works fine, but poor MS is out in the cold for years.
I am not a coder. I have maybe 45 min per day week days to solve tech issues. If MS wants a couple a grand a month, then I expect delivery of the basics.
Besides, compared to Google and Meta, I really don't even see the point making the effor to use MS.
If they intend to snatch business from their competitors, they have to make it EASY and it has to work BETTER.
That is what 3rd place products have to do.
As 2024 wraps up, the dropshipping landscape is already shifting towards 2025's trends....
By JasonH Nov 27, 2024Hey Community! It’s time to share some appreciation and celebrate what we have accomplis...
By JasonH Nov 14, 2024In today’s interview, we sat down with @BSS-Commerce to discuss practical strategies f...
By JasonH Nov 13, 2024