Landbot variables & Javascript variables

Landbot variables and Javascript Variables

Landbot variable => Javascript variable

Let's say you want to print in console a name that you asked in the bot, and also stored in a global scope variable for later use:

  1. We ask for the name:

  1. In the Design / Advanced / Add JS section:

Here we created a variable for the global scope (of the bot) called "globalVariable";

Then we create a function ("assignValue()") that will store data in the globalVariable;

And finally a function ("printGlobalVariable()") that will be used to print in console, when we call it in the flow, the value of the "globalVariable".

  1. First Code block:

Here we will call the assignValue function and add it as a parameter a Landbot variable.

It's important to notice that to use a Landbot variable this will be done between the "".

  1. We trigger in the next code block the function

  1. The final flow:

Javascript variable => Landbot variable (Code > User Input > Variable Available)

It is very important to understand that this step (Javascript to Landbot) it ALWAYS needs an input of the visitor, before the Javascript value is available in the Landbot variable.

STEPS:

1 Javascript variable value => 2 Landbot custom-data SDK => 3 USER INPUT (button, text...) => 4 Landbot variable Javascript value assigned & available to use

In this case we want to send a variable created in our global scope to be a Landbot Variable.

  1. We create a global variable in the Design / Advanced / Add Js section

  1. In the desired Code, where we want to trigger the transfer of the variables we add the following code,
Landbot.exec('landbot-custom-data',{lndbtvariable:globalVariable})

Being "landbot_variable" a new Landbot variable created already in the bot

  1. We need to add an input for the user, to pass the complete the process before the value is available in Landbot scope

  1. And finally we set up a block, where we will display the new Landbot value

As an alternative to this approach you can do this: Use Google Cloud Functions to set directly new values to Landbot variables

Javascript variable from parent site to Landbot on loading

In some cases, we might have a value in our parent site that we want to be available when the bot loads, to do that we are going to use our Hidden Fields functionality and customize our embed code:

  1. In the Bot builder, we will select Chatbot Settings:

  1. Select "Hidden Fields"

  1. Here we are going to set up the name of the variable (and the name of the param) we are going to store the value in Landbot. In this example we will get the variable "language"

  1. Now in the parent site we will adapt the embed code to add the value of the variable in the parent site as a param in the index url:
var languagevariable = "Spanish"
<script src="https://static.landbot.io/landbot-widget/landbot-widget-1.0.0.js"></script>
<script>
var myLandbot = new LandbotLivechat({
index: 'https://landbot.io/u/YOURBOTID/index.html?language='+languagevariable,
});
</script>

With the above example we will pass the value "Spanish" to Landbot, that in the parent site is in the "languagevariable" variable

You can pass as many variables as you need


How did we do?