Поиск товаров для виджетов

  1. По текстовому запросу
  2. По запросу из HTML-элемента
  3. По ID товара на Маркете
  4. По изображению
  5. По изображению из элемента img

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

Задайте запрос, чтобы в виджете показывались товары, найденные по этому запросу. Чтобы нашлась конкретная модель, укажите в запросе ее основные параметры. Например: Sony PlayStation 4 Slim 500 ГБ. Если модель не найдется, загрузятся результаты поиска Маркета для похожей модели.

Как задать запрос
  • В конструкторе: в меню Поиск выберите По текстовому запросу и введите запрос.
  • Вручную в коде: укажите запрос в параметре searchText (например, searchText: "Яндекс.Телефон").
Точный поиск

В виджете можно показывать только те товары, названия которых содержат все слова из вашего запроса. Для этого:

  • В конструкторе: включите опцию Точный поиск.
  • Вручную в коде: добавьте параметр searchMatch: 'exact'.

Если товар не найдется (например, он уже не продается на Маркете), виджет не будет отображаться.

По запросу из HTML-элемента

Выберите селектор для элемента, из которого взять поисковый запрос. В виджет загрузятся товары, найденные по этому запросу. Если на странице несколько подходящих элементов, используется первый.

Совет. Чтобы в виджет с предложениями попал нужный товар, используйте элемент только с названием товара и его параметрами. Если в запрос попадут другие слова, результат поиска может быть неточным. Если на странице нет подходящего элемента, вы можете добавить скрытый элемент (с атрибутом style="display:none;").
Как задать селектор
  • В конструкторе: в меню Поиск выберите По запросу из HTML-элемента и укажите селектор.
  • Вручную в коде: укажите селектор в searchSelector. Чтобы задать отдельный атрибут, добавьте его в searchSelectorAttr.
Точный поиск

В виджете можно показывать только те товары, названия которых содержат все слова из вашего запроса. Для этого:

  • В конструкторе: включите опцию Точный поиск.
  • Вручную в коде: добавьте параметр searchMatch: 'exact'.

Если товар не найдется (например, он уже не продается на Маркете), виджет не будет отображаться.

Примеры селекторов и запросов
Элемент на сайтеЧто указатьКакой запрос получится

Заголовок на странице:

<h1>Обзор смартфона <span>Яндекс.Телефон</span></h1>

Конструктор:

Селектор — h1

Обзор смартфона Яндекс.Телефон

Код:

searchSelector: "h1"

Часть заголовка:

<h1>Обзор смартфона <span>Яндекс.Телефон</span></h1>

Конструктор:

Селектор — h1 span

Яндекс.Телефон

Код:

searchSelector: "h1 span"

Название страницы:

<title>Обзор смартфона Яндекс.Телефон</title>

Конструктор:

Селектор — title

Обзор смартфона Яндекс.Телефон

Код:

searchSelector: "title"

Любой тег с атрибутом id или name. Текст для запроса в самом теге:

<div id="model_name">Яндекс.Телефон</div>

Конструктор:

Селектор —div#model_name

Яндекс.Телефон

Код:

searchSelector: "div#model_name"

Любой тег с любым атрибутом. Текст для запроса в самом теге:

<span itemprop="title">Яндекс.Телефон</span>

Конструктор:

Селектор — span[itemprop='title']

Яндекс.Телефон

Код:

searchSelector: "span[itemprop='title']"

Любой тег с любым атрибутом. Текст для запроса в атрибуте:

<meta property="og:title" content="Яндекс.Телефон"/>

Конструктор:

Селектор — meta[property='og:title']

Атрибут — content

Яндекс.Телефон

Код:

searchSelector: "meta[property='og:title']",
searchSelectorAttr: "content"

По ID товара на Маркете

В виджете можно показывать товары, найденные по их идентификаторам.

Как указать ID товаров
  • В конструкторе: в меню Поиск выберите По ID товара на Маркете и укажите идентификаторы через запятую.
  • Вручную в коде: укажите идентификаторы в параметре searchSelector. Например: searchModelIds: [1971204201, 177547282].
Внимание. Для виджетов Где купить товар, рекомендательных виджетов и виджетов с информацией о товарах можно указать только один идентификатор.
Как узнать идентификатор товара

Откройте карточку товара на Маркете и посмотрите на ее URL. Идентификатор — это набор цифр после «.../product/». Например: https://market.yandex.ru/product/177547282.

По изображению

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

Внимание. Поиск по изображению недоступен для рекомендательных виджетов.
Как задать ссылку на товар
  • В конструкторе: в меню Поиск выберите По изображению и укажите ссылку.
  • Вручную в коде: укажите ссылку в параметре searchImageUrl.

По изображению из элемента img

Укажите селектор для элемента, который содержит ссылку на изображение. Она должна быть в атрибуте src.

Внимание. Поиск по изображению недоступен для рекомендательных виджетов.
Как задать селектор
  • В конструкторе: в меню Поиск выберите По изображению из элемента img и укажите селектор.
  • Вручную в коде: укажите селектор в параметре searchImageSelector.
Примеры
Элемент на сайтеЧто указать
<img id="ProductPhoto" src="http://shop.ru/images/yandex-phone.jpg" alt="Яндекс.Телефон фото">

Конструктор:

Селектор элемента img — #ProductPhoto

Код:

searchImageSelector: "#ProductPhoto"
<div id="ProductPhoto">
  <a href="http://shop.ru/images/yandex-phone-big.jpg">
    <img src="https://shop-example.ru/images/yandex-phone.jpg" alt="Яндекс.Телефон фото">
  </a>
</div>

Конструктор:

Селектор элемента img — #ProductPhoto > a > img

Код:

searchImageSelector: "#ProductPhoto > a > img"