Как создать код виджета в конструкторе

Чтобы открыть конструктор, нажмите кнопку ниже:
Совет. Вы можете закрыть конструктор, а потом вернуться к нему — все заданные параметры сохранятся.

На вкладке Внешний вид:

  1. Выберите тип и вид виджета. Примеры разных виджетов:

  2. Укажите, сколько товаров или предложений показывать в виджете.

  3. Включите или выключите автозамену виджета. По умолчанию автозамена виджетов Беру на виджеты Маркета включена, а виджетов Маркета на виджеты Беру — отключена.

  4. Настройте другие параметры, если они есть.

На вкладке Настройки:

  1. Укажите, как искать товар. Подробнее про разные способы поиска.

  2. Заполните остальные поля.

    Поле Описание Поддерживаемые сервисы Пример значения
    Поиск

    Тип поиска товаров. Подробнее см. в разделе Поиск товаров для виджетов.

    Внимание. Поиск по запросу из HTML-элемента (значение по запросу из HTML-тега) не поддерживается, если вы вставляете виджет на Турбо-страницу.

    Маркет, Беру

    по текстовому запросу

    Точный поиск

    Поиск товаров по точному запросу (с вхождением всех слов запроса).

    Используется только при поиске по текстовому запросу или по запросу из HTML-элемента.

    Маркет

    Категории

    Фильтр по категориям товаров. Указывайте идентификаторы категорий через запятую.

    Внимание.

    Используется для виджетов «Где купить товар», «Подборка товаров», некоторых рекомендательных виджетов и виджетов с информацией о товарах.

    Для рекомендательных виджетов и виджетов с информацией о товарах можно указывать только один идентификатор категории.

    Как узнать идентификатор категории

    Откройте страницу категории на Маркете и посмотрите на ее URL. Идентификатор — это набор цифр после «...?hid=».

    Например: https://market.yandex.ru/catalog/54726/list?hid=91491.

    Маркет, Беру

    91072

    91072, 91498

    Производители

    Фильтр по производителям, товары которых нужно показывать в виджете. Указывайте идентификаторы производителей через запятую.

    Как узнать идентификатор производителя

    Откройте страницу производителя (например, с помощью поиска) и посмотрите на URL страницы. Идентификатор производителя — это набор цифр после «...brands/».

    Например: https://market.yandex.ru/brands/143.

    Маркет, Беру

    153043

    153043, 153061

    Магазины

    Фильтр по доменам магазинов, предложения которых нужно показывать в виджете. Указывайте домены через запятую.

    Примечание. Виджет будет содержать только предложения магазина, домен которого вы указали. Например, в виджете с доменом shop123.ru не будет предложений магазина another-shop123.ru.

    Маркет

    shop123.ru, shop456.ru

    Рекомендованные магазины

    Фильтр по товарам или предложениям от магазинов, которые рекомендует производитель.

    Выберите эту опцию, чтобы показывались только товары/предложения от магазинов, которые рекомендует производитель.

    По умолчанию показываются все товары или предложения. Подробнее про рекомендации производителей см. в Помощи Маркета для магазинов.

    Маркет

    Цена (от), ₽

    Фильтр товаров по цене («цена от»). Указывайте цену в рублях, допускаются только целые значения.

    Маркет, Беру

    1000

    Цена (до), ₽

    Фильтр товаров по цене («цена до»). Указывайте цену в рублях, допускаются только целые значения.

    Маркет, Беру

    3000

    Счётчик Метрики

    Номер счетчика в Яндекс.Метрике. С его помощью можно отслеживать статистику по виджету.

    Маркет, Беру

    12345

    CLID

    Идентификатор для размещения виджетов.

    Вы можете узнать его у персонального менеджера.

    Маркет, Беру

    2310490

    ContainerID

    Идентификатор элемента, в котором будет расположен виджет.

    Маркет, Беру

    "marketWidget"

  3. Нажмите кнопку Получить код. Скопируйте код и разместите его на вашем сайте. Рекомендуем вставлять:

    • скрипт виджета — в элемент head, как можно ближе к его началу;
    • контейнер виджета — в элемент body в том месте, где вы хотите показывать виджет.
Совет. Вы можете настроить ширину виджета с помощью CSS-стилей. Например:
<div id="..." style="width: 970px;" ...></div>