Implementacja widgetu na stronie

Jeżeli posiadasz dane produktów w swojej bazie danych i chcesz zautomatyzować działanie widgetu BUY.BOX, możesz zaszyć skrypt w szablonie swojej strony.

Krok 1

Poniższy kod staw w sekcji na wszystkich podstronach, na których będziesz uzywać widgetu BUY.BOX

<script src="https://buybox.click/js/bb-widget.min.js" defer></script>

Krok 2

Poniższy kod wstaw w miejscu, w którym chcesz wyświetlać widget BUY.BOX

<div class="bb-widget" id="buybox-1" data-bb-id="{buybox-id}" {par}="{wartość}"></div>

gdzie:

{buybox-id} – unikalny identyfikator widgetu do pobrania z panelu wydawcy
{par} – parametr opisujący produkt lub konfiguracyjny (opis poniżej)
{wartość} – wartość parametru opisującego produkt lub konfiguracyjnego

Parametry

data-bb-number - kod GTIN produktu (np. ISBN lub EAN)
data-bb-name - nazwa produktu
data-bb-info - dodatkowy atrybut opiujące produkt (opis poniżej)
data-bb-abpar1, data-bb-abpar2, data-bb-abpar3 - parametry Abpar
data-bb-alt - identyfikator kontenera z alternatywną treścią (opis poniżej)

Dodatkowe atrybuty dla poszczególnych kategorii

Książki - imię i nazwisko autora
Filmy - imię i nazwisko reżysera
Muzyka - wykonawca

Przykłady

Wyszukiwanie produkty po numerze GTIN

<div class="bb-widget" id="buybox-1" data-bb-id="691" data-bb-number="0309975410082"></div>

Wyszukiwanie produkty po nazwie i dodatkowym atrybucie

<div class="bb-widget" id="buybox-1" data-bb-id="691" data-bb-name="Zero To One" data-bb-info="Thiel Peter"></div>

Alternatywna treść

Istnieje możliwość wyświetlenia alternatywnej treści, kiedy widget BUY.BOX nie zwróci żadnych ofert. W takim przypadku można wyświetlić np. spersonalizowany komunikat o braku ofert, baner reklamowy lub listę polecanych produktów.

Krok 1

Utwórz alternatywną treść na stronie.

<div id="no-buybox" style="display: none;">
	<p>Alternatywna treść</p>
</div>

Krok 2

W kodzie widgetu podaj identyfikator bb-alt elementu zawierającego alternatywną treść.

<div class="bb-widget" id="bb-widget" bb-id="1" bb-pid="568747" bb-alt="no-buybox"></div>

Kilka widgetów na jednej stronie

Jeżeli na jednej podstronie chcesz wstawić wiele widgetów, wystarczy że dla każdego widgetu ustawisz indywidualny identyfikator kontenera.

<div class="bb-widget" id="buybox-1" data-bb-id="691" data-bb-number="0309975410082"></div>
...
<div class="bb-widget" id="buybox-2" data-bb-id="691" data-bb-number="0604214271906"></div>