Can I capture Screen Resolution?
I’m interested in understanding what screen resolution my users are using when they experience my application. Does Pendo track this?
7
I’m interested in understanding what screen resolution my users are using when they experience my application. Does Pendo track this?
Comments
You can use track events to send this information to Pendo. With track events you can capture the screen size from your visitors and include it as a property on the event sent to Pendo. For more information on track events in Pendo including how to set them up you can take a look at our knowledge base article here: https://support.pendo.io/hc/en-us/articles/360032294151-Track-Events
An alternative option would be to pass this information in as Visitor metadata. You could evaluate the current browser resolution using JavaScript and pass it to the Pendo snippet as a metadata field which could then be used in segmentation.
I am looking to do the same. Angus, any chance could you please confirm if this method of tracking events was successful? It would be of great help to me and my team.
Thank you in advance.
Hey Frank Suarez-Milan, I haven't personally tried it yet but the two solutions above have different use cases:
1. Using Track Events allows you to see a log of all the visits and you can create a track event for all the screen sizes used. (This is assuming your team is able to capture this info and push it to Pendo via a track event.)
2. Using the visitor metadata passed through JS would only track the most recent screen used. (Since the metadata would get updated and overwritten if the screen sizes change).
3. Alternatively, here's another option we found. This is a poll that is designed to get your customers resolution at the time that this guide activates for them
This is great Angus! Thank you for the quick reply. I'll forward this over to the team and report back which option we end up going with.
Thanks for the link to the poll that captures screen size, Angus Yang! That's exactly what I was looking for.
I would really like screen resolution to be captured automatically like Google Analytics. Track events required development and we purchased Pendo due to its DIY capabilities. Is there a feature request I can upvote for this?
Erin W here's the related feature request if you want to upvote it!
Angus Yang I just saw the Poll above that captures window height/width. I just added these as event properties to a few highly used events. That is genius, thanks for the tip!!!
I have had a similar request I used a hidden guide step to capture the resolution, screen + browser width and heights, color depth. But agree if you have access to code that Track Event is the better way to go.
You will need to add this javascript as a code block to the hidden guide, it will load and capture the data and store it in a pendo poll text box and automatically move to next guide step, users don't even see this step.
---- Code Block ----
if(!pendo.designer){
document.getElementById("pendo-g-Clr4n4BnNFfcMD9id60fVSJU2lo").style.display="none";
}
var url = window.location.href;
var txt = "";
txt += "\nScreen Resolution: \nWidth " + screen.width + " and Height " + screen.height ;
txt += "\nBrowser Window: \nWidth : " + screen.availWidth + " and Height " + screen.availHeight;
txt += "\nColor depth: " + screen.colorDepth;
txt += "\nColor resolution: " + screen.pixelDepth;
document.getElementById("pendo-textarea-48168e34").value= url + txt; // change this pendo-textarea to yours
document.getElementById("pendo-button-0b96d652").click() // change this pendo-button to yours
----- example result -----
Isidore Gotto Would it work if I blast a pendo guide to all users of just this hidden guide? I want to capture this data but I dont want to rely on another guide to capture it for me. We have very few guides that capture as many people as I want, being almost everyone.
I am going to fiddle with this and see what happens.
you can set it to Auto load since it would be hidden from users views they will never see it. then schedule it to run for a few hours with expire time.
you can also capture some of this data with Click Event Properties, ie. you can assign click event property using the JS option and use the standard browser BOM like window.location, screen.width, screen.height, etc.
set it to your navigation feature tags for example and it will capture width/height etc. as users navigate your application
depending on the application I have done a bit of both using guides to add additional data with any feedback a visitor submits and with navigation Feature clicks
Very cool thanks. We have an issue with some users with zoomed in screens on pages which we are not sure how prevalent that is but we are going to figure that out too!
I have noticed as soon as I put in my pendo-textarea ID it captures but then the designer box during editing switches to the edit button part of the guide and I cannot go back and edit the code. Everything else is correct, but I cannot go back and edit. I am not sure if I did something wrong or if that is just a buggy designer window.
Anyone know how to resolve an issue I have with this resolution trick with a guide?
As soon as I post the line - document.getElementById("pendo-button-0b96d652").click() - it immediately closes the JS screen in the code editor and goes to edit the button as if the JS on the page clicked to edit the done button so I can never go back to the code snippet on the guide.
Is this a bug that the JS immediately activates when you add the code? It makes is phenomenally hard to edit once entered and now that I ran the guide a month ago, I want to check what I put in there and I cannot. This is unfortunate that I can add code that breaks the feature and I cannot recover what I put in there.
I guess I figured it out, but it still stinks as a solution.
I can inspect element and find the id="pendo-inline-script" div and I can see what I wrote. That is a very bad workaround.
I have recently moved to using Click Event Properties to capture width and height
Yeah, I need to get a round to doing that. There is some other info I would love to have and the guide route is too rough to compile.
Spencer Buchanan, I agree 100% with you. Sometimes I get random errors as I'm typing JS in the codeblock which is fairly cumbersome. Not sure what is the goal of having it execute as soon as written, and if its for testing, then a "Run" button would be enough IMO.
This is my workaround:
if(!pendo.designer){
setTimeout(() => { window.document.querySelector('.bb-button').click(); }, 1000);
}
We added our screen resolution to our meta data. Our app captures the height and width of the visitor's resolution, but my visitor report only pulls in height. Is anyone else having this issue?
Hi Jennifer Dragan would you mind explaining how you added the screen resolution to meta data? Thank you!
Please sign in to leave a comment.