Кнопка "Сохранить"

Плагин кнопки "Сохранить" был упразднен. Этот плагин будет доступен и продолжит работать до 15 сентября 2022 года. После этого поддержка плагина будет прекращена, и его работа прекратится.

Кнопка "Сохранить" позволяет пользователям сохранять товары и услуги в личном списке на Facebook, делиться им с друзьями и получать актуальные уведомления. Например, так человек может сохранить понравившееся пальто, тур в Испанию или заинтересовавшую ссылку, чтобы затем вернуться к этому товару или странице. Пока товар или услуга находятся в списке, пользователь будет получать уведомления об акциях на них.

Конфигуратор кнопки "Сохранить"Пример кода Настройки

Пошаговые инструкции

1. Выберите ссылку на сайт.

Решите, какой сайт вы хотите сохранить с помощью кнопки.

2. Конфигуратор кода

Вставьте ссылку в конфигуратор кода и нажмите кнопку Получить код.

3. Скопируйте и вставьте фрагмент HTML-кода

Скопируйте и вставьте фрагмент кода в HTML-код сайта.

Конфигуратор кнопки "Сохранить"

Ссылка на веб-сайт или продукт для сохранения

Размер кнопки

large

Получить код

Пример полного кода

Скопируйте и вставьте пример кода на свой сайт. Вместо значения data-uri подставьте URL сайта и укажите в теге <title> название, под которым будет отображаться сохраненный сайт.

<html>
<head>
  <title>Your Website Title</title> 
</head>
<body>

  <!-- Load Facebook SDK for JavaScript -->
  <div id="fb-root"></div>
  <script>(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.6";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));</script>

  <!-- Your save button code -->
  <div class="fb-save" 
    data-uri="http://www.your-domain.com/your-page.html">
  </div>

</body>
</html>

Попробуйте сами!

Настройки

Вы можете задать следующие настройки помимо указанных выше:

Настройка	Атрибут HTML5	Описание	По умолчанию
`uri`	`data-uri`	Абсолютная ссылка на сохраняемую страницу.	Текущая ссылка/адрес
`lazy`	`data-lazy`	Если задать значение `true`, в браузере будет использоваться механизм отложенной загрузки. Для этого требуется атрибут iframe `loading="lazy"`. При отложенной загрузке браузер отображает плагин, только если тот расположен достаточно близко к окну просмотра и велик шанс, что пользователь его увидит. Возможные значения настройки: `true`, `false` (используется по умолчанию).	`false`

Кнопка "Сохранить" для товаров

Кнопку "Сохранить" можно использовать не только для сайтов, но и для товаров.

1. Настройка каталога товаров.

Чтобы использовать кнопку "Сохранить" для товаров, сначала нужно настроить каталог товаров.

Каталог товаров — это список товаров, которые вы хотите рекламировать на Facebook. Иногда его также называют лентой товаров. Каждый товар в этом списке описывается с помощью атрибутов, на основании которых затем будут генерироваться объявления. Это ID товара, название, описание, URL целевой страницы, URL изображения, информация о наличии и т. д.

Как создать каталог товаров Динамическая реклама товаров на Facebook

2. ID API Facebook.

Откройте панель приложений и перейдите на вкладку "Настройки". Добавьте платформу "Веб-сайт" и укажите домен сайта.

3. Загрузка SDK для JavaScript.

Загрузите SDK для JavaScript, используя ID приложения, как показано ниже. Вместо {your-app-id} подставьте ID своего приложения.

<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.6&appId={your-app-id}";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

4. Получение URI товара.

С помощью Business Manager

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

Войдите в аккаунт своей компании в Business Manager.
Нажмите "Настройки компании" > "Каталог товаров".
Выберите нужный каталог товаров.
Скопируйте себе ID каталога (прямо под названием). В нашем примере это 768856339915012.
Теперь нужно получить второй атрибут — ID товара в ленте товаров. Чтобы посмотреть примеры из своей ленты, нажмите ID каталога товаров.
Вверху следующей страницы нажмите "Ленты товаров".
Выберите ленту с нужными товарами.
На следующей странице вы увидите товары из ленты. Чтобы плагин определял нужный товар, укажите его ID из ленты.
В плагине используются URI формата product://<catalog_id >/{retailer_id}. Возьмем товар под названием Product #45 из примера выше. Его URI будет выглядеть так: product://768856339915012/45 (напоминаем, ID каталога товаров мы определили в п. 5).

С помощью API Graph

Вы можете получить URI своего товара через API Graph. При загрузке одного или нескольких товаров создайте URL следующего формата, подставив вместо <catalog_id> ID каталога, а вместо <retailer_id> — ID ритейлера своего товара:

product://<catalog_id>/<retailer_id>

Подробнее см. в документации по товарам.

5. URI товара.

В коде кнопки "Сохранить" для data-uri используйте URI данного товара. Например, если URI товара — product://949817451770475/143791832, код будет выглядеть так:

<div class="fb-save" 
  data-uri="product://949817451770475/143791832">
</div>

Представление "Сохраненное"

Все сохраненные ссылки добавляются в представление Сохраненное. В веб-версии оно находится по адресу www.facebook.com/saved. Чтобы открыть его в мобильных приложениях, нужно выбрать Ещё > Сохраненное.

Пример

Сохраненная ссылка

Изменение языка

Чтобы изменить язык кнопки "Сохранить", загрузите локализованную версию Facebook SDK для JavaScript. При загрузке SDK задайте для js.src свой язык и регион. Замените en_US кодом своего языка, например fr_FR для французского (Франция).

js.src = "https://connect.facebook.net/fr_FR/sdk.js#xfbml=1&amp;version=v2.6";

Список поддерживаемых языков и регионов см. в файле Facebook Locales XML.

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

Связанные темы

Социальные плагины: часто задаваемые вопросы Руководство по публикации для веб-мастеров Facebook SDK для JavaScript