Table of Contents

New block: Code

Pau Sanchez Updated by Pau Sanchez

Learn how to use our all-new block type Code that allows you to easily add code within a block and trigger easter eggs!

Sometimes we want to trigger some Javascript functions during the flow, here is where we can do it.

The code in this blocks will be active only when the visitor passes through this point. So functions in the block don't have a global scope

How to use it the Code block

This code will be automatically embedded inside <script> </script> tags, so there is no need to add them, as you can see below. In this example, when the visitor passes through this block, a "hello world" will be printed in the console

Code block and Add JS (Custom scripts) [Design/Advanced section]

Code in the Add JS section, are global, as soon as the footer of the bot is loaded in the web, it is ready to use. This is the place to set up, "global" functions and variables with global scope.

Even if they are placed in different sections, code can communicate easily as you can see below. Using the Code blocks to trigger the global

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

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.

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

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 traspassing of the variables we add the following code,

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

How did we do?