A RESnWEB szobafoglalási rendszert és moduljait be lehet ágyazni a szálláshely weboldalába, hogy egy egységes, designba illő, látszólag saját URL-en futó felhasználói élményt kapjon a foglalni szándékozó látogató. Illetve lehet használni a saját, külső URL-jén is.
Az URL-eken keresztül GET paraméterek segítségével átadhatóak adatok a modulnak. Használatuk azonban eltér attól függően, hogy az ajándékutalvány értékesítő modul iframe-en keresztül vagy közvetlenül érhető el.
A beágyazás előfeltételei
A domain érvényes SSL tanúsítvánnyal rendelkezik
A kód beillesztéséhez a szálláshely azonosítója és a beágyazási kulcs rendelkezésre áll
Hibás működést eredményezhet:
A kód tömörítése
SSL tanúsítvány használatának mellőzése
Az ügyfélszolgálattal egyeztetett URL-től eltérő URL használata
(pl.: https://example.com/foglalas helyett https://example.com/online-foglalas)Érvénytelen beágyazási kulcs
Nem megfelelő szálláshely azonosító
Forráskód generálása
Az adminisztrációs felületen a bal oldali menüben kattintson a Hoteladatok/Webmestereknek menüpontra.
Az "Integrációs kódok" fül alatt található táblázatban keresse meg azt az iframe kulcsot, amelyhez beágyazó kódot szeretne generálni.
A világos kékkel kiemelt fejlécben kattintson a "Szerkesztés" feliratú gombra.
A felugró ablakban töltse ki igényeinek megfelelően a mezőket, majd kattintson a "Forráskód generálás" feliratú gombra.
Keresse ki a táblázatból az újonnan létrehozott beágyazási beállítást és kattintson a másolás ikonra a forráskód vágólapra másolásához.
1.) Összefoglaló információk
2.) A beágyazandó RESnWEB modul
3.) Sticky header HTML elem beazonosítására szolgáló CSS selector
4.) Az ajándékutalvány vásárlói felület alapértelmezett nyelve
5.) Az ajándékutalvány vásárlói felület alapértelmezett valutaneme
Az utalványvásárlói felület beágyazó kódjainak legenerálása azután lesz lehetséges, hogy rögzítésre kerülnek rendszerünkben azon aloldalak URL címei - idegen nyelvű verzióké is - , ahol a felületek meg fognak jelenni. Példa: https://resnweb.com/ajandekutalvany
Abban az esetben, ha nem látja a felületekhez tartozó URL címeket a listában, kérjük, küldje el részünkre azokat! A rendszerbe való felvitelt követően az URL címek megjelennek a listában és a Szerkesztés gombra kattintás után lehetséges lesz a forráskódok legenerálása.
FONTOS! Nyelvenként és felületenként egy URL rögzíthető a rendszerben. Ez azt jelenti, hogy ha a weboldal több aloldaláról is szeretné elérhetővé tenni felületeinket, akkor ezeken az aloldalakon egy-egy gombot szükséges elhelyezni, melyek mögé a felületek aloldalainak URL címét szükséges beilleszteni. Így bármelyik oldalról is indul a vendég, ugyanarra az aloldalra kerül át.
Beágyazás
Beágyazás esetén a RESnWEB adminisztrációs felületén generált kód beillesztése szükséges a HTML dokumentum nyitó <body> címkéje után. Az iframe közvetlenül a beillesztett kód után ékelődik be a DOM-ba, ezért fontos szempont lehet a beillesztés helye.
A RESnWEB adminisztrációs felületének “Webmestereknek” menüpontjában generált kód a következőképpen néz ki:
Beágyazó kód minta
<script src="https://nethotelbooking.dev/embed.RESnWEB.js?id=MINTA"></script>
Mobil eszközök
Az ajándékutalvány vásárlási felület olyan mobil eszközökre lett optimalizálva, melyeknek a kijelző szélessége legalább 320 képpontból áll. A helyes megjelenés érdekében érdemes ügyelni arra, hogy a beágyazott felület ezeken az eszközökön teljes képernyőszélességben meg tudjon jelenni. Ennek érdekében szükségessé válhat a beágyazó kódot tartalmazó HTML elem padding és margin CSS tulajdonságainak 0-ra állítása kisebb kijelzők esetén.
Ez a beállítás a felhasználói élmény növelésén túl azért is fontos, hogy szűkebb kijelzőjű mobileszközökön se járjon funkcióvesztéssel a felület.
Az ajándékutalvány modul paraméterezése
Bizonyos esetekben igény merülhet fel arra, hogy egy látogató az utalvány azonosítóját és promóciós kódját felhasználva az adott ajándékutalvány oldalára érkezzen. Ezt megtehetjük az URL megfelelő összeállításával.
Beágyazva
Iframe használata esetén a szálláshely azon aloldalának URL-jét kell kiegészíteni GET paraméterekkel, amelyen az ajándékutalvány modul felülete megjelenik. A paraméterek felsorolása ‘&’ jellel elválasztva és ‘rnw_’ előtag használatával történik.
Példa:
https://example.com/ajandekutalvany/?rnw_code=12345678&rnw_voucherID=123456
Beágyazás nélkül
A paraméterek elválasztása ‘;’ jellel történik. Fontos megjegyezni, hogy az utolsó paraméter értékének meghatározása után sem elhanyagolható a ‘;’ karakter.
Példa:
https://nethotelbooking.net/vouchers/DEMO/code=12345678;voucherID=123456;
Megadható paraméterek
Beágyazva | Beágyazás nélkül | Leírás | Példa |
rnw_code | code | kuponkód | PROMOCODE |
rnw_voucherID | voucherID | az ajándékutalvány azonosítója | 42 |
rnw_category | category | utalvány kategória azonosítója | 206 |
Hibaelhárítás
Ellenőrizze, hogy a megadott szálláshely azonosító és beágyazási kulcs megfelelő-e
Tartalomkezelő rendszerek (CMS) keretein belül történő beágyazásnál érdemes a böngésző fejlesztői eszköztárának segítségével meggyőződni arról, hogy a beillesztett kód felépítése megfelel a követelményeknek (a változónevek megfelelőek, a távoli JavaScript fájl hivatkozása helyesnek bizonyul).
Ellenőrizze, a böngésző fejlesztői eszközeivel, hogy program futás közben nem történt-e hiba
Automatikus görgetés beállítása
Beágyazott ajándékutalvány vásárlási felület esetén a böngésző alapértelmezetten az iframe tetejéhez görget. Előfordulhat azonban, hogy a weboldalon található tartalom indokolja, hogy az oldal tetejére irányítsuk a látogatót. A RESnWEB adminisztrációs felületén beállítható, hogy mely lépéseknél görgessen a böngésző a lap tetejére. A beállítás az alábbi instrukciók követésével végrehajtható:
Jelentkezzen be a RESnWEB adminisztrációs felületére!
Kattintson a főmenüben a 'Hoteladatok' menüpontra, majd a lenyíló almenüben válassza ki a 'Webmestereknek' menüpontot!
Ezt követően keresse meg az 'Oldalak navigálása' szekciót!
Jelölje be a foglalási folyamat azon lépéseit, amelyeknél az oldal tetejére szeretné irányítani a látogatót!
A módosítások rögzítéséhez kattintson a 'Mentés' gombra!
Ragadós (sticky) fejléc használata
A weboldalon található ragadós fejléc releváns információkat és funkciókat takar ki a felületeinkből, így kérjük az alábbi beállítás elvégzését, melynek köszönhetően a felület figyelembe veszi a fejléc magasságát és az oldal tartalmát az alatt jeleníti meg.
A RESnWEB adminisztrációs felületén a "Webmestereknek" menüpontban van lehetőség a rögzített fejléc beállítására. Használható ID, class, illetve attributum is.
Pl. #sticky-headers, .sticky-headers
FONTOS! HTML tag nem adható meg.