It's now possible to use parameters on some places in Buttonizer. This way you make your messages even more personal!
The following variables are available:
{page_title}: Will be replaced with the current page title{page_url}: Will be replaced with the current page URL
Good to know: Inside the editor, all parameters will default to a example parameter. They will only be in action on your site.
Platform supported parameters
If you're using Buttonizer on Shopify or WooCommerce, the following parameters work on the fly:
{product_id}: Will be replaced with the current product ID{product_name}: Will be replaced with the current product name
In case there's no data for the above parameters, or it's not a product page, they will be replaced by emptyness 💨
Are you using a custom platform or would you like to use custom parameters? Check out Custom JavaScript variable section below!
Local default values
All parameters have a default value, but also support a local default value. This way you customize the parameters value if it wasn't set or available a your page.
Working example:
Do you have a question {product_name|this product}
The part after the | character will be the default, in this case the default will become this product.
Do you have a question about this product?
Custom JavaScript variabele ✨
Buttonizer supports custom variables. Such as {userName}. Just like page rules, it will try to find parameters inside the window._buttonizer.data object.
If the data does not exists, you can use a fallback. A fallback can look like this: {userName|fallback value}. If the value is empty or does not exists, it will return fallback value instead.
You can add any parameter you need, keep in mind only strings and numbers are supported. The fallback parameter supports most special characters, including spaces.
Important: For some components, markdown is generated AFTER parameters. If your value contains markdown, it will be displayed as well. HTML is not supported (and will not be supported for security reasons).
Good to know: Numbers are not allowed as first character. Parameters can look like this: sample_parameter, sampleParameter and parameter2.
Initial values
Below you find an example to initialize custom variables on your site. You can generate the JavaScript below via the Parameters settings.
<script type="text/javascript">
// Define _buttonizer in case it's not defined yet
if(!window._buttonizer) { window._buttonizer = {}; };
var _custom_page_data = {
userName: "Jasper",
pageId: 5,
anyParam: "Example value"
};
// Merges page data with other potential data
window._buttonizer.data = { ..._custom_page_data, ...window._buttonizer.data };
</script>
Updating a value
It is possible to update parameters after initializing using the JavaScript API. Before calling the API, always verify if Buttonizer has been initialized.
// Only execute if Buttonizer is initialized
if(window.Buttonizer) {
// Update parameter value of parameter 'userName'
window.Buttonizer.setParameter("userName", "Bob");
}
Example usage 🧪
Time for an example! For the Agent chat-message, we will use the following text:
Hey {userName|there} 👋
Do you have any questions about **{product_name}**?
Click the button below and ask your questions!
The WhatsApp widget will look like this:
