Integrer Gunfinder på din egen hjemmeside
Gunfinder-widgetten giver websideejere mulighed for at vise Gunfinder-søgeresultater på deres egen hjemmeside. Et godt eksempel er integrationen på Geartester (helt nederst på siden).
Herunder forklares det kort, hvordan du kan integrere Gunfinder-widgetten på din egen hjemmeside. Processen består grundlæggende af 2 trin: Først indsættes en JavaScript-fil, og derefter kan du skrive lidt HTML-kode, som JavaScript-filen genkender og behandler.
Indsæt JavaScript-filen
Følgende kodestump skal indsættes enten i head eller body i HTML-dokumentet:
<script src="https://widgets.gunfinder.de/js/search.js" async></script>
Placering af HTML-snippet
Når JavaScript-filen er indlæst, kan du indsætte et nyt DIV-element, som skal have en attribut med navnet data-gunfinder-search-widget, så JavaScript-koden kan genkende det. Her er et enkelt eksempel:
<div data-gunfinder-search-widget data-gunfinder-search-query="{Suchanfrage}"></div>
Det starter en søgning efter {Suchanfrage} på Gunfinder og viser resultaterne på siden. data-gunfinder-search-query er den eneste obligatoriske attribut. Du kan se andre mulige attributter i tabellen nedenfor. Alle attributter skal have præfikset data-gunfinder-search-.
Attribut |
Beskrivelse |
Mulige værdier |
Obligatorisk |
query |
Søgeforespørgsel |
Tekst |
Ja |
count |
Maksimalt antal resultater. Heltal. Standard: 5 |
> 0 < 30 |
Nej |
price-min |
Mindstepris. Heltal. |
> 0 < price-max (hvis angivet) |
Nej |
price-max |
Maksimalpris. Heltal. |
> 0 > price-min (hvis angivet) |
Nej |
condition |
Varens stand |
new eller used |
Nej |
available |
Kan leveres med det samme. Standard: false |
true eller false |
Nej |
category |
Begræns søgningen til en bestemt kategori |
weapon, ammunition, optics, apparel, equipment |
Nej |
style |
Styling. Se beskrivelsen nedenfor. |
JSON-objekt |
Nej |
sources |
Kommasepareret liste med navnene på de kilder, der skal søges i. Som standard søges der i alle kilder. |
Kontakt os venligst her |
Nej |
exclude-sources |
Kommasepareret liste med navnene på de kilder, der ikke skal søges i. Som standard søges der i alle kilder. |
Kontakt os venligst her |
Nej |
marketplace |
Hvis true, vises kun resultater fra markedspladsen. Hvis false, vises ingen resultater fra markedspladsen. |
true eller false |
Nej |
Flere eksempler:
<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
Hvis widgetten ikke skal styles med CSS-regler, findes der nogle enkle variabler, som kan overføres til widgetten som et JSON-objekt for at ændre widgettens udseende.
Variabel |
Beskrivelse |
Mulige værdier |
fontSize |
Grundlæggende skriftstørrelse. Påvirker hele widgetten. |
Standard CSS-værdier for størrelser |
itemTitleColor |
Farve på annoncens overskrift |
Standard CSS-værdier for farver |
itemPriceColor |
Farve på annonceprisen |
Standard CSS-værdier for farver |
moreColor |
Tekst- og kantfarve på knappen "flere annoncer" |
Standard CSS-værdier for farver |
Eksempel:
<div data-gunfinder-search-widget data-gunfinder-search-query="{Suchanfrage}" data-gunfinder-search-style='{"fontSize": "15px", "itemTitleColor": "red"}'></div>