1. Priprema
1.1 Izradi svoju DiBooq stranicu za rezervacije
Najprije izradi svoju DiBooq stranicu za rezervacije. Postavljanje obično traje samo 5–10 minuta.
Nakon što je tvoja stranica za rezervacije aktivna (pogledaj sliku), možeš započeti s izradom svog DiBooq widgeta za rezervacije.
Za ugradnju na vlastitu web stranicu imaš dvije mogućnosti:
- Ugrađeni widget (iFrame): widget za rezervacije ugrađuje se izravno u tvoju web stranicu.
- Popup widget (gumb s preklopnim prozorom): klikom na gumb otvara se widget za rezervacije u preklopnom prozoru, bez napuštanja tvoje web stranice.
SEO savjet
Tehnički, DiBooq widget za rezervacije povezuje se s vašom web stranicom za rezervacije, čime se stvara povratna poveznica na vašu domenu. To može imati pozitivan utjecaj na vaš SEO. Stoga biste pri izradi svoje DiBooq web stranice za rezervacije trebali odabrati ključne riječi koje su što relevantnije za vaše DiBooq poddomene.
1.2 Provjeri koju tehnologiju koristi tvoja postojeća web stranica
Naš widget za rezervacije već je uspješno integriran u različite vrste web stranica, uključujući:
- Web stranice izrađene po mjeri (npr. HTML ili PHP)
- WordPress
- Alate za izradu web stranica kao što su Squarespace, Wix, Jimdo i drugi
Napomena o Jimdu
Jimdo nudi dva različita proizvoda za web stranice. Widget za rezervacije može se integrirati samo s Jimdo Creatorom, jer vam to omogućuje ugradnju prilagođenog HTML i JavaScript koda (isječaka koda).
U Jimdo Website Builderu (ranije Dolphin) nije moguće ugraditi vanjske isječke koda ili widgete. Stoga tamo trenutno nije moguće integrirati widget za rezervacije.
Widget se u pravilu može koristiti i u drugim CMS-ovima ili sustavima za izradu web stranica, pod uvjetom da omogućuju umetanje prilagođenog HTML i JavaScript koda.
2. Izradi svoj widget za rezervacije (Generator koda)
Nakon što izradiš svoju DiBooq stranicu za rezervacije, otvori Generator koda putem sljedeće poveznice:
https://tools.dibooq.com/code-generator.html
Tamo možeš konfigurirati svoj widget za rezervacije i generirati jedinstveni kod za njegovo umetanje na svoju web stranicu.
-
Polje za unos: Tvoja poddomena
Unesi poddomenu koju si odabrao prilikom izrade svoje DiBooq stranice za rezervacije.
Važno: Unesi samo naziv poddomene, bez nastavka.book.dibooq.com.
Primjer: Ako je tvoja stranica za rezervacije dostupna na adresi:apartman.book.dibooq.comupiši samo:apartman -
Padajući izbornik: Jezik widgeta
Opcija Auto (zadano) automatski preuzima jezik tvoje web stranice. Za to koristi atribut lang definiran u HTML zaglavlju stranice.
Ovisno o tehnologiji tvoje web stranice ili CMS-u koji koristiš, taj atribut možda neće biti dostupan. U tom slučaju widget za rezervacije možda neće biti prikazan na očekivanom jeziku.
Ako se to dogodi, možeš odabrati fiksni jezik putem opcije Jezik widgeta. Generirani kod tada će uvijek otvarati widget za rezervacije na odabranom jeziku, bez obzira na jezik tvoje web stranice.
Možeš odabrati: njemački, engleski, španjolski, portugalski, talijanski, hrvatski, engleski ili zadržati zadanu opciju: Auto (zadano) -
Polje za unos: Tekst gumba
Ovdje možeš odrediti tekst koji će biti prikazan na gumbu za otvaranje widgeta za rezervacije.
Tekst koji uneseš prikazivat će se na gumbu kada koristiš Popup widget. -
Polje za unos: Naslov
Ovdje možeš definirati naslov koji će biti prikazan iznad widgeta za rezervacije u preklopnom prozoru.
Ako tvoja web stranica sadrži više smještaja, ovdje možeš, primjerice, upisati naziv smještaja za koji se otvara widget. Tako će tvoji gosti odmah znati koji smještaj rezerviraju. -
Polje za unos: Podnaslov
Ovdje možeš definirati dodatni tekst koji će biti prikazan odmah ispod naslova u preklopnom prozoru.
Podnaslov možeš iskoristiti za kratki opis, važnu napomenu ili osobnu poruku svojim gostima. -
Stiliziranje gumba
Ovdje ćeš pronaći različite mogućnosti prilagodbe gumba koji otvara widget za rezervacije u preklopnom prozoru.
Na taj način možeš uskladiti izgled gumba s dizajnom svoje web stranice.
2.1 Izradi Popup widget (gumb s preklopnim prozorom)
U pregledu možeš vidjeti kako će gumb izgledati na tvojoj web stranici s odabranim postavkama.
Možeš kliknuti na gumb izravno u pregledu. Otvorit će se preklopni prozor točno onako kako će izgledati i na tvojoj web stranici.
Kada budeš zadovoljan postavkama, klikni na Code Snippet kako bi generirao kod za umetanje.
Kod s ugrađenim CSS-om (Inline Styling)
Na lijevoj strani nalazi se kod s već ugrađenim CSS-om (Inline Styling).
Ova je opcija idealna ako želiš postaviti widget za rezervacije samo na jednom mjestu na svojoj web stranici. Dovoljno je kopirati generirani kod i zalijepiti ga na željeno mjesto.
Kod s odvojenim CSS-om
Na desnoj strani nalazi se kod kod kojeg je CSS odvojen od samog widgeta.
Ova se opcija preporučuje ako želiš koristiti widget za rezervacije na više mjesta na svojoj web stranici.
CSS je potrebno dodati samo jednom, primjerice kao prilagođeni CSS u WordPressu. Nakon toga na željena mjesta umećeš samo kraći kod widgeta, bez ponavljanja CSS-a.
Time je održavanje jednostavnije, a svi widgeti za rezervacije na tvojoj web stranici imat će isti izgled.
2.2 Izradi ugrađeni widget (iFrame)
U pregledu možeš vidjeti kako će ugrađeni kalendar za rezervacije izgledati na tvojoj web stranici. Tako možeš provjeriti učitava li se widget ispravno prije nego što ga ugradiš.
Ako se kalendar ispravno prikazuje u pregledu, klikni na Code Snippet kako bi generirao kod za umetanje.
Generirani kod zatim možeš umetnuti na željeno mjesto u HTML kod svoje web stranice.
Kod WordPressa, alata za izradu web stranica ili drugih CMS-ova obično postoji poseban element za tu svrhu, primjerice Prilagođeni HTML, HTML, Ugrađeni HTML ili Umetni kod.
Jednostavno zalijepi generirani kod u odgovarajući element.