---
title: Configurations
slug: apis/smart-recommendations-configurations
docTags: 
createdAt: 2022-05-02T12:12:04.000Z
---

:::hint{type="info"}
If you haven't gone through the prerequisites and the v2 structure, please have a look at [Overview](docId\:cZeodl0sKcuv-18IPupLr) &#x20;
:::

Merchants can create and manage multiple Klevu Recommendation banners via our KMC (Klevu Merchant Centre). The configuration via KMC includes the page type, the banner type and even the template to render the banner.

Our recommended approach to display these banners created via the KMC is to use our [HTML Div Integration](https://support.klevu.com/knowledgebase/integration-steps-for-recommendations/) approach, which includes handling of API calls and banner rendering out of the box. You can also retrieve the KMC banner configuration via an API call and process it however you like.

This API call uses a simple GET request with no payload, and since it is intended for use on the frontend there is no authentication required

:::ApiMethodV2
```json
{
  "tab": "examples",
  "url": "https://config-cdn.ksearchnet.com/recommendations/klevu-158755634955912036/settings/3a5580bf-c5b2-407e-acac-4a58ae730b64",
  "name": "Get recommendation configuration",
  "method": "GET",
  "request": {
    "pathParameters": [
      {
        "kind": "optional",
        "name": "BASE_PATH",
        "type": "string",
        "description": "A static base url to retrieve Klevu Recommendation configuration from: https://config-cdn.ksearchnet.com"
      },
      {
        "kind": "optional",
        "name": "JS_API_KEY",
        "type": "string",
        "description": "Your public Klevu JS API Key."
      },
      {
        "kind": "optional",
        "name": "RECS_ID",
        "type": "string",
        "description": "The unique ID of your Recommendation banner, which you can find within the KMC.\n"
      }
    ],
    "queryParameters": [
      {
        "name": "pid",
        "kind": "optional",
        "type": "string",
        "description": "The unique identifier of the record within Klevu.",
        "children": []
      },
      {
        "name": "gpid",
        "kind": "optional",
        "type": "string",
        "description": "The identifier used to group compound products together, eg. the ID of the parent in the case of a configurable product",
        "children": []
      },
      {
        "name": "cp",
        "kind": "optional",
        "type": "string",
        "description": "This is the complete hierarchy of the category being visited. For example, Jewellery;Rings;Stackable Rings. Please note the use of a semicolon as the separator between a parent and a child category.",
        "children": []
      },
      {
        "name": "sids",
        "kind": "optional",
        "type": "string",
        "description": "The SegmentIDs (segmentInfo.segments) if using recommendation segmentation.",
        "children": []
      }
    ],
    "headerParameters": [],
    "bodyDataParameters": [],
    "formDataParameters": []
  },
  "results": {
    "languages": [
      {
        "id": "hLEZ8xh-V9GIIEzwDwmhA",
        "code": "{\n    \"metadata\": {\n        \"title\": \"Recently Viewed By You\",\n        \"recsKey\": \"3a5580bf-c5b2-407e-acac-4a58ae730b64\",\n        \"pageType\": \"HOME\",\n        \"logic\": \"RECENTLY_VIEWED\",\n        \"maxProducts\": 5,\n        \"productThreshold\": 1,\n        \"enabled\": true\n    },\n    \"search\": {\n        \"basePath\": \"eucs19v2.ksearchnet.com/cs/v2/search\",\n        \"payload\": \"{\\\"recordQueries\\\":[{\\\"id\\\":\\\"klevuRECSItemList\\\",\\\"typeOfRequest\\\":\\\"SEARCH\\\",\\\"settings\\\":{\\\"typeOfRecords\\\":[\\\"KLEVU_PRODUCT\\\"],\\\"limit\\\":5}}]}\"\n    },\n    \"templates\": {\n        \"base\": \"<% var metadata = data.metadata; var logic = (metadata.logic) ? metadata.logic : \\\"\\\"; var pageType = (metadata.pageType) ? metadata.pageType : \\\"\\\"; var recsKey = (metadata.recsKey) ? metadata.recsKey : \\\"\\\"; var title = (metadata.title) ? metadata.title : \\\"\\\"; %>    <div class=\\\"kuRECSContainer\\\" data-logic=\\\"<%= logic %>\\\" data-recskey=\\\"<%= recsKey %>\\\" data-page-type=\\\"<%= pageType %>\\\">        <% var recommendationItemList = klevu.getObjectPath(data,\\\"query.klevuRECSItemList.result\\\");%>            <% if(recommendationItemList && recommendationItemList.length) { %>                <div class=\\\"kuRECSHeader\\\">                    <h3 class=\\\"kuRECSTitle\\\" title=\\\"<%= klevu.dom.helpers.escapeHTML(title) %>\\\">                        <%= title %>                            </h3>                        </div>                    <div class=\\\"kuRECSWrap\\\">                        <div class=\\\"kuRECSResults\\\">                            <div class=\\\"kuRECSResultsInner\\\">                                <% helper.each(recommendationItemList, function(key, item){ %>                                    <div class=\\\"kuRECS-itemWrap kuRECSItem\\\" data-id=\\\"<%= item.id %>\\\">                                        <div class=\\\"kuRECS-item\\\">                                            <div class=\\\"kuRECS-itemImg\\\">                                                <a title=\\\"<%= klevu.dom.helpers.escapeHTML(item.name) %>\\\" href=\\\"<%= item.url %>\\\" data-id=\\\"<%= item.id %>\\\" class=\\\"kuRECSItemClick kuRECSImg\\\">                                                    <img src=\\\"<%= item.image %>\\\" origin=\\\"<%= item.image %>\\\" alt=\\\"<%= klevu.dom.helpers.escapeHTML(item.name) %>\\\" onerror=\\\"klevu.dom.helpers.cleanUpProductImage(this)\\\" class=\\\"prodImg\\\" width=\\\"100%\\\">                                                </a>                                            </div>                                            <div class=\\\"kuRECS-itemDesc\\\">                                                <a title=\\\"<%= klevu.dom.helpers.escapeHTML(item.name) %>\\\" href=\\\"<%= item.url %>\\\" data-id=\\\"<%= item.id %>\\\" class=\\\"kuRECSItemClick kuRECSTitle\\\">                                                    <%= item.name %>    hghfghfghfghgfhfghfg                                                    </a>                                                    <div class=\\\"kuRECS-itemPrice\\\">                                                        <% if(item.ondiscount && item.ondiscount == \\\"true\\\") { %>                                                            <% if(item.salePrice ) { %>                                                                <div class=\\\"kuSalePrice kuSpecialPrice\\\">                                                                    <%=helper.processCurrency(item.currency,parseFloat(item.salePrice) )%>                                                                        </div>                                                                    <% } %>                                                                        <% if(item.price) { %>                                                                            <div class=\\\"kuOrigPrice\\\">                                                                                <%=helper.translate(\\\"Original price %s\\\",helper.processCurrency(item.currency,parseFloat(item.price)))%>                                                                                    </div>                                                                                <% } %>                                                                                    <% } else { %>                                                                                        <% if(item.salePrice ) { %>                                                                                            <div class=\\\"kuSalePrice\\\">                                                                                                <%=helper.processCurrency(item.currency,parseFloat(item.salePrice) )%>                                                                                                    </div>                                                                                                <% } %>                                                                                                    <% } %>                                                                                                        </div>                                                                                                    </div>                                                                                                <div class=\\\"kuRECSItemBottom\\\">                                                                                                    <button data-id=\\\"<%= item.id %>\\\" data-qty=\\\"1\\\" data-url=\\\"<%= item.url %>\\\" class=\\\"kuRECSAddToCartBtn\\\">Add to Cart                                                                                                    </button>                                                                                                </div>                                                                                            </div>                                                                                            </div>                                                                                        <% }) %>                                                                                            </div>                                                                                        </div>                                                                                    </div>                                                                                <% } %>                                                                                    </div>\"\n    },\n    \"styles\": {\n        \"base\": \".kuRECSContainer{  position:relative;  margin:15px 0px;}.kuRECSContainer .kuRECSHeader .kuRECSTitle{  display:block;  font-size:18px;  font-weight:bold;  margin:20px 0px;  overflow:hidden;  white-space:nowrap;  text-overflow:ellipsis;}.kuRECSContainer .kuRECSWrap{  max-width:100%;  position:relative;  padding:0px;  box-sizing:border-box;  font-family:inherit;  overflow:hidden;}.kuRECSContainer .kuRECSWrap *{  outline:none;}.kuRECSContainer .kuRECSResults{  width:100%;  max-width:100%;  overflow:auto;}.kuRECSContainer .kuRECSResultsInner{  transition:-ms-transform 0.5s ease 0s, -webkit-transform 0.5s ease 0s, transform 0.5s ease 0s;  position:relative;  white-space:nowrap;  transition:all 0.5s ease;}.kuRECSContainer .kuRECSResultsInner .kuRECS-itemWrap{  display:inline-block;  margin:12px;  margin-left:0px;  vertical-align:top;  width:180px;  border:1px solid #efefef;  border-radius:2px;}.kuRECSContainer .kuRECSResultsInner .kuRECS-item{  margin:0 auto;  padding:12px;  background:#FFF;}.kuRECSContainer .kuRECSResultsInner .kuRECS-itemImg{  display:flex;  justify-content:center;  align-items:center;  flex-direction:column;  width:100%;  height:210px;}.kuRECSContainer .kuRECSResultsInner a.kuRECSImg img{  max-width:100%;  height:auto;  width:auto;  display:inline-block;  margin:0 auto;}.kuRECSContainer .kuRECSResultsInner a.kuRECSTitle{  font-size:16px;  font-weight:bold;  text-decoration:none;  overflow:hidden;  white-space:nowrap;  text-overflow:ellipsis;  display:block;  color:#000;}.kuRECSContainer .kuRECSResultsInner .kuRECS-itemDesc{  margin-top:12px;  box-sizing:border-box;  overflow:hidden;  white-space:nowrap;  text-overflow:ellipse;}.kuRECSContainer .kuRECSResultsInner .kuRECS-itemTag{  color:rgba(0, 0, 0, 0.5);  line-height:110%;  margin-bottom:5px;  min-height:20px;}.kuRECSContainer .kuRECSResultsInner .kuRECS-itemSku{  color:rgba(0, 0, 0, 0.5);  font-size:80%;  line-height:110%;  margin-bottom:5px;}.kuRECSContainer .kuRECSResultsInner .kuRECS-itemPrice{  font-size:12px;  color:#545454;  margin-bottom:4px;  margin-top:4px;}.kuRECSContainer .kuRECSResultsInner .kuRECS-itemPrice .kuSalePrice{  overflow:hidden;  white-space:nowrap;  text-overflow:ellipsis;}.kuRECSContainer .kuRECSResultsInner .kuRECSAddToCartBtn{  border:0px;  width:100%;  padding:6px;  cursor:pointer;  margin-top:8px;  background:#ececec;  color:#000;  border-radius:2px;}.kuRECSContainer .kuRECSResultsInner .kuRECSAddToCartBtn:hover{  background:#333333;  color:#ececec;}\"\n    },\n    \"scripts\": {\n        \"recsObject\": null\n    }\n}",
        "language": "200",
        "customLabel": ""
      }
    ],
    "selectedLanguageId": "hLEZ8xh-V9GIIEzwDwmhA"
  },
  "examples": {
    "languages": [
      {
        "id": "aDC91fZYiMm5gOJ6UmaDw",
        "code": "<?php\n\n$curl = curl_init();\n\ncurl_setopt_array($curl, array(\n  CURLOPT_URL => 'https://config-cdn.ksearchnet.com/recommendations/klevu-158755634955912036/settings/3a5580bf-c5b2-407e-acac-4a58ae730b64',\n  CURLOPT_RETURNTRANSFER => true,\n  CURLOPT_ENCODING => '',\n  CURLOPT_MAXREDIRS => 10,\n  CURLOPT_TIMEOUT => 0,\n  CURLOPT_FOLLOWLOCATION => true,\n  CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,\n  CURLOPT_CUSTOMREQUEST => 'GET',\n));\n\n$response = curl_exec($curl);\n\ncurl_close($curl);\necho $response;\n",
        "language": "php",
        "customLabel": ""
      },
      {
        "id": "ekPWzSrWql1wilbus-ULj",
        "code": "var data = \"\";\n\nvar xhr = new XMLHttpRequest();\nxhr.withCredentials = false;\n\nxhr.addEventListener(\"readystatechange\", function() {\n  if(this.readyState === 4) {\n    console.log(this.responseText);\n  }\n});\n\nxhr.open(\"GET\", \"https://config-cdn.ksearchnet.com/recommendations/klevu-158755634955912036/settings/3a5580bf-c5b2-407e-acac-4a58ae730b64\");\n\nxhr.send(data);",
        "language": "javascript",
        "customLabel": ""
      },
      {
        "id": "WVs1Y_gLp99--DnVmHVhn",
        "code": "OkHttpClient client = new OkHttpClient().newBuilder()\n  .build();\nRequest request = new Request.Builder()\n  .url(\"https://config-cdn.ksearchnet.com/recommendations/klevu-158755634955912036/settings/3a5580bf-c5b2-407e-acac-4a58ae730b64\")\n  .method(\"GET\", null)\n  .build();\nResponse response = client.newCall(request).execute();",
        "language": "java",
        "customLabel": ""
      },
      {
        "id": "vANTuFjc8FB1i6AVFp_Ev",
        "code": "var request = require('request');\nvar options = {\n  'method': 'GET',\n  'url': 'https://config-cdn.ksearchnet.com/recommendations/klevu-158755634955912036/settings/3a5580bf-c5b2-407e-acac-4a58ae730b64',\n  'headers': {\n  }\n};\nrequest(options, function (error, response) {\n  if (error) throw new Error(error);\n  console.log(response.body);\n});\n",
        "language": "nodejs",
        "customLabel": ""
      },
      {
        "id": "xv6ofmpD0KlXxrB8lAQPI",
        "language": "none",
        "code": "",
        "customLabel": ""
      }
    ],
    "selectedLanguageId": "ekPWzSrWql1wilbus-ULj"
  },
  "description": "The end-point is used for retrieving the recommendation template configuration set in Klevu dashboard. ",
  "currentNewParameter": {
    "label": "Query Parameter",
    "value": "queryParameters"
  },
  "autoGeneratedAnchorSlug": "get-recommendation-configuration",
  "legacyHash": "PTZh1h4rZYa5CmrCk8Gxr"
}
```
:::

**Understanding the response: &#x20;**

| **Parameters**            | **Description**                                                                                                                                                                                                                                             |
| ------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| metadata.title            | The title of the Recommendation Banner, eg. "Our newest arrivals!".                                                                                                                                                                                         |
| metadata.recsKey          | The unique identifier of the banner. This will match the value of RECS\_ID in the request, eg. 3a5580bf-c5b2-407e-acac-4a58ae730b64.                                                                                                                        |
| metadata.pageType         | The page type this banner should be displayed on. This will be one of:<br />- **HOME:** Homepage.<br />- **CATEGORY:** Collection or Category Listing Page.<br />- **PRODUCT:** Product Detail Page.<br />- **CHECKOUT:** The Cart or Checkout.             |
| metadata.logic            | The type of recommendation banner which was configured in the KMC. This will be one of:<br />TRENDING<br />TRENDING\_PERSONALIZED<br />NEWEST\_ARRIVALS<br />RECENTLY\_VIEWED<br />HAND\_PICKED<br />OTHER\_ALSO\_VIEWED<br />SIMILAR<br />BOUGHT\_TOGETHER |
| metadata.maxProducts      | The maximum number of products to show within this banner.                                                                                                                                                                                                  |
| metadata.productThreshold | The minimum number of results before this banner will be displayed.                                                                                                                                                                                         |
| metadata.enabled          | Whether or not this particular banner is enabled.                                                                                                                                                                                                           |
| search.basePath           | The search URL to be used to send the Recommendation request to, eg. eucs19v2.ksearchnet.com/cs/v2/search.                                                                                                                                                  |
| search.payload            | This correlates to the recordQueries section of the API call to be fired for this Recommendation.                                                                                                                                                           |
| templates.base            | The HTML to be used for rendering the Recommendation banner, in Klevu JavaScript Library markup.                                                                                                                                                            |
| styles.base               | The CSS that is used for rendering the Recommendation banner, in Klevu's Template JS Library markup.                                                                                                                                                        |
| scripts.recsObject        | The Javascript that is executed after the rendering of the HTML Recommendation banner, in Klevu's Template JS Library markup.                                                                                                                               |

**Note regarding the response:**

*templates.base*, *styles.base*, and *scripts.recsObject&#x20;*&#x72;eturned in the configuration API response should not be used when using the API directly since they require the Klevu's Template JS Library.
