Intégrer un localisateur d'armes sur son propre site web.

Le widget Gunfinder offre aux opérateurs de sites web la possibilité d'afficher les résultats de recherche Gunfinder sur leur propre site. Un bon exemple est l'intégration de Gunfinder sur Geartester (tout en bas de la page).

Voici une brève explication sur la façon d'intégrer le widget Gunfinder sur son propre site. En gros, le processus se compose de 2 étapes : tout d'abord, un fichier JavaScript est intégré, puis dans un deuxième temps, un code HTML minimal peut être écrit, qui sera reconnu et traité par le fichier JavaScript.

Intégration du fichier JavaScript

Le code suivant doit être intégré soit dans le Head, soit dans le Body du document HTML :
<script src="https://widgets.gunfinder.de/js/search.js" async></script>

Placement de l'extrait HTML

Dès que le fichier JavaScript est inclus, un nouvel élément DIV peut être inséré, qui doit avoir un attribut nommé data-gunfinder-search-widget pour être reconnu par le code JavaScript. Voici un exemple simple :
<div data-gunfinder-search-widget data-gunfinder-search-query="{requête}"></div>

Cela lancera une recherche avec le terme {requête} sur Gunfinder et les résultats seront affichés sur la page. data-gunfinder-search-query est le seul attribut obligatoire. D'autres attributs possibles peuvent être trouvés dans le tableau suivant. Tous les attributs doivent avoir le préfixe data-gunfinder-search-.

Attribut	Description	Valeurs possibles	Obligatoire
query	Requête de recherche	Texte	Oui
count	Nombre maximum de résultats. Nombre entier. Valeur par défaut : 5	> 0 < 30	Non
price-min	Prix minimum. Nombre entier.	> 0 < price-max (si spécifié)	Non
price-max	Prix maximum. Nombre entier.	> 0 > price-min (si spécifié)	Non
condition	État de l'article	new ou used	Non
available	Disponible immédiatement. Valeur par défaut : false	true ou false	Non
category	Limiter la recherche à une catégorie spécifique	weapon, ammunition, optics, apparel, equipment	Non
style	Style. Voir la description ci-dessous.	Objet JSON	Non
sources	Liste séparée par des virgules avec les noms des sources à rechercher. Par défaut, toutes les sources sont recherchées.	Veuillez nous contacter	Non
exclude-sources	Liste séparée par des virgules avec les noms des sources à ne pas rechercher (!). Par défaut, toutes les sources sont recherchées.	Veuillez nous contacter	Non
marketplace	Si true, n'affiche que les résultats du marché. Si false, n'affiche aucun résultat du marché.	true ou false	Non

Autres exemples :
<div data-gunfinder-search-widget data-gunfinder-search-query="{requête}" data-gunfinder-search-price-min="2500"></div>
<div data-gunfinder-search-widget data-gunfinder-search-query="{requête}" data-gunfinder-search-available="true"></div>

Style

Si le widget ne doit pas être stylisé par des règles CSS, il existe quelques variables simples qui peuvent être passées au widget sous forme d'objet JSON pour modifier l'apparence du widget.

Variable	Description	Valeurs possibles
fontSize	Taille de police de base. A un impact sur l'ensemble du widget.	Valeurs CSS standard pour les tailles
itemTitleColor	Couleur du titre de l'offre	Valeurs CSS standard pour les couleurs
itemPriceColor	Couleur du prix de l'offre	Valeurs CSS standard pour les couleurs
moreColor	Couleur du texte et du cadre du bouton "autres offres"	Valeurs CSS standard pour les couleurs

Exemple :
<div data-gunfinder-search-widget data-gunfinder-search-query="{requête}" data-gunfinder-search-style='{"fontSize": "15px", "itemTitleColor": "red"}'></div>

Publié le 09/09/2019