Як це працює?

Всього 3 простих кроки

1. Пройти швидку Реєстрацію

Для того, щоб зареєструвати бізнес профіль у декілька кліків, необхідно перейти на сайт Rewish та обрати бажаний спосіб реєстрації.

2. Отримати ключ

Після реєстрації, необхідно перейти до кабінету магазину. Зробити це можна відкривши меню, натиснувши справа зверху на 3 риски. В меню необхідно обрати пункт "Кабінет магазину"
В кабінеті магазину, в полі "Додайте лінк на сайт" необхідно додати посилання на Ваш сайт та натиснути кнопку "Отримати код". Приклад посилання на сайт "https://site.com".

3. Додати кнопку на сайт

Спочатку необхідно додати скрипт Rewish у тег <head> вашого сайту: 

<head>
...
<script 
    async 
    src="https://subscriptions.rewish.io/rewish-lib.min.js?key=key">
</script>
</head>

Де key – це код, який Ви отримуєте у другому кроці

Далі необхідно додати іконки на елементи. Зробити це можна двома способами:

Якщо Ви хочете додавати іконку Rewish безпосередньо в HTML, можна скористатися дата-атрибутами, які передаватимуть дані про товар.

Приклад:

<div class="rewish-logo"
                    data-rewish-title="Title"
                    data-rewish-description="Description"
                    data-rewish-picture="https://rewish.io/*.png|jpeg|jpg|webp|bmp"
                    data-rewish-price="123"
                    data-rewish-link="https://rewish.io/test_link"
                    data-rewish-currency="1">
                    <div class="rewish-logo-icon"></div>
                    <span class="rewish-logo-tooltip">
                        <img class="rewish-logo-tooltip-img" width="16" height="16" src="https://subscriptions.rewish.io/assets/icons/information-circle.svg" />
                        Додати товар у вішліст в Rewish
                    </span>
                </div>

ВАЖЛИВО!
Кожне з полів не є обов’язковим, але для коректної роботи має бути вказане щонайменше одне.

Опис ключових полів:
• data-rewish-title — назва товару або послуги.
• data-rewish-description — короткий опис.
• data-rewish-picture — посилання на зображення товару (підтримуються формати: png, jpeg, jpg, webp, bmp).
• data-rewish-price — ціна (числовий формат).
• data-rewish-link — посилання на сторінку товару.
• data-rewish-currency — код валюти (UAH = 1, USD = 2, EUR = 3, GBP = 4, PLN = 5).

Після розміщення такого блоку на сторінці, іконка Rewish з’явиться автоматично (завдяки підключеному скрипту). Під час кліку на неї дані з дата-атрибутів будуть передані в сервіс Rewish.


ВАЖЛИВО!
Стилі також додадуться автоматично за класом:class="rewish-logo-icon".
Якщо вам потрібно додати свій певний стиль – ви можете додати або замінити стилі в своєму css файлі, але назву классу потрібно залишити саме rewish-logo-icon, для того, щоб система автоматом могла обробити клік на іконку.


Оберіть іконку зі списку:

ЗавантажитиЗавантажитиЗавантажитиЗавантажитиЗавантажитиЗавантажитиЗавантажитиЗавантажитиЗавантажитиЗавантажитиЗавантажитиЗавантажитиЗавантажитиЗавантажитиЗавантажитиЗавантажитиЗавантажитиЗавантажитиЗавантажитиЗавантажити
Завантажити архів

Зверніть увагу:

  1. Розташування скрипта
    Намагайтеся підключати скрипт Rewish якомога раніше у <head> (з використанням async), щоб іконки встигли завантажитися до того, як користувач почне взаємодіяти зі сторінкою.
  2. Крос-доменні обмеження
    Якщо у вас налаштовано суворий CSP (Content Security Policy) чи існують інші обмеження на зовнішні скрипти, переконайтеся, що домен https://subscriptions.rewish.io/ дозволено для завантаження. Щоб скрипт завантажився.