A-TEC
AEA Airguns
ASG
Aimpoint
Alpen Optics
Alpha Industries
Anschütz
Antonio Zoli
Ares
B&T Schalldämpfer
Baikal
Ballistol
Balzer
Barbour
Barnes
Barnett
Benelli
Beretta
Bergara
Blaser
Brandit
Bremer Tresor
Brenneke
Browning
De Gunfinder Widget biedt website-eigenaren de mogelijkheid Gunfinder zoekresultaten op hun eigen website weer te geven. Een goed voorbeeld is de Gunfinder integratie op Geartester (helemaal onderaan de pagina).
Hieronder wordt kort uitgelegd hoe je het Gunfinder Widget op je eigen website kunt integreren. In wezen bestaat het proces uit 2 stappen: Eerst wordt een JavaScript-bestand ingeladen en in de tweede stap kan er minimale HTML-code worden geschreven die door het JavaScript-bestand herkend en verwerkt wordt.
Het inbinden van het JavaScript-bestand
De volgende code-snippet moet ofwel in de Head of Body van het HTML-document worden ingebonden:
<script src="https://widgets.gunfinder.de/js/search.js" async></script>
Plaatsen van de HTML-snippet
Zodra het JavaScript-bestand is ingeladen, kan er een nieuw DIV-element worden toegevoegd dat een attribuut met de naam data-gunfinder-search-widget moet hebben, zodat het door de JavaScript-code wordt herkend. Hier is een eenvoudig voorbeeld:
<div data-gunfinder-search-widget data-gunfinder-search-query="{Zoekopdracht}"></div>
Hiermee wordt een zoekopdracht met de term {Zoekopdracht} bij Gunfinder gestart en worden de resultaten op de pagina weergegeven. data-gunfinder-search-query is het enige verplichte attribuut. Verdere mogelijke attributen kunnen uit de onderstaande tabel worden gehaald. Alle attributen moeten als prefix data-gunfinder-search- hebben.
| Attribuut | Beschrijving | Mogelijke waarden | Verplicht |
| query | Zoekopdracht | Tekst | Ja |
| count | Maximaal aantal resultaten. Geheel getal. Standaard: 5 | > 0 < 30 | Nee |
| price-min | Minimale prijs. Geheel getal. | > 0 < price-max (indien opgegeven) | Nee |
| price-max | Maximale prijs. Geheel getal. | > 0 > price-min (indien opgegeven) | Nee |
| condition | Artikelstaat | new of used | Nee |
| available | Direct leverbaar. Standaard: false | true of false | Nee |
| category | Beperking van de zoekopdracht tot een bepaalde categorie | weapon, ammunition, optics, apparel, equipment | Nee |
| style | Styling. Zie beschrijving hieronder. | JSON-object | Nee |
| sources | Komma-gescheiden lijst met namen van de bronnen die doorzocht moeten worden. Standaard worden alle bronnen doorzocht. | Neem alstublieft contact met ons op | Nee |
| exclude-sources | Komma-gescheiden lijst met namen van de bronnen die niet(!) doorzocht moeten worden. Standaard worden alle bronnen doorzocht. | Neem alstublieft contact met ons op | Nee |
| marketplace | Als true, toont alleen resultaten van de marktplaats. Als false, toont geen resultaten van de marktplaats. | true of false | Nee |
Meer voorbeelden:
<div data-gunfinder-search-widget data-gunfinder-search-query="{Zoekopdracht}" data-gunfinder-search-price-min="2500"></div>
<div data-gunfinder-search-widget data-gunfinder-search-query="{Zoekopdracht}" data-gunfinder-search-available="true"></div>
Styling
Als het widget niet via CSS-regels gestyled moet worden, zijn er enkele eenvoudige variabelen die als JSON-object aan het widget kunnen worden doorgegeven om het uiterlijk van het widget te veranderen.
| Variabele | Beschrijving | Mogelijke waarden |
| fontSize | Basislettergrootte. Heeft invloed op het gehele widget. | Standaard CSS-waarden voor groottes |
| itemTitleColor | Kleur van de aanbiedingstitel | Standaard CSS-waarden voor kleuren |
| itemPriceColor | Kleur van de aanbiedingprijs | Standaard CSS-waarden voor kleuren |
| moreColor | Tekst- & randkleur van de "meer aanbiedingen"-knop | Standaard CSS-waarden voor kleuren |
Voorbeeld:
<div data-gunfinder-search-widget data-gunfinder-search-query="{zoekopdracht}" data-gunfinder-search-style='{"fontSize": "15px", "itemTitleColor": "red"}'></div>
Kleinadvertentie
