Collection of products

In all examples, products are found using a search query. Different products found on Yandex.Market are uploaded to widgets.

  1. Showcase
  2. A list of products
  3. A compact list of products
  4. Carousel
  5. Gallery

Showcase

The widget width automatically adapts to the selected area.

Widget in a wide area, one row
Widget in a narrow area (for example, on mobile devices), two rows
Note. To set the number of rows, use the themeRows parameter.
Widget code

Code to be embedded in the head element:

<script async src="https://aflt.market.yandex.ru/widget/script/api" type="text/javascript"></script>
<script type="text/javascript">
  (function (w) {
    function start() {
      w.removeEventListener("YaMarketAffiliateLoad", start);
      w.YaMarketAffiliate.createWidget({
        containerId: "marketWidget1",
        type: "models",
        params: {
          clid: 2310490,
          searchText: "Умная колонка",
          themeId: 1,
          themeRows: 2
        }
      });
    }
    w.YaMarketAffiliate
      ? start()
      : w.addEventListener("YaMarketAffiliateLoad", start);
  })(window);
</script>
Copied to clipboard

Code to be embedded in the body element:

<div id="marketWidget1"></div>
Copied to clipboard
Widget size (in pixels)
Width At least 120
Height

At least 200 (for a single-row widget)

At least 385 (for a two-row widget)

The height of one row (starting from the second one)

At least 185

No more than 235

A list of products

The width of a widget with the same code automatically adapts to the selected area.

Widget in a wide area
Widget in a narrow area (for example, on mobile devices)
Widget code

Code to be embedded in the head element:

<script async src="https://aflt.market.yandex.ru/widget/script/api" type="text/javascript"></script>
<script type="text/javascript">
  (function (w) {
    function start() {
      w.removeEventListener("YaMarketAffiliateLoad", start);
      w.YaMarketAffiliate.createWidget({
        containerId: "marketWidget4",
        type: "models",
        params: {
          clid: 2310490,
          searchText: "Умная колонка",
          themeId: 4
        }
      });
    }
    w.YaMarketAffiliate
      ? start()
      : w.addEventListener("YaMarketAffiliateLoad", start);
  })(window);
</script>
Copied to clipboard

Code to be embedded in the body element:

<div id="marketWidget4"></div>
Copied to clipboard
Widget size (in pixels)
Width At least 240
Height At least 110

A compact list of products

The width of a widget with the same code automatically adapts to the selected area.

Widget in a wide area
Widget in a narrow area (for example, on mobile devices)
Widget code

Code to be embedded in the head element:

<script async src="https://aflt.market.yandex.ru/widget/script/api" type="text/javascript">
</script>
<script type="text/javascript">
    (function (w) {
        function start() {
            w.removeEventListener("YaMarketAffiliateLoad", start);
            w.YaMarketAffiliate.createWidget({
                containerId: "marketWidget5",
                type: "models",
                params: {
                    clid: 2310490,
                    searchText: "Умная колонка",
                    themeId: 5
                }
            });
        }
        w.YaMarketAffiliate
            ? start()
            : w.addEventListener("YaMarketAffiliateLoad", start);
    })(window);
</script>
Copied to clipboard

Code to be embedded in the body element:

<div id="marketWidget5"></div>
Copied to clipboard
Widget size (in pixels)
Width At least 255
Height At least 420 (for a six-row widget)
The height of one row (starting from the seventh one) At least 50

Carousel

The width of a widget with the same code automatically adapts to the selected area.

Widget in a wide area
Widget in a narrow area (less than 480 pixels), for example, on mobile devices
Widget code

Code to be embedded in the head element:

<script async src="https://aflt.market.yandex.ru/widget/script/api" type="text/javascript"></script>
<script type="text/javascript">
  (function (w) {
    function start() {
      w.removeEventListener("YaMarketAffiliateLoad", start);
      w.YaMarketAffiliate.createWidget({
        containerId: "marketWidget3",
        type: "models",
        params: {
          clid: 2310490,
          searchText: "Умная колонка",
          themeId: 3
        }
      });
    }
    w.YaMarketAffiliate
      ? start()
      : w.addEventListener("YaMarketAffiliateLoad", start);
  })(window);
</script>
Copied to clipboard

Code to be embedded in the body element:

<div id="marketWidget3"></div>
Copied to clipboard
Widget size (in pixels)
Width At least 300
Height At least 250

Gallery

Widget code

Code to be embedded in the head element:

<script async src="https://aflt.market.yandex.ru/widget/script/api" type="text/javascript"></script>
<script type="text/javascript">
  (function (w) {
    function start() {
      w.removeEventListener("YaMarketAffiliateLoad", start);
      w.YaMarketAffiliate.createWidget({
        containerId: "marketWidget2",
        type: "models",
        params: {
          clid: 2310490,
          searchText: "Умная колонка",
          themeId: 2
        }
      });
    }
    w.YaMarketAffiliate
      ? start()
      : w.addEventListener("YaMarketAffiliateLoad", start);
  })(window);
</script>
Copied to clipboard

Code to be embedded in the body element:

<div id="marketWidget2"></div>
Copied to clipboard
Widget size (in pixels)
Width Always 300
Height Always 600