Przykłady Wyszukiwarek
Fostertravel API daje użytkownikom dostęp do zaawansowanej wyszukiwarki wycieczek.
Moduł wyszukiwarki dostępny jest jako widżet w wersji IFRAME i JS oraz w formie kodu HTML
dla użytkowników zaawansowanych.
Wyszukiwarka IFRAME:
<iframe width="320" height="414" frameborder="0" src="{host}/widget"></iframe> {host} - adres url do twojej strony partnerskiej
Podgląd wyszukiwarki IFRAME na stronie WWW
Wyszukiwarka widget JS
Kod do umieszczenia w przed tagiem </body>:
<script>!function(){var e=document.getElementById("ftjs-demo-widget"),t=document.createElement("iframe");t.width="320px",t.height="414px",t.src=e.getAttribute('data-parent-url'),t.setAttribute("frameborder","0"),e.appendChild(t)}(); </script>
Element, w którym zostanie osadzony widżet:
<div id="ftjs-demo-widget" data-partner-url="{host}/widget"></div> {host} - adres url do twojej strony partnerskiej
Podgląd użycia widgetu wyszukiwarki na stronie WWW
Wyszukiwarka zaawansowana:
Przykładowy kod formularza wyszukiwarki do wstawienia na stronie www w dowolnym miejscu.
UWAGA! Wyszukiwarka dla zaawansowanych zawiera zdefiniowany arkusza styli CSS obejmyjący tylko autosuggesta (pole name=’s[kierunek”). Układ wyszukiwarki, style pozostałych elementów formularza oraz kolorystyka jest realizowana po stronie użytkownika.
<form id="searcherForm" data-binding="ftjs" method="GET" style="max-width: 600px">
<div class="form-row">
<div class="form-group col-12">
<label for="inputEmail4">Kierunek</label>
<input type="text" name="s[kierunek]"/>
</div>
</div>
<div class="form-row">
<div class="form-group col-3">
<label for="inputCity">Dorośli:</label>
<input type="number" name="s[dorosli]" value="2" maxlength="1" min="1" max="6" class="form-control"/>
</div>
<div class="form-group col-2">
<label for="inputCity">Wiek dziecka:</label>
<select name="s[dzieci][0]" class="form-control">
<option></option>
<option value="niemowle">Niemowle</option>
<option value="2-lata">2 lata</option>
<option value="3-lata">3 lata</option>
<option value="4-lata">4 lata</option>
<option value="5-lata">5 lat</option>
<option value="6-lata">6 lat</option>
<option value="7-lata">7 lat</option>
<option value="8-lata">8 lat</option>
<option value="9-lata">9 lat</option>
<option value="10-lata">10 lat</option>
<option value="11-lata">11 lat</option>
<option value="12-lata">12 lat</option>
<option value="13-lata">13 lat</option>
<option value="14-lata">14 lat</option>
<option value="15-lata">15 lat</option>
<option value="15-lata">16 lat</option>
<option value="15-lata">17 lat</option>
</select>
</div>
<div class="form-group col-2">
<label for="inputCity">Wiek dziecka:</label>
<select name="s[dzieci][1]" class="form-control">
<option></option>
<option value="niemowle">Niemowle</option>
<option value="2-lata">2 lata</option>
</select>
</div>
<div class="form-group col-2">
<label for="inputCity">Wiek dziecka:</label>
<select name="s[dzieci][2]" class="form-control">
<option></option>
<option value="niemowle">Niemowle</option>
<option value="2-lata">2 lata</option>
</select>
</div>
<div class="form-group col-2">
<label for="inputCity">Wiek dziecka:</label>
<select name="s[dzieci][3]" class="form-control">
<option></option>
<option value="niemowle">Niemowle</option>
<option value="2-lata">2 lata</option>
</select>
</div>
</div>
<div class="form-row">
<div class="form-group col-6">
<label for="inputCity">Rodzaj wycieczki:</label>
<select name="s[typ]" class="form-control">
<option value=""></option>
<option value="wypoczynek">Wypoczynek</option>
<option value="wypoczynek-zwiedzanie">Wypoczynek + zwiedzanie</option>
<option value="rejs-wypoczynek">Rejs + wypoczynek</option>
<option value="wycieczki objazdowe">Wycieczki objazdowe</option>
<option value="rejs">Rejs</option>
<option value="kolonie-obozy">Kolonie i obozy młodzieżowe</option>
<option value="sylwester">Sylwester</option>
<option value="narty">Narty</option>
<option value="city-break">City Break</option>
<option value="wycieczka-edukacyjna">Wycieczka edukacyjna</option>
<option value="wypoczynek-dwa-hotele">Wypoczynek 7+7 (dwa hotele)</option>
<option value="wyjazd-slubny">Wyjazd ślubny</option>
<option value="travel-senior">Travel senior</option>
<option value="pielgrzymka">Pielgrzymka</option>
<option value="przelot">Sam przelot</option>
<option value="dojazd-wlasny">Dojazd własny</option>
</select>
</div>
<div class="form-group col-3">
<label for="inputState">Cena od</label>
<input type="number" name="s[cena_od]" placeholder="" min="0" class="form-control">
</div>
<div class="form-group col-3">
<label for="inputZip">Cena do</label>
<input type="number" name="s[cena_do]" placeholder="" min="0" class="form-control">
</div>
</div>
<div class="form-row">
<div class="form-group col-3">
<label for="inputState">Czas pobytu (od):</label>
<input type="text" name="s[do]" class="form-control" placeholder="od"/>
</div>
<div class="form-group col-3">
<label for="inputState">Czas pobytu (do):</label>
<input type="text" name="s[do]" placeholder="do" class="form-control" /></div>
<div class="form-group col-6">
<label for="inputState">Wyżywienie:</label>
<select name="s[wyzywienie]" class="form-control">
<option value=""></option>
<option value="all-inclusive">All-inclusive</option>
<option value="fb">Śniadania, obiady i kolacje</option>
<option value="hb">Śniadania i obiadokolacje</option>
<option value="bb">Śniadania</option>
<option value="wlasne">Własne wyżywienie</option>
<option value="wedlug-programu">Zgodnie z programem</option>
<option value="obiad">Obiad</option>
</select>
</div>
</div>
<div class="form-row">
<div class="form-group col-3">
<label for="inputState">Standard od:</label>
<input type="number" min="0" max="55" name="s[standard_od]" placeholder="od" class="form-control">
</div>
<div class="form-group col-3">
<label for="inputState">Standard od:</label>
<input type="number" min="0" max="55" name="s[standard_do]" placeholder="do" class="form-control">
</div>
<div class="form-group col-3">
<label for="inputState">Opinie min:</label>
<input type="number" min="0" max="6" name="s[opinie_od]" placeholder="od" class="form-control">
</div>
<div class="form-group col-3">
<label for="inputState">Opinie max:</label>
<input type="number" min="0" max="6" name="s[opinie_do]" placeholder="do" class="form-control">
</div>
</div>
<div class="form-group row">
<div class="col-12 text-right">
<button class="btn btn-primary" type="submit" style="font-size: 1.8rem;">Wyszukaj</button>
</div>
</div>
</form>
Powyższy kod jest tylko prostym przykładem. W swojej strukturze html formularza należy spełnić następujące warunki :
- tag „form” musi posiadać atrybut data-binding="ftjs"
- formularz musi posiadać element z name=”s[kierunek]” w celu przypisania do niego autosuggesta
- pozostałe pola są polami opcjonalnymi
Kod do umieszczenia w przed tagiem </body>:
<script async defer src="https://fosterpartners.pl/fosterpartners/{slug}/widgetautosuggestjs"></script>
{slug} -identyfikator partnera
Podgląd formularza na stronie WWW
Lista dostępnych pól, które można wykorzystać
podczas budowy wyszukiwarki:
|
name
|
Wartość
|
Opis
|
|
s[kierunek]
|
Np.: egipt, turcja,
hurghada
|
identyfikatory lub slugi
lokalizacji (pełna nazwa)
|
|
s[od]
|
dd.mm.YYYY
|
data wylotu
|
|
s[do]
|
dd.mm.YYYY
|
data powrotu
|
|
s[wyzywienie]
|
all-inclusive,
fb,
hb,
bb,
wlasne,
wedlug-programu,
obiad
|
Rodzaj wyżywienia – np.: [all-inclusive]
|
|
s[cena_od]
|
[0-10000]
|
cena minimalna
|
|
s[cena_do]
|
[0-10000]
|
cena maksymalna
|
|
s[dorosli]
|
[1-6]
|
ilość dorosłych (domyślnie 2)
|
|
s[dzieci][0]
|
niemowle
2-lata
3-lata
4-lata
5-lat
6-lat
…
..
17-lat
|
wiek kolejnych dzieci (maksymalnie 3 dzieci)
|
|
s[dzieci][1]
|
jw
|
jw
|
|
s[dzieci][2]
|
jw
|
jw
|
|
s[dzieci][3]
|
jw
|
jw
|
|
s[typ]
|
wypoczynek
wypoczynek-zwiedzanie
rejs-wypoczynek
wycieczki objazdowe
rejs
kolonie-obozy
wyprawy
sylwester
narty
turystyka-eventowa
city-break
wycieczka-edukacyjna
fly-drive
wypoczynek-dwa-hotele
wyjazd-slubny
travel-senior
pielgrzymka
przelot
dojazd-wlasny
|
typ oferty –
wypoczynek
wypoczynek + zwiedzanie
rejs + wypoczynek
wycieczka-objazdowa
rejs
kolonie i obozy młodzieżowe
wyprawy
sylwester
narty
turystyka eventowa
city break
wycieczka edukacyjna
Fly & Drive
wypoczynek 7+7 (2 hotele)
wyjazd ślubny
travel senior
pielgrzymka
sam przelot
dojazd własny
|
|
s[dlugosc_od]
|
[0-28]
|
długość trwania wycieczki (dni)
|
|
s[dlugosc_od]
|
[0-28]
|
długość trwania wycieczki (dni)
|
|
s[standard_od]
|
[0-55]
|
minimalny
standard hotelu – format liczba z
przedziału 0-55 gdzie 25 to 2,5 *
|
|
s[standard_do]
|
[0-55]
|
maksymalny standard hotelu - format z przedziału 0-55
|
|
s[ocena_od]
|
[0-6]
|
minimalny średnia opinia o hotelu
|
|
s[ocena_do]
|
[0-6]
|
maksymalna średnia opinia o hotelu
|
Napisz do nas
Zadzwoń: 22 451 00 00
