Installera bokaknappen på din webbplats

Du behöver inte en programmerare för det här, och du behöver inte förstå koden. Du kopierar två textsnuttar från Rentalbuddy och klistrar in dem på din webbplats. Den här guiden förklarar exakt var varje del ska in och vad du ska göra när knappen inte visas.

De två delarna, och varför du behöver båda

Del	Vad den gör	Var den ska in
Kopiera kod för bokningsmotor (skriptet)	Laddar Rentalbuddy på din webbplats	En gång för hela webbplatsen, i dina sidövergripande kod-/sidfotsinställningar
Kopiera knappkod (knappen)	Markerar exakt var knappen ska visas	På sidan där du vill ha knappen

Ingen av dem fungerar ensam. Skriptet utan knappkod laddar Rentalbuddy men visar ingenting. Knappkoden utan skriptet lämnar en tom yta på sidan. Det här är det vanligaste misstaget — operatörer kopierar bara knappkoden och undrar varför ingenting händer. (Det enda undantaget: mejllänkar för att låsa upp eller förlänga en bokning fungerar utan en knapp.)

Innan du börjar

Bokaknappen konfigureras per plats, så gör det här för varje plats som ska ha en knapp på din webbplats.

Steg 1 — Öppna inställningarna för Bokaknapp

Öppna Platser i menyn till vänster.
Klicka på platsen du vill ändra.
Öppna fliken Bokaknapp.

Steg 2 — Välj hur kunderna bokar

Under Var bokar kunderna?, välj Min egen webbplats.

Välj sedan under Hur bokar kunder från er webbplats? alternativet Inbäddat på er webbplats — det är valet som ger dig knappkoden. (Det andra alternativet, Bokningslänk, ger dig bara en länk till en sida som Rentalbuddy driftar, och kräver ingen kod alls. Om du inte är säker på att du kan installera kod är det ett fullt godtagbart alternativ.)

Steg 3 — Berätta för Rentalbuddy vilken webbplatsbyggare du använder

Under Vilken webbplatsbyggare använder du?, välj din byggare i listan — WordPress (tre varianter), Wix, Squarespace, GoDaddy Website Builder, Webflow, Jimdo, IONOS (MyWebsite) eller Annat / jag vet inte.

Det här ändrar inte koden. Det ändrar instruktionerna som visas vid varje steg så att de matchar din byggares menyer. Välj Annat / jag vet inte om inget passar — du får ändå allmänna instruktioner.

Steg 4 — Lägg till skriptet på din webbplats (en gång)

I steget Lägg till bokningsmotorn på din webbplats, klicka på Kopiera kod för bokningsmotor. Du får en enda rad som ser ut så här:

<script defer src="https://plugin.rentalbuddy.io/static/js/main.js"></script>

Använd alltid kopieringsknappen i stället för att skriva av den här för hand — kopian ger dig exakt den adress ditt konto använder.

Klistra in den i din webbplats sidövergripande kodfält, i slutet av sidans body. I webbplatsbyggare kallas det här fältet oftast för anpassad kod, header-/sidfotskod, spårningsskript eller något som nämner "före </body>". Rentalbuddys egen formulering under det här steget: "Laddar Rentalbuddy på din webbplats. Lägg in detta en gång per webbadress."

Ungefär var du ska leta i de vanligaste byggarna (menynamn ändras, så se det här som en utgångspunkt):

WordPress — WordPress har inget inbyggt fält för det här. Guiden i produkten rekommenderar att du installerar ett litet gratis plugin som Insert Headers and Footers eller WPCode och använder dess fält för Footer / "före </body>". Om du använder ett cache-plugin, rensa cachen efter att du sparat.
Wix — Site & app settings → Custom code (ibland under Tracking & Analytics), placering Body – end, tillämpad på alla sidor.
Squarespace — Settings → Advanced → Code injection → Footer. Alla Squarespace-planer inkluderar inte kodinjektion.

Spara och publicera sedan din webbplats.

Klistra bara in skriptet en gång. Extra kopior ignoreras, så en dubblett ställer inte till med något — men den gör sidan långsammare och gör det oklart vilken kopia du ska byta ut om du senare behöver cookiebanner- eller async-versionen som beskrivs längre ner. Om du är osäker på om det redan finns där, sök i dina sidövergripande kodfält efter rentalbuddy innan du lägger till ännu en kopia.

En webbplats med flera sidor: klistra in det en gång, sidövergripande. Flera separata webbplatser: klistra in det en gång på varje webbplats.

Steg 5 — Ange din webbplatsadress

I steget Placera knappen där den ska synas hittar du fältet URL där bokaknapp är implementerad. Ange den fullständiga adressen till sidan där din knapp ska sitta — till exempel https://yoursite.com/booking.

Regler som systemet upprätthåller:

Den måste börja med https:// eller http://. Utan det misslyckas sparandet med "URL:en måste börja med https:// eller http://."
Den får inte innehålla ett ?. Det här inträffar oftast om du klistrar in en förhands- eller testlänk. Ta bort allt från ? och framåt.
Den krävs. Utan den kan du inte spara platsen i inbäddat läge.

Det här fältet betyder mer än det verkar. Rentalbuddy bygger länkarna som skickas i e-post — starta hyra, återlämna, förläng, ändra tid — genom att ta den här adressen och lägga till information till den. Om adressen pekar på en sida som inte innehåller knappkoden hamnar dina kunder på den sidan och når aldrig sin PIN-kod eller returstegen. Om du ändrar adressen mitt i säsongen kommer redan utskickade länkar att peka på den gamla sidan.

Steg 6 — Placera knappen på sidan

Fortfarande i Placera knappen där den ska synas, klicka på Kopiera knappkod intill Standardbokning. Du får en rad som den här:

<div id="rentalbuddy-checkout" data-site="your-location-id"></div>

Klistra in den på själva sidan — i ett HTML-/Embed-/Kod-block i din sidredigerare, exakt där knappen ska visas. Inte i de sidövergripande inställningarna; det är dit skriptet från steg 4 gick.

Under Avancerat (bara om det behövs) finns två knappkoder till: Produkt bokning och Event bokning. Använd dem bara om din plats erbjuder både produkter och evenemang och du vill ha en knapp som hoppar över valet. Annars är Standardbokning rätt val.

Spara och publicera sidan.

Steg 7 — Kontrollera att det fungerar

Klicka på Spara i Rentalbuddy.
Klicka på Förhandsvisa intill bokningsalternativet — det öppnar din webbplats i en ny flik med bokningsflödet så att du kan kontrollera att inbäddningen fungerar.
Öppna även din sida på vanligt sätt, i ett privat/inkognitofönster, så att du ser den som en kund gör och inte från cache.

Knappens text och utseende

Två saker med knappens utseende överraskar nästan alla.

Om du aldrig sätter en text säger knappen BOOK — med versaler. Det är den inbyggda reservetiketten, inte ett stilval du har gjort. Ge den en riktig etikett under Knapptext på samma flik:

För den här platsen: slå på Anpassa för den här platsen och fyll i Standardtext. Under Avancerade inställningar finns separata fält Text för produkt / Text för evenemang för de avancerade knappkoderna.
För alla platser på en gång: använd Redigera text för konto.

Två beteenden att känna till. Med Anpassa för den här platsen avstängd används kontots texter och platsens fält visas inte ens. Och att tömma alla platsfält medan brytaren är på gör också att kontots texter tyst används i stället.

Din webbplats stilmall kan stila om knappen. Knappen är ett vanligt knappelement på din sida. Dess färger och typsnitt sätts direkt på elementet, så vanliga webbplatsstilar ändrar inte dem — men regler märkta !important, och egenskaper som knappen lämnar osatta (som versalisering av text), slår igenom. Så om texten visas med versaler trots att du skrev vanliga bokstäver är det din webbplats stilmall, inte Rentalbuddy. Använd Knappstil (samma flik) för att sätta utseendet uttryckligen, och kontrollera resultatet med Förhandsvisning.

Ändringar av text och stil kräver inte att du kopierar om någon kod — de börjar gälla nästa gång sidan laddas.

Vad den röda markeringen faktiskt betyder

Fliken Bokaknapp (och kolumnen URL för bokaknapp i platslistan) visar en röd markering tills konfigurationen är klar — och operatörer slåss rutinmässigt med den på fel ställe, på grund av ett missförstånd:

Den röda/gröna markeringen tittar aldrig på din webbplats. Rentalbuddy besöker inte din sida och upptäcker inte om koden är installerad. Markeringen speglar bara det som är sparat i admin:

Inbäddat på er webbplats: grön när en giltig URL där bokaknapp är implementerad är sparad (börjar med http(s)://, inget ?).
Bokningslänk: alltid grön.
Alternativet med webbplats som Rentalbuddy driftar: grön när den webbplatsen är påslagen.

Så om markeringen "förblir röd trots att knappen finns på vår sida": webbplatsen är irrelevant — ett osparat, tomt eller ogiltigt URL-fält är orsaken. Fyll i det, tryck på Spara, så slår den om. Tooltipen talar om vilket fall du är i: "Välj hur kunder bokar och slutför inställningen av bokaknappen." (inget valt eller URL saknas) eller "URL:en måste börja med https:// eller http://." Omvänt bevisar en grön markering inte att koden finns på din sida — Förhandsvisa är verktyget som faktiskt öppnar din sida och visar om knappen fungerar.

Vanliga fallgropar

En cookiebanner blockerar skriptet

Om du använder en cookiebanner kan den hålla tillbaka Rentalbuddy-skriptet tills besökaren accepterar cookies — så att knappen visas sent eller inte alls. Rentalbuddy varnar för exakt det här: "Om bokningsknappen inte visas och du använder en cookie-banner kan webbplatsen blockera skriptet tills besökare godkänner cookies."

Under Avancerat (bara om det behövs) → Cookie-samtyckesverktyg finns färdiga versioner av skriptet för två vanliga verktyg: Kopiera för Cookiebot och Kopiera för OneTrust. Ersätt skriptet du klistrade in i steg 4 med det som matchar.

För alla andra cookieverktyg: markera bokningsskriptet (eller värden plugin.rentalbuddy.io) i din cookiebanners inställningar som strikt nödvändigt eller väsentligt. Du behöver inte kategorisera om enskilda cookies.

Knappen visas men beter sig konstigt

Under Avancerat (bara om det behövs) → Skriptladdning kan du kopiera två alternativa versioner av samma skript: Kopiera med async och Kopiera utan defer. Testa en av dem i stället för standardversionen — igen, ersätt kopian du redan klistrat in, lägg aldrig till en till.

Du vill ha en knapp på en andra sida

Skriptet är redan laddat sidövergripande, så du behöver bara knappkoden. Klistra in samma knappkod i ett HTML-/Embed-block på den andra sidan.

Observera att fältet URL där bokaknapp är implementerad bara har plats för en adress per plats. Välj sidan du vill att kunderna ska skickas till från bokningsmejl — det är den sidan mejllänkarna öppnar.

Du vill ha en knapp på en språkversion av din sida

Samma sak som ovan: klistra in knappkoden i språkversionen av sidan. Om det andra språket ligger på en separat webbplats (en annan domän) behöver den webbplatsen sin egen kopia av skriptet.

Vilka språk själva bokningsfönstret erbjuder är en separat inställning på platsen — se Kontoinställningar — var varje inställning finns.

Du har fler än en plats

Varje plats har sin egen knappkod (värdet på data-site skiljer sig) och sin egen webbplatsadress. Kopiera knappkoden från den platsens egen flik Bokaknapp. Själva skriptet är detsamma för alla platser, så det ska ändå bara in en gång per webbplats.

Checklista: knappen visas inte

Gå igenom listan i ordning.

Är båda delarna installerade? Skriptet i de sidövergripande inställningarna, och knappkoden på sidan. Saknat skript är den vanligaste orsaken.
Publicerade du? De flesta byggare kräver ett uttryckligt Publish/Update efter att du sparat, och cache-plugin behöver rensas.
Finns skriptet där mer än en gång? Sök i dina sidövergripande kodfält efter rentalbuddy. Ta bort alla kopior utom en.
Är platsen inställd på inbäddad bokning? Öppna Platser → platsen → Bokaknapp och bekräfta att Min egen webbplats → Inbäddat på er webbplats är valt och sparat. Om fliken Bokaknapp visar en röd varning är de sparade inställningarna ofullständiga — se Vad den röda markeringen faktiskt betyder ovan; det handlar om det sparade URL-fältet, aldrig om din webbplats.
Är webbplatsadressen giltig? Den måste börja med https://, får inte innehålla ett ?, och ska vara sidan som faktiskt har knappkoden.
Blockerar en cookiebanner den? Testa Cookiebot- eller OneTrust-versionen av skriptet, eller markera det som strikt nödvändigt i ditt cookieverktyg.
Testa ett annat laddningsalternativ. Byt ut skriptet mot versionen med async eller utan defer.
Kontrollera på en telefon och i ett privat fönster. Cachade sidor och webbläsartillägg kan dölja den.
Finns det faktiskt något att boka? Knappen kan vara korrekt installerad och ändå inte ha något att sälja om platsen saknar öppen period eller produkter. Kunden ser inte ett tomt fönster i det fallet — de ser "Denna uthyrningsstation är för närvarande inte tillgänglig för bokning." med din plats kontaktuppgifter. Se Öppettider och öppetdatum och Kunder ser inga tillgängliga tider, eller inga produkter alls.
Fortfarande fast? Skicka din sidadress till supporten och ange vilken byggare du använder — de två sakerna som avgör allt ovan.