Global Configuration

Global configuration allows you to set parameters once to be used multipe times. For example, if you have two click listeners on a page and you want both of them to open Whisk shopping list in slideout mode. Without using global configuration you code will look like this:

<div> <button id="add-to-list">Add to list button</button> <button id="add-to-basket">Add to basket button</button> <script> whisk.queue.push(function() { whisk.listeners.addClickListener( 'add-to-list', 'shoppingList.addRecipeToList', { recipeUrl: 'https://whisk.com/demo/calzone-roasted-peppers', styles: { type: 'slideout' }, } ); whisk.listeners.addClickListener( 'add-to-basket', 'shoppingList.addRecipeToBasket', { recipeUrl: 'https://whisk.com/demo/calzone-roasted-peppers', styles: { type: 'slideout' }, } ); }); </script> </div>

We can simplify it by using global configuration:

<div> <button id="add-to-list">Add to list button</button> <button id="add-to-basket">Add to basket button</button> <script> whisk.queue.push(function() { whisk.config.set('shoppingList', { recipeUrl: 'https://whisk.com/demo/calzone-roasted-peppers', styles: { type: 'slideout' }, }); whisk.listeners.addClickListener('add-to-list', 'shoppingList.addRecipeToList'); whisk.listeners.addClickListener('add-to-basket', 'shoppingList.addRecipeToBasket'); }); </script> </div>

Alternatively you can use dots to set single option:

whisk.queue.push(function() { whisk.config.set('shoppingList.styles.size', 'large'); whisk.config.set('shoppingList.styles.type', 'slideout'); });

Available options

ATTRIBUTETYPEDESCRIPTION
global.languagestring

Default language.

global.whiteLabelstring

Default white label.

global.utmutm

Object with tracking params.

global.trackingIdstring

Unique identifier for your business (optional). This is a premium feature for our partners. Contact us to get one.

shoppingList.recipeUrlstring

Default recipe url for all widgets and click listeners.

Default value: Current URL
shoppingList.productsarray [string]

Default product list for addProductsToList.

shoppingList.whiteLabelstring

Default white label for widgets.

shoppingList.hiddenstring

Default value for hidden option. Read more about hidden widgets.

shoppingList.onlineCheckoutonlineCheckout

Object which configures shopping list app online checkout preferences.

shoppingList.stylesstyles

Object which changes shopping list app appearance.

onlineCheckout object
ATTRIBUTETYPEDESCRIPTION
enabledboolean

Set it to false if you want to disable online checkout completely.

Default value: true.
allowedRetailersarray [enum]

List of available retailers in the shopping list app. [] - is equal to enabled: false.

Default value: all available retailers.
defaultRetailerenum

Default retailer for the shopping list app. You can find list of available retailers here.

Default value: is defined by Whisk API.
autoPickstring

Set it to true to go straight to checkout in addRecipeToBasket and addProductsToBasket methods

styles object
ATTRIBUTETYPEDESCRIPTION
typeenum

Define how shopping list or basket appears on page.

Possible values: modal, slideout.
Default value: modal.
sizeenum

Widget size.

Possible values: compact, large.
Default value: compact.
alignenum

Widget content alignment.

Possible values: left, center, right.
Default value: center.
buttonbuttonStyles

Style options for widget buttons.

linkColorstring

Link text colour.

button styles object
ATTRIBUTETYPEDESCRIPTION
colorstring

Button background colour.

textColorstring

Button text colour.

borderRadiusstring

Button border radius.

textstring

Button text. Only valid for 'compact' size.

utm object
ATTRIBUTETYPEDESCRIPTION
campaignstring

Identifies a specific product promotion or strategic campaign.

sourcestring

Identifies which site sent the traffic, and is a required parameter.

mediumstring

Identifies what type of link was used, such as cost per click or email.

contentstring

Identifies what specifically was clicked to bring the user to the site, such as a banner ad or a text link.

termstring

Identifies search terms.