Detect if a visitor is on Mobile/Tablet or Desktop

Ana Updated by Ana

To suit a better experience or a different solution depending on the device the user is browsing with, we can set up a "detector" and a condition to redirect the user one way or another. Also we can keep this information for later use.

This is going to be our flow:

  1. As we want to detect the device used as soon as the bot loaded, we will need to add the following code in the Design / Custom Code / Add JS section:

<script>
var landbotScope = this;
  this.onLoad(function() { 
    let checkMobile = (/Mobile|iP(hone|od|ad)|Android|BlackBerry|IEMobile|Kindle|Silk-Accelerated|(hpw|web)OS|Opera M(obi|ini)/.test(navigator.userAgent)) ? landbotScope.setCustomData({mobile: "true"}) : landbotScope.setCustomData({mobile: "false"})
  })  
</script>

  1. Right after the Welcome Message, we will have available the value (true or false) in the variable "mobile" that we need to create in Landbot, with the format of a String:

  1. Now, right after the welcome message, add Conditional block as below:

That's it, now you have created 2 flows to redirect users based on their device. Also the variable mobile will be available for you.

How did we do?

Open LiveChat bot as soon as page loads

Contact