Integruj Gunfinder na svůj web
Widget Gunfinder umožňuje provozovatelům webových stránek zobrazovat výsledky vyhledávání na Gunfinderu na vlastním webu. Dobrým příkladem je integrace Gunfinderu na Geartesteru (úplně dole na stránce).
V následujícím textu stručně vysvětlíme, jak můžeš widget Gunfinder vložit na svůj web. Celý proces má v zásadě 2 kroky: Nejprve vložíš soubor JavaScriptu a potom můžeš napsat jednoduchý HTML kód, který soubor JavaScriptu rozpozná a zpracuje.
Vložení souboru JavaScript
Následující úryvek kódu musí být vložen buď do hlavičky, nebo do těla dokumentu HTML:
<script src="https://widgets.gunfinder.de/js/search.js" async></script>
Umístění HTML úryvku
Jakmile je připojený soubor JavaScript, můžeš vložit nový prvek DIV, který musí mít atribut s názvem data-gunfinder-search-widget, aby ho kód JavaScript rozpoznal. Tady je jednoduchý příklad:
<div data-gunfinder-search-widget data-gunfinder-search-query="{Suchanfrage}"></div>
Tím se na Gunfinder spustí vyhledávání výrazu {Suchanfrage} a výsledky se zobrazí na stránce. data-gunfinder-search-query je jediný povinný atribut. Další možné atributy najdeš v následující tabulce. Všechny atributy musí mít prefix data-gunfinder-search-.
Atribut |
Popis |
Možné hodnoty |
Povinné |
query |
Vyhledávací dotaz |
Text |
Ano |
count |
Maximální počet výsledků. Celé číslo. Výchozí hodnota: 5 |
> 0 < 30 |
Ne |
price-min |
Minimální cena. Celé číslo. |
> 0 < price-max (pokud je uvedeno) |
Ne |
price-max |
Maximální cena. Celé číslo. |
> 0 > price-min (pokud je uvedeno) |
Ne |
condition |
Stav zboží |
new nebo used |
Ne |
available |
Ihned k dodání. Výchozí hodnota: false |
true nebo false |
Ne |
category |
Omezení vyhledávání na konkrétní kategorii |
weapon, ammunition, optics, apparel, equipment |
Ne |
style |
Stylování. Viz popis níže. |
Objekt JSON |
Ne |
sources |
Seznam názvů zdrojů oddělených čárkami, ve kterých se má vyhledávat. Ve výchozím nastavení se prohledávají všechny zdroje. |
Ne |
|
exclude-sources |
Seznam názvů zdrojů oddělených čárkami, ve kterých se nemá(!) vyhledávat. Ve výchozím nastavení se prohledávají všechny zdroje. |
Ne |
|
marketplace |
Pokud je hodnota true, zobrazí pouze výsledky z tržiště. Pokud je hodnota false, nezobrazí žádné výsledky z tržiště. |
true nebo false |
Ne |
Další příklady:
<div data-gunfinder-search-widget data-gunfinder-search-query="{Suchanfrage}" data-gunfinder-search-price-min="2500"></div>
<div data-gunfinder-search-widget data-gunfinder-search-query="{Suchanfrage}" data-gunfinder-search-available="true"></div>
Styling
Pokud widget nechceš stylovat pomocí pravidel CSS, můžeš mu předat několik jednoduchých proměnných jako objekt JSON a změnit tak jeho vzhled.
Proměnná |
Popis |
Možné hodnoty |
fontSize |
Základní velikost písma. Ovlivňuje celý widget. |
Standardní hodnoty CSS pro velikosti |
itemTitleColor |
Barva nadpisu nabídky |
Standardní hodnoty CSS pro barvy |
itemPriceColor |
Barva ceny nabídky |
Standardní hodnoty CSS pro barvy |
moreColor |
Barva textu a rámečku tlačítka „další nabídky“ |
Standardní hodnoty CSS pro barvy |
Příklad:
<div data-gunfinder-search-widget data-gunfinder-search-query="{Suchanfrage}" data-gunfinder-search-style='{"fontSize": "15px", "itemTitleColor": "red"}'></div>