# Methods

Basic shopping list methods will allow you to open or add products and recipes to the Whisk shopping list or open the Whisk add to basket screen.

* [whisk.shoppingList.viewList](#whisk-shoppinglist-viewlist)
* [whisk.shoppingList.addProductsToList](#whisk-shoppinglist-addproductstolist)
* [whisk.shoppingList.addProductsToBasket](#whisk-shoppinglist-addproductstobasket)
* [whisk.shoppingList.addRecipeToList](#whisk-shoppinglist-addrecipetolist)
* [whisk.shoppingList.addRecipesToList](#whisk-shoppinglist-addrecipestolist)
* [whisk.shoppingList.addRecipeToBasket](#whisk-shoppinglist-addrecipetobasket)

{% hint style="info" %}
Note: Basic methods do not send analytics, so you won't be able to get a [dashboard](https://docs.whisk.com/examples/shoppable-recipes#analytics-and-event-tracking). If you need tracking you can use [event listeners](https://docs.whisk.com/shopping-list-sdk/basic-setup/event-listeners). Also, you can use [subscriptions](https://docs.whisk.com/shopping-list-sdk/basic-setup/subscriptions) for implementing basic tracking on your side.
{% endhint %}

## whisk.shoppingList.viewList

`viewList` method opens the shopping list.

```javascript
whisk.queue.push(function() {
  whisk.shoppingList.viewList({
    styles: {
      type: 'modal',
    },
  });
});
```

Supported list of parameters is under the [Common Parameters](#common-parameters) section.

## whisk.shoppingList.addProductsToList

`addProductsToList`method allows you to add products not bound to any recipe to a shopping list.

```javascript
whisk.queue.push(function () {
  whisk.shoppingList.addProductsToList({
    products: ['Almonds', 'Salt', 'Milk'],
  });
});
```

`addProductsToList`method supports all [Common Parameters](#common-parameters), plus one extra required parameter:

| ATTRIBUTE  | TYPE            | DESCRIPTION              |
| ---------- | --------------- | ------------------------ |
| products\* | array \[string] | List of products to add. |

## whisk.shoppingList.addProductsToBasket

`addProductsToBasket`method allows you to add products to online checkout basket. Note: this does not add products to the shopping list.

```javascript
whisk.queue.push(function() {
  whisk.shoppingList.addProductsToBasket({
    products: ['Almonds', 'Salt', 'Milk'],
    onlineCheckout: {
      defaultRetailer: 'GB:Tesco',
    },
  });
});
```

`addProductsToBasket`method supports all parameters from the [addProductsToList](#whisk-shoppinglist-addproductstolist) method.

## whisk.shoppingList.addRecipeToList

`addRecipeToList`method allows you to add a recipe to the shopping list.

```javascript
whisk.queue.push(function() {
  whisk.shoppingList.addRecipeToList({
    recipeUrl: 'https://whisk.com/demo/calzone-roasted-peppers',
  });
});
```

addRecipeToList method supports all [Common Parameters](#common-parameters), plus one extra required parameter:

| ATTRIBUTE   | TYPE   | DESCRIPTION                                                             |
| ----------- | ------ | ----------------------------------------------------------------------- |
| recipeUrl\* | string | Recipe URL to add. Recipe should be recognized by the recipe validator. |
| scale       | number | All ingredient quantities will be multiplied by this number             |

## whisk.shoppingList.addRecipesToList

`addRecipesToList`method allows you to add multiple recipes to the shopping list.

```javascript
whisk.queue.push(function() {
  whisk.shoppingList.addRecipesToList({
    recipes: [
      'https://whisk.com/demo/sponsored-retailer',
      'https://whisk.com/demo/sponsored-ingredient',
      { recipeUrl: 'https://whisk.com/demo/complementary-item-advert', scale: 2 },
    ],
  });
});
```

addRecipesToList method supports all [Common Parameters,](#common-parameters) plus one extra required parameter:

| ATTRIBUTE | TYPE                                         | DESCRIPTION                                                                |
| --------- | -------------------------------------------- | -------------------------------------------------------------------------- |
| recipes\* | array \[string \| [RecipeSpec](#recipespec)] | Recipes URLs to add. Recipes should be recognized by the recipe validator. |

#### RecipeSpec

| ATTRIBUTE   | TYPE   | DESCRIPTION                                                       |
| ----------- | ------ | ----------------------------------------------------------------- |
| recipeUrl\* | string | Recipes URL. Recipe should be recognized by the recipe validator. |
| scale       | number | All ingredient quantities will be multiplied by this number       |

## whisk.shoppingList.addRecipeToBasket

`addRecipeToBasket`method allows you to add a recipe to an online checkout basket. Note: this does not add the recipe to the shopping list.

```javascript
whisk.queue.push(function() {
  whisk.shoppingList.addRecipeToBasket({
    recipeUrl: 'https://whisk.com/demo/calzone-roasted-peppers',
    onlineCheckout: {
      defaultRetailer: 'GB:Tesco',
    },
  });
});
```

`addRecipeToBasket` method supports all parameters from the [addRecipeToList](#whisk-shoppinglist-addproductstolist) method.

## Common Parameters

| ATTRIBUTE      | TYPE                                     | DESCRIPTION                                                                                                              |
| -------------- | ---------------------------------------- | ------------------------------------------------------------------------------------------------------------------------ |
| language       | enum                                     | Shopping list app language. Possible values: en, de, fr. Default value: automatically defined based on browser language. |
| country        | enum                                     | Shopping list app country. Possible values: us, gb, de. Default value: automatically defined based on user location.     |
| whiteLabel     | string                                   | Shopping list app design customisations. This is a premium feature for our partners.                                     |
| trackingId     | string                                   | Unique identifier for your business (optional). This is a premium feature for our partners. Contact us to get one.       |
| onlineCheckout | [onlineCheckout](#onlinecheckout-object) | Object which configures shopping list app online checkout preferences.                                                   |
| styles         | styles                                   | Object which changes shopping list app appearance.                                                                       |
| utm            | [utm](#utm-object)                       | Object with tracking params.                                                                                             |

#### onlineCheckout object

| ATTRIBUTE        | TYPE          | DESCRIPTION                                                                                                                                                                                        |
| ---------------- | ------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| enabled          | boolean       | Set it to false if you want to disable online checkout completely. Default value: true.                                                                                                            |
| allowedRetailers | array \[enum] | List of available retailers in the shopping list app. \[] - is equal to enabled: false. Default value: all available retailers.                                                                    |
| defaultRetailer  | enum          | Default retailer for the shopping list app. You can find list of available retailers here. Note: you can pass null to unset a default value for new users. Default value: is defined by Whisk API. |
| autoPick         | string        | Set it to true to go straight to checkout in addRecipeToBasket and addProductsToBasket methods                                                                                                     |

#### utm object

| ATTRIBUTE | TYPE   | DESCRIPTION                                                                                                 |
| --------- | ------ | ----------------------------------------------------------------------------------------------------------- |
| campaign  | string | Identifies a specific product promotion or strategic campaign.                                              |
| source    | string | Identifies which site sent the traffic, and is a required parameter.                                        |
| medium    | string | Identifies what type of link was used, such as cost per click or email.                                     |
| content   | string | Identifies what specifically was clicked to bring the user to the site, such as a banner ad or a text link. |
| term      | string | Identifies search terms.                                                                                    |