Bookingwidget i WordPress: slik legger du til booking steg for steg

Du legger en bookingwidget inn i WordPress ved å kopiere embed-koden fra bookingsystemet og lime den inn i en «Egendefinert HTML»-blokk (Custom HTML på engelsk) på siden der gjestene skal booke. Med Losji henter du koden i Widget Studio ved å velge WordPress som plattform. Deretter oppdaterer du siden og tester den som gjest. To ting avgjør om det virker første gang: at du bruker riktig blokk, og at WordPress-brukeren din har lov til å lagre script-kode.

Under går vi gjennom forskjellen på booking-plugin og widget, hva du må ha på plass før du starter, stegene i WordPress-editoren, sidebyggere som Elementor og de vanligste feilene.

Hva er en bookingwidget i WordPress?

En bookingwidget er en bookingflate som vises på WordPress-siden din, men som henter ledige datoer, priser og betaling fra et eksternt bookingsystem. Gjesten velger datoer, ser totalprisen og betaler uten å forlate siden. Bookingen havner i bookingsystemet, og datoene sperres der. WordPress viser bare flaten. Selve bookingene, betalingen og kalendersynken lever utenfor WordPress.

Booking-plugin eller widget: hva bør du velge?

WordPress har mange booking-plugins. De fungerer på en annen måte enn en widget, og det som passer best avhenger av hvor mye du vil drifte selv. Tabellen viser de typiske forskjellene. Enkelte plugins kobler seg også til eksterne tjenester, så les beskrivelsen til den du vurderer.

Er det forskjell på WordPress.com og selvhostet WordPress?

Ja, og det har betydning for bookingwidgeten. Selvhostet WordPress er programvaren fra wordpress.org som du installerer hos et webhotell. Der bestemmer du selv over brukere, temaer og utvidelser, og en administrator kan legge inn script-kode. WordPress.com er en vertstjeneste der WordPress driftes for deg, og hva du kan legge inn, avhenger av abonnementet. Ifølge WordPress.com sine hjelpesider krever tagger som script og iframe i Custom HTML-blokken en betalt plan med hosting-funksjoner aktivert. Er du usikker på hvilken variant du har, kan du se på hvor du logger inn: går innloggingen via wordpress.com, bruker du vertstjenesten.

Hva trenger du før du starter?

• En WordPress-bruker som har lov til å lagre script-kode. Ifølge wordpress.org har administratorer og redaktører denne rettigheten (unfiltered_html) på et vanlig enkeltnettsted. På et multisite-nettverk har bare superadministrator den.
• Bruker du WordPress.com, krever script og iframe i Custom HTML-blokken en betalt plan med hosting-funksjoner aktivert, ifølge WordPress.com sine hjelpesider.
• En Losji-konto med eiendommen satt opp: bilder, priser, minimumsnetter, regler og tilgjengelighet.
• Betaling koblet til kontoen. Losji tar betalt via Stripe eller Dintero.
• Kalendersynk mot Airbnb og Booking.com hvis du bruker kanalene ved siden av.

Slik legger du inn Losji-widgeten steg for steg

• Kopier embed-koden fra Widget Studio i Losji-portalen. Velg widget og «WordPress» som plattform.
• Åpne siden i WordPress-editoren der widgeten skal vises, for eksempel under presentasjonen av hytta.
• Sett inn en «Egendefinert HTML»-blokk og lim inn hele koden.
• Oppdater siden, åpne den som gjest og send en testforespørsel.

I WordPress-editoren legger du til blokken ved å klikke på blokkinnsetteren (plusstegnet), eller ved å skrive /html i en ny avsnittsblokk og trykke Enter. Klikk deretter på knappen for å redigere HTML, lim inn koden og trykk Oppdater. Fra WordPress 7.0 har blokken egne felt for HTML, CSS og JavaScript. Feltene for CSS og JavaScript vises bare for brukere med rettigheten unfiltered_html. Dette står i wordpress.org sin dokumentasjon av Custom HTML-blokken.

På WordPress trenger du én kodeblokk. Bridge-scriptet som Framer og Wix trenger, er ikke nødvendig her, fordi Egendefinert HTML ofte kjører direkte i siden. Se også oppsettet i WordPress-integrasjonen.

Hvorfor forsvinner koden når jeg lagrer?

Den vanligste grunnen er at brukeren din mangler rettigheten unfiltered_html. Ifølge wordpress.org renser WordPress da innholdet i blokken når siden lagres, og fjerner tagger som script og iframe. Det skjer for eksempel for brukere med rollen bidragsyter. Løsningen er å legge inn koden med en administratorbruker, eller be den som drifter nettstedet om å gjøre det. På WordPress.com er årsaken som regel abonnementet: uten betalt plan med hosting-funksjoner aktivert blir slike tagger fjernet.

Hva med Elementor og andre sidebyggere?

Mange temaer og sidebyggere har sin egen modul for HTML eller kode. Elementor har en HTML-widget der du kan lime inn HTML og script. Les Elementors hjelpesenter om hvem som har tilgang til den på nettstedet ditt. Bruk sidebyggerens HTML-modul på samme måte som Egendefinert HTML-blokken. Noen temaer og sidebyggere legger koden i en egen ramme. Da viser Losji bookingen direkte i området på siden, som inline booking, i stedet for et flytende bookingvindu.

Hvor på siden bør bookingen stå?

• På siden for hver hytte, rett etter bildene og beskrivelsen, der gjesten har bestemt seg.
• På en egen bookingside som du lenker til fra menyen.
• Som en knapp som åpner bookingen i et vindu over siden. Det fungerer når koden kjører direkte i siden, slik Egendefinert HTML ofte gjør.
• Ikke gjemt nederst på forsiden. Gjesten skal finne bookingen uten å lete, også på mobil.

I Widget Studio velger du farger, hjørner og plassering. Widgeten følger typografien på nettsiden din, slik at den ser ut som en del av temaet. Du kan prøve widgeten i demoen før du legger den inn.

Hva bør stå rundt widgeten?

Widgeten tar seg av datoer, pris og betaling, men gjesten bestemmer seg ut fra resten av siden. Sørg for at bildene, beskrivelsen og antall sengeplasser står rett over eller ved siden av bookingen. Skriv kort hva som er inkludert, som sengetøy, vask og ved, og hva som koster ekstra. Lenk til husregler og avbestillingsvilkår, og fortell hvordan gjesten kommer seg fram, særlig om vinteren. Jo færre spørsmål gjesten sitter igjen med, jo oftere fullfører de bestillingen uten å sende e-post først.

Hva gjør du hvis du allerede bruker en booking-plugin?

Da lønner det seg å bytte i rolig periode. Sett opp eiendom og priser i Losji, legg inn kommende bookinger og koble kalendersynken før du fjerner pluginen fra siden. La pluginen ligge deaktivert til du har sjekket at alle framtidige opphold er overført. Losji hjelper deg gratis med flyttingen, og det er ingen bindingstid. Se bytt til Losji.

Hvorfor vises ikke widgeten? Feilsøking

Hvordan tester du at alt virker?

• Åpne den publiserte siden i et privat nettleservindu, slik at du ser den som gjest og ikke som innlogget administrator.
• Test på mobil og PC. Sjekk at kalenderen ikke klippes og at knappene er lette å treffe.
• Gå gjennom en hel bestilling: datoer, antall gjester, totalpris og vilkår.
• Sjekk at testbookingen dukker opp i vertsportalen, og at datoene blir sperret.
• Hvis du bruker iCal mot kanaler, sjekk at datoene også blir sperret der. iCal oppdateres med intervaller, så det kan ta litt tid. Se guiden til iCal-synk.

Hva koster det å ta bookinger på WordPress?

Webhotell, domene og eventuelle premiumtemaer betaler du til leverandørene dine, og prisene varierer. Kostnaden for selve bookingen avhenger av hvor mange enheter du har. Tallene under er eksempler regnet med Losjis listepriser, før betalingsleverandørens behandlingsgebyr. Årlig betaling gir lavere månedspris på de betalte planene.

På Gratis-planen er provisjonen 3 %, maks 400 kr per booking. På Pro er den 2,5 %. Betalingsgebyret er 0,5 % på begge. Bookinger som synkroniseres inn fra Airbnb og Booking.com, belastes ikke av Losji. Regn på egne tall med provisjonskalkulatoren.

Etter at widgeten er live

Bookinger, betalinger og meldinger samles i vertsportalen, og gjesten får automatisk bekreftelse og en gjesteportal med innsjekk, veibeskrivelse og husregler. Har du ikke WordPress-side ennå, kan du lese hvordan du lager en nettside for hytteutleie på WordPress eller en annen plattform.

Sjekkliste: bookingwidget i WordPress

• Eiendom, priser, minimumsnetter og regler er satt opp i Losji.
• Du er logget inn i WordPress med en bruker som kan lagre script-kode.
• Koden fra Widget Studio ligger i en Egendefinert HTML-blokk eller i sidebyggerens HTML-modul.
• Hurtigbufferen er tømt etter endringen.
• Du har testet den publiserte siden som gjest på mobil og PC.
• En testbooking har kommet inn i portalen, og datoene er sperret i alle kanaler.