Learning & Support


Advanced Scripting | Sample App 6: Custom Vars

Twixl Support Team Updated: - Created :

    In the series Advanced Scripting Sample Apps we explain some use cases on how to use the Advanced Scripting. For more general info, it's very important that you read this KB-article first.

    Preview with the Twixl App

    You can preview this app by scanning the QR code with the Twixl app.

    Replace QR-Code

    Use Case

    In this example, we show how to use the tp-set-custom-vars:// function.

    Custom variables allow you to set one or more variables with the following properties:

    • They are saved on the device
    • They can be re-used in the advanced scripting

    A sample scenario is e.g. to store a user preference and change the content based on that variable.



    1. Create a new app
    2. Add a content item with the following properties to the Root Collection:
      • Type: Web Link
      • Title: Set custom vars
      • URL: tp-set-custom-vars://?name=Twixl&product=Publisher
    3. Add a content item with the following properties to the root collection:
      • Type: Web Link
      • Title: Clear custom vars
      • URL: tp-set-custom-vars://?name=&product=
    4. Set up your Advanced Scripting (see below)
    5. Run the app in the Twixl app and then go to the Gear menu > Advanced Filter Log to see the log messages.
    6. For the Browser Client, open the Root Collection, append ?debug=1 to the url and you'll see the debug icon in the toolbar.
    7. After tapping the Set Variables, check the debugger again to see that the values are saved

    Advanced Scripting Settings

    For the Root Collection

    // Executed once for every collection before the filtering of the items
    function setupFilter(collection, environment) {
        var customVars = environment.CustomVars();
    // Executed for once for every collection
    function shouldShowCollection(collection, environment) {
        return true;
    // Executed for every single content item
    function shouldShowItem(contentItem, collection, environment) {
        return true;
    // Executed once for every collection after the filtering of the items
    function teardownFilter(collection, environment) {

    How to use Custom Variables in a HTML-article?

    If you want to get a list of Custom Variables from within an HTML-article, you can use the following sample code:

    <!DOCTYPE html>
    <html lang="en">
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
            function twixlOnGetCustomVars(customVariablesAsJSON) {
            window.location.href = "tp-get-custom-vars://twixlOnGetCustomVars";

    Was this article helpful?

    0 out of 0 found this helpful