Skip to main content
The Custom Script element lets you embed JavaScript directly in your flow. Use it whenever the built-in elements are not flexible enough — for example, to perform arithmetic, format strings, parse dates, or implement any custom logic that a condition or API call cannot handle alone. Two built-in functions, getVariable() and setVariable(), act as the bridge between your JavaScript code and the rest of your Plural flow.

​
Add a Custom Script element

Right-click on an empty area of your canvas and select Custom Script. Click the element once to open the sidebar, then click Open script editor to launch the full-screen code editor.

​
The getVariable() function

Use getVariable() to read the current value of any flow variable (custom or system) into your script. The function takes the variable name as a string and returns its value. 
// Basic syntax
getVariable('nameOfYourAttribute')

// Read the value of a variable called "favoriteWine"
const wine = getVariable('favoriteWine')
Variables are always returned as strings. If you need to perform numeric calculations, parse the value explicitly: 
const count = parseInt(getVariable('counter'))

​
The setVariable() function

Use setVariable() to write a value back to a flow variable. The function takes two arguments: the variable name and the new value. 
// Basic syntax
setVariable('variableName', value)

// Save an updated name back to the "avatarName" attribute
setVariable('avatarName', updatedName)
Any value you set is accessible in subsequent elements via #ATTRI/variableName.

​
Script outputs

The Custom Script element has two outputs:
  • Success — the script ran without throwing an error.
  • Error — an unhandled JavaScript error occurred (for example, a TypeError or ReferenceError).
Connect both outputs. Wire the Error output to a fallback screen (such as a Media Designer slide that says “Something went wrong”) so your flow never gets stuck.

​
Example: Build a simple counter

This example builds a flow counter that users can increment or decrement with buttons, and displays the current count on demand.

​
Overview of the flow

  1. A Set User Attributes & Variables element initialises counter to 0.
  2. A Menu Designer element presents three buttons: Count Up, Count Down, and Show Count.
  3. Two Custom Script elements handle the increment and decrement logic.
  4. A Robot Says element reads back the current count using #ATTRI/counter.

​
Step 1 — Initialise the counter

Add a Set User Attributes & Variables element at the start of your flow. Create a variable named counter with the value 0.

​
Step 2 — Create the menu

Add a Menu Designer element with three buttons: Count Up, Count Down, and Show Count. Wire the Show Count output to a Robot Says element that speaks "The current count is #ATTRI/counter".

​
Step 3 — Add the increment script

Connect the Count Up button output to a Custom Script element. Open the script editor and enter: 
let currentCounter = getVariable('counter')     // read the current value
let newCounter = parseInt(currentCounter) + 1   // increment by 1
setVariable('counter', newCounter)              // write it back to the flow
What this does:
  1. getVariable('counter') reads the current counter value from the flow into the local variable currentCounter.
  2. parseInt(currentCounter) + 1 converts the string to an integer and adds 1 — without parseInt, JavaScript would concatenate strings instead of adding numbers.
  3. setVariable('counter', newCounter) saves the updated value back so every subsequent element can see it.

​
Step 4 — Add the decrement script

Connect the Count Down button output to a second Custom Script element. Duplicate the increment script and change + 1 to - 1: 
let currentCounter = getVariable('counter')
let newCounter = parseInt(currentCounter) - 1
setVariable('counter', newCounter)

​
Step 5 — Handle errors

Wire the Error output of both script elements to a Media Designer element that tells the user something went wrong. This prevents the flow from reaching a dead end if the script fails.

​
Step 6 — Loop back

Wire the Success outputs of both script elements back to the menu so users can keep counting up or down.
The Custom Script element runs entirely on the client side (in the browser for Avatar flows). Avoid long-running operations or external network calls inside the script — use the Custom API Request element for those instead.

​
More script patterns

​
String concatenation and formatting

const firstName = getVariable('firstName')
const lastName = getVariable('lastName')
setVariable('fullName', firstName + ' ' + lastName)

​
Conditional logic

const score = parseInt(getVariable('quizScore'))
if (score >= 80) {
  setVariable('quizResult', 'passed')
} else {
  setVariable('quizResult', 'failed')
}

​
Date formatting

const today = new Date()
const formatted = today.toLocaleDateString('en-GB') // e.g. "21/06/2025"
setVariable('todayFormatted', formatted)