Lead Notification & stats differentiation for Desktop vs Mobile


#1

While I’m glad that responsive is here, I’m not switching all of my pages to the new beta just yet. The reason being, we monitor conversion on devices for some landing pages. Trying to build an idea of which clients are submitting via mobile pages or desktop.

Right now, there is no way to tell in the beta program whether a lead came from the desktop version or mobile version of a responsive landing page. I would love to see a field labelled device type option under Landing Page Details in the email notification. A simple Mobile or Desktop option would be nice, if it could monitor whether it was a tablet or even the device type (apple, samsung, etc.) would be even better.

Thanks,

Stu


Lead data ( IP address and Desktop vs mobile)
#2

Hey Stu - while we don’t have this built into the Landing Page Details, it should be possible to use some Javascript to write either “mobile” or “desktop” into a hidden form field depending on whether or not a visitor’s browser is greater than 600px or not. Johnny and Mark are actually both out of the office on Monday, but I’ll get one of them to take a stab at it on Tuesday and post it here, if we can get a workable snippet of code for you.


#3

Hi Stu -

As promised, here’s that script: https://gist.github.com/markwainwrigh…

To use it, you’ll first need to create a hidden field in your form, and give it a name of ‘responsive_page’.

Then, paste the script in to the JavaScripts section. The placement doesn’t matter.

The script will fill the field with ‘mobile’ or ‘desktop’ as appropriate. You’ll then start seeing this information in your lead notification emails (and you can map the field to your webhooks or external integrations, if you like!)

By the way, you might also be interested in Johnny’s post on how to segment mobile and desktop traffic in Google Analytics. While this won’t give you per-lead data, it doesn’t require any custom code and will help give you the bigger picture on what devices your visitors are using.

Cheers!


#4

Mark, Quinn,

Thanks for your help, your code worked like a charm and I’m loading it into my scripts manager now!

Thank you so much!

Stu


#5

This is a fantastic addition to Mobile Responsive. Great job with the script, Mark!


#6

I have an iframe I am using for an external Infusionsoft web form. I added the custom hidden field named responsive_page in Infusionsoft and added it to the form.

However, when I test the form, the responsive_page field is blank. Does this script only work when using an Unbounce web form?


#7

Hello Guys! The script works well, but not from iphone 6. I tested the page from both iphone and iMac, and in both cases it shows ‘Desktop’… any help on that please? 


#8

Hi Checkout LTD :) 

I just tested it myself on an iPhone 6 and all seems to be working fine.

Here are a couple quick troubleshooting tips:

  • Make sure your hidden field name matches exactly the one used in the script or vise versa. 

  • Make sure you have checked off “Show Mobile Version to Visitors” in your Page Properties tab. Otherwise, you’ll be seeing the desktop version on your phone. 

If you are still running into issues be sure to reach out to the fine folks at Unbounce support and I’m sure they’ll help you. 

Best,
Hristian

![](https://d2r1vs3d9006ap.cloudfront.net/s3_images/1342972/RackMultipart20160108-11060-czjr73-Edit A - page-type inline.png?1452243011 “Image: https://d2r1vs3d9006ap.cloudfront.net/s3_images/1342972/RackMultipart20160108-11060-czjr73-Edit__A__-__page-type__inline.png?1452243011”)


#9

Hello!

It seems to work now, which is great :slight_smile: Thanks a lot!


#10

Can this script be modified to be applied to a button within unbounce?