Widgeten Popup-fönster för bokning lägger till en knapp på din webbplats. När besökaren klickar på den öppnas din bokningssida i Barberly i ett popup-fönster mitt på skärmen, så hen stannar kvar på sidan medan hen bokar. Du kan använda den på hela webbplatsen eller på enskilda sidor, till exempel sidor om tjänster eller blogginlägg.
Skapa en ny instans#
- Logga in på ditt Barberly-konto på portal.barberly.com.
- Gå till MenyApparAlla widgetar.
- Klicka på Popup-fönster för bokning.
- Välj Skapa ny instans.
- Ge instansen ett namn, till exempel "Huvudpopup för bokning".
Inställningar#
- Knapptext
- Texten på knappen som öppnar popup-fönstret.
- URL för bokning
- Adressen till din bokningssida i Barberly som visas i popup-fönstret.
Stilar#
- Bakgrundsfärg
- Knappens färg.
- Textfärg
- Färgen på knappens text. Välj en som syns tydligt mot bakgrunden.
- Stoppning
- Utrymmet inuti knappen.
- Radie för kantlinje
- Hur rundade knappens hörn är.
- Font Vikt
- Normal, fet och så vidare.
- Radie för kantlinje
- Hur rundade popup-fönstrets hörn är.
- Box Skugga
- En skugga runt popup-fönstret.
På mobila enheter anpassar sig popup-fönstret efter skärmens storlek och har en X-knapp för att stänga det.
Lägg till popup-fönstret på din webbplats#
Förhandsvisningen visar knappen och popup-fönstret. Klicka på knappen och kontrollera att popup-fönstret öppnas med din bokningssida.
- Kopiera koden i avsnittet Kopiera den här koden till din webbplats.
- Klistra in den i webbplatsens HTML där knappen ska visas.
- Spara och publicera webbplatsen.
Exempelkod:
<div id="popup-booking-container"></div>
<script src="https://widgets.barberly.com/barberly-widgets.js" data-business-id="house13" data-widget-id="popup_booking" data-container-id="popup-booking-container"></script>Stegen för respektive plattform finns i guiderna för WordPress, Wix och Squarespace.
Flera instanser#
Du kan skapa fler popup-instanser, till exempel med en egen design för varje del av webbplatsen. Upprepa stegen ovan under Popup-fönster för bokning. Varje instans har sin egen integrationskod.
Uppdatera ett publicerat popup-fönster#
Öppna instansen under MenyApparAlla widgetar, gör dina ändringar och spara. Popup-fönstret på webbplatsen uppdateras automatiskt, så du behöver inte ändra koden på din sajt.