Query Param Passthrough ❺

Automatically pass through querystring params from the current page, as users navigate through your site.

BETA: This library has just been released and has a lot of configuration options that have not been fully tested by our community. Please report any issues in the forum, link above.

Use Cases

• Pass UTM tracking params from the landing page, as the user navigates through the site. Capture them when the user submits a form.

  • See SA5's Data-binding features for no-code binding of querystring params to form inputs.

• Pass referrer-tracking params in the same way

Configuration

This library has extensive configuration options.

All SA5 Url lib features are handled in a single urlConfig configuration block, however feature-specific configurations are represented as sub objects. Typically you can enable or disable a feature, and provide a custom configuration if you choose.

Here are the configuration options for Query param passthrough;

<!-- Sygnal Attributes 5 | Url | Config -->
<script>
window.sa5 = window.sa5 || [];
window.sa5.push(['urlConfig', 
  (config) => {
    config.passthrough = true;
    config.passthroughConfig = {
      ignorePatterns: ["ignore", /_page$/],
      overwriteExisting: true,
      internalOnly: false
    };
    return config;
  }]); 
</script>

passthrough = true | false

Defaults to false.

Enables or disables query param passthrough.

passthroughConfig

Specifies query param passthrough config options.

passthroughConfig.ignorePatterns

Defines which param keys to ignore, for example, this configuration will not pass through param keys of ignore or Webflow's pagination params like j2l89skd_page.

config.passthroughConfig = {
  ignorePatterns: ["ignore", /_page$/]
};

You can have as many ignore patterns as you like, and can specify both literal strings and regex strings.

Defaults to [ /_page$/ ].

Not thoroughly tested, but you should also be able to do add and remove operations like;

config.passthroughConfig.ignorePatterns.push("ignore");

passthroughConfig.overwriteExisting = true | false

If a link already has a param with this name, this setting determines whether a querystring param with the same name will overwrite it.

Defaults to false.

passthroughConfig.internalOnly = true | false

Determines whether param passing targets internal links only, or external links as well.

Defaults to true.

Getting Started ( LOCODE )

STEP 1 - Add the Library

First, add the library as detailed in Quick Start.

STEP 2 - Add your Configuration Callback

Add this configuration section above right after the library in your before HEAD custom code. Typically this will be in the site-wide custom code configuration.