How to send variables through the URL

Updated 4 months ago by Cris Villar

Landbot allows you to hyper-personalize the experience, starting from the URL! Check this example on how to send the variable "name" through the URL:

You need access to the Advanced in Design, only available for premium plans so send variables to Landbot via URL.
  1. The first thing you need to do is create a new bot and go to  Design > Advanced > JS:


  2. Now you need to paste a specific snippet in the Add JS - Custom Script section:



    We'll paste a generic snippet to send the variable "name" (if you want to add more variables, just add another getToLandbot function at the end [before the </script> tag] with the information of the variable):

    <script>function getToLandbot(getParam, landbotParam, defaultValue){ var url = new URL(location.href); var res = url.searchParams.get(getParam); if (!res) res = defaultValue; var customData = {}; customData[landbotParam] = res; Landbot.exec('landbot-custom-data', customData); } getToLandbot("name", "first_name", "there");</script>


    In the end, we see the function getToLandbot("name", "first_name", "there"); that contains:
    1. The variable name we'll use in the URL. In the example, "name".
    2. The name of the field that will be created in Landbot. In the example, "first_name". This is the field name you need to use in the flow, too!
    3. The value showed in the chat and collected by landbot in case there's no defined value. In the example, "there".
  3. Now we need to add to the URL the variable you want to pass. For this example, we'll use:

    https://landbot.io/u/variabletest/index.html
    ?name=Cris

    If you have +1 variables, add a "&" between them, like:

    https://landbot.io/u/variabletest/index.html?name=Cris&email=cristobal@landbot.io
  4. That was it!  This is how the chatbot flow looks like:



    The end-user conversation:



    And finally, this is how the chat shows up on Results:


How did we do?


xqob928d