Änderungen

Zur Navigation springen Zur Suche springen

Responsive Buchungsseite

4.311 Bytes hinzugefügt, 11 April
[[Category:Anleitungen]]
[[Category:Buchungsseite]]
[[Category:Buchungsmaschine]]
<div class="heading">Responsive Buchungsseite</div>
Diese Seite ist über das Menue (KONFIGURATION) BUCHUNGSMASCHINE > BUCHUNGSSEITE UNTERKUNFT > LAYOUT und erklärt, wie Sie die responsive Version der Buchungsseite einrichten.
==Buchungsmaschine konfigurieren ==<span class="" style="color: #f3e504; font-size: 250%;" >{{#fas:lightbulb}} </span> Diese Seite erklärt, wie <span style="font-weight: bold;" >Tipp</span> Dieser [https://beds24.com/wizard/wizard4.php?lang=de Wizard] führt Sie durch die responsive Version Konfiguration der Buchungsseite einrichtenBuchungsmaschine.
== Widget für die Website ==
Gehen Sie zu EINSTELLUNGEN> {{#fas:cog}} (KONFIGURATION) BUCHUNGSMASCHINE->WIDGETS um den Code für Website Widgets zu generieren.  Gehen Sie zu {{#fas:cog}} (KONFIGURATION) BUCHUNGSMASCHINE > WIDGETS > IFRAME GENERATOR um den Code zum Einbetten der Buchungsseite in Ihre Website zu generieren. Verwenden Sie die Kontexthilfe (?icons) für Informationen über die iFrame-Einstellungen. 
== Responsive Buchungsseite einrichten ==
 
<embedvideo service="youtube">https://youtu.be/hy0trWoKYe8</embedvideo>
 
===Konzept===
Durch das modulare Design haben Sie volle Kontrolle über das Layout.
Die Kalender zeitgt bis zu zwei Jahre im Voraus an<span class="" style="color: #f3e504; font-size: 250%;" >{{#fas:lightbulb}} </span> <span style="font-weight: bold;" >Tipp</span> Dieser [https://beds24.com/wizard/wizard2.php?lang=de Wizard] führt Sie durch die Individualisierung der Buchungsseite.
====Module====
Module können hinzugefügt oder entfernt werden. Sie haben zusätzliche Einstellungen, worüber Sie auf die induviduellen Bedürfnisse zugeschnitten werden können. Für die meisten Module müssen Inhalte eingegeben werden. Verfügbare Module sind:
*Bilder Galerie oder Slider für Unterkunft, Einheiten und Offerten(Stellen Sie sicher, dass alle Bildformate gleich sind, mischen Sie nicht Hoch- und Querformat)
*Bild für Unterkunft, Einheiten und Offerten
*Featues (Ausstattungsmerkmale) für Unterkunft und Einheiten
<div><ul>
<li style="display: inline-block; vertical-align: top;"> [[File:layout7.png|thumb|none|200px|<p style="font-weight: bold; text-align: center">Template 7</p> <p style="font-weight: bold;">Module:</p> Unterkunft Oben: Slider<br><br>
Einheit: Features <br><br>
Offerte: Offerte Auswahl (Button/Selector), Belegungskalender]]
[https://beds24.com/booking2.php?propid=13434&layout=2 Demo ansehen]
</li>
 
<li style="display: inline-block; vertical-align: top;"> [[File:layout1.png|thumb|none|200px|<p style="font-weight: bold; text-align: center">Template 1</p> <p style="font-weight: bold;">Module:</p>
Offerte: Slider, Beschreibung 1, Kalender, Offerte Auswahl (Button/Selector),<br><br>
Unterkunft Unten: Beschreibung 2]]
[https://www.beds24.com/booking2.php?propid=13434&layout=1 Demo ansehen]
</li>
Offerte: Offerte Auswahl (Button/Selector), Preistabelle<br><br>
Unterkunft Unten: Beschreibung 2]]
[https://www.beds24.com/booking2.php?propid=13434&layout=2 Demo ansehen]
</li>
Offerte: Preistabelle, Offerte Auswahl (Button/Selector), Slider, Beschreibung 2<br><br>
Unterkunft Unten: Beschreibung 2]]
[https://www.beds24.com/booking2.php?propid=13434&layout=3 Demo ansehen]
</li>
 
</ul></div>
 
 
<div><ul>
<li style="display: inline-block; vertical-align: top;"> [[File:layout4.png|thumb|none|200px|<p style="font-weight: bold; text-align: center">Template 4</p> <p style="font-weight: bold;">Module:</p>
Unterkunft Oben: Slider<br><br>
Offerte: Bild, Beschreibung 1, Kalender, Offerte Auswahl (Button/Selector), Beschreibung 2<br><br>
Unterkunft Unten: Beschreibung 2]]
[https://www.beds24.com/booking2.php?propid=13434&layout=4 Demo ansehen]
</li>
</ul></div>
 
 
<div><ul>
<li style="display: inline-block;vertical-align: top;"> [[File:layout5.png|thumb|none|200px|<p style="font-weight: bold; text-align: center">Template 5</p> <p style="font-weight: bold;">Module:</p> Unterkunft Oben: Slider<br><br>
Offerte: Kalender und Preistabelle, Offerte Auswahl (Button/Selector)<br><br>
Unterkunft Unten: Beschreibung 2]]
[https://www.beds24.com/booking2.php?propid=13434&layout=5 Demo ansehen]
</li>
<li style="display: inline-block; vertical-align: top;"> [[File:layout6.png|thumb|none|200px|<p style="font-weight: bold; text-align: center">Template 6</p> <p style="font-weight: bold;">Module:</p> Unterkunft Oben: Beschreibung 1<br><br>
Offerte: Offerte Auswahl (Button/Selector), Preistabelle<br><br>
Eineheit Unten: Slider, Beschreibung]]
[https://www.beds24.com/booking2.php?propid=13434&layout=6 Demo ansehen]</li><li style="display: inline-block; vertical-align: top;"> [[File:layout7.png|thumb|none|200px|<p style="font-weight: bold; text-align: center">Template 7</p> <p style="font-weight: bold;">Module:</p> Unterkunft Oben: Slider<br><br>Einheit: Features <br><br>Offerte: Offerte Auswahl (Button/Selector), Belegungskalender]] [https://www.beds24.com/booking2.php?propid=13434&layout=2 Demo ansehen]
</li>
 
</ul></div>
Wenn Sie auf verschiedenen Webseiten oder Blogs eine andere Buchungsseite anzeigen möchten können Sie verschiedene Layouts anlegen.
Die Facebook App nutzt das "Standard" Layout, welches in {{#fas:cog}} (KONFIGURATION->) BUCHUNGSMASCHINE ausgewählt ist.
=== Bilder ===
In {{#fas:cog}} (KONFIGURATION-) >BUCHUNGSMASCHINE->BILDER können Sie Bilder hochladen und diese Unterkunft, Einheiten oder Offerten zuordnen. <embedvideo service="youtube">https://www.youtube.com/watch?v=lXFa0MPO8TU</embedvideo>
=== Set up Wizard===
Dieser [https://www.beds24.com/wizard/wizard2.php Set up Wizard] führt Sie durch die Schritte. Loggen Sie sich einfach mit Ihrem Benutzernamen und Passwort ein und folgen den Schritten.
===Buchungsmaske invididualisieren===
Gehen Sie zu {{#fas:cog}} (KONFIGURATION-) >BUCHUNGSMASCHINE-> BUCHUNGSSEITE->LAYOUT.
Wenn Sie nur ein Layout benutzen möchten lassen Sie den selector für "Layout" dort sowie den Selector für "Standard Layout" in {{#fas:cog}} (KONFIGURATION->) BUCHUNGSMASCHINE auf 1.
==== Template auswählen ====
Wählen Sie das Template welches sie nutzen möchten und klicken dann auf "Voreinstellung Standardeinstellung laden".
==== Module ändern ====
Jedes Modul hat zusätzliche Einstellungen, die es ihnen erlauben, die Anzeige nach Ihren Bedürfnisen auszurichten. Zu den zusätzlichen Einstellungen gelangen Sie über einen Klick auf "Manage".
<span class="" style="color: #f3e504; font-size: 250%;" >{{#fas:lightbulb}} </span> <span style="font-weight: bold;" >Tipp</span> Diese [https://www.beds24.com/booking2.php?propid=24226&lang=de Demosite] zeigt die wesentlichen Module.
*Wenn Sie Slider oder Bild benutzen und "Style" auf "Volle Breite" gestellt haben, müssen Sie sicher stellen, dass Position = Zeile 1 Position 1, Desktop = Volle Breite, Mobile = Volle Breite eingestellt sind. In Zeile 1 darf kein anderes Modul positioniert sein. Stellen Sie auch sicher, dass Sie alle nicht genutzen Module deaktivieren.
*Wenn Sie eine '''Google Map''' zeigen wollen, müssen Sie Ihren Google Map API Key in {{#fas:cog}} (KONFIGURATION-) BUCHUNGSMASCHINE >BUCHUNGSMASCHINE-BUCHUNGSSEITE UNTRKUNFT >DEVELOPERS eingeben. Normalerweise reicht ein kostenloser Key aus. Den Key können Sie hier generieren: https://developers.google.com/maps/documentation/javascript/get-api-keyStellen Sie sicher, dass Sie alle relevanten Einstellungen in Google vornehmen. *AGB und Stornobedingungen können können über Template Variablen auch Buchungsbestätigungen und Auto Action Emails eingefügt werden. Ein Link zu den AGB kann überall eingefügt werden, wo Texte eingegeben werden können. Unter {{#fas:cog}} (KONFIGURATION -> ) UNTERKÜNFTE -> FRAGEN BEI BUCHUNG kann eine obligatorische individuelle Frage mit Kästchen angelegt werden. Dann muss der Gast ankreuzen, dass der die AGB akzeptiert. Bei Bedarf kann ein Link eingefügt werden z.B: "Die <a href="http://www.meinewebsite.de/agb" target="_blank">AGB </a> habe ich gelesen und akzeptiert." Tauschen Sie www.meinewebsite.de/agb gegen den Link zu Ihren AGB aus.
'''Module Einheit'''
*Marketing Spalte. Die Marketingspalte wird nur in den Modulen "Preistabelle" und "Kalender und Preistabelle" angezeigt.
*Für Offerten können die Module Kalender und Preistabelle und Kalender nicht gleichzeitig genutzt werden. Wenn Sie mehrere Offerten haben, zeigen die Kalender die gleiche Verfügbarkeit für alle Offerten<embedvideo service="youtube">https://youtu. be/Duluca3zmwg</embedvideo>
*Für Offerten können die Module Kalender und Preistabelle und Kalender nicht gleichzeitig genutzt werden. Wenn Sie mehrere Offerten haben, zeigen die Kalender die gleiche Verfügbarkeit für alle Offerten.
Module sind in Zeilen angeordnet. Jeder Abschnitt kann mehrere Zeilen haben.
Sie können die Änderungen unter diesem Layout oder einem anderen Layout speichern. Die Option "auf Voreinstellung Standardeinstellung zurücksetzen" entfernt alle Änderungen.  
==== Farben und Schriften ====
Farben und Schriften {{#fas:cog}} (KONFIGURATION->) BUCHUNGSMASCHINE->BUCHUNGSSEITE-UNTRKUNFT >STYLE geändert werden.
Aktuelle Voreinstellungen Standardeinstellungen sind:
{| class="wikitable"
==== Verhalten ====
Änderungen zum Öffnen und Schließen der Buchungsseite können in {{#fas:cog}} (KONFIGURATION->) BUCHUNGSMASCHINE->BUCHUNGSSEITE-UNTRKUNFT >VERHALTEN vorgenommen werden Hier können Sie auch einen Spamschutz aktivieren.
==== Inhalt ====
Zusätzliche Informationen können der Buchungsseite in {{#fas:cog}} (KONFIGURATION->) BUCHUNGSMASCHINE->BUCHUNGSSEITE-UNTRKUNFT >INHALT hinzugefügt werden. Hier können Sie auch die Warnhinweise ändern, die erscheinen, wenn eine Einheit nicht verfügbar ist.
== Mobilgeräte ==
== Weitere Optionen ==
Allgemeine Einstellungen, die für alle Layout gelten wie Voreinstellungen Standardeinstellungen für Anzahl von Gästen, Buchungsdauer, Preisanzeige etc. befinden sich in {{#fas:cog}} (KONFIGURATION) KONFIGURATION->BBUCHUNGSMASCHINE-BUCHUNGSMASCHINE >BUCHUNGSSEITEUNTERKUNFT.
=== Webfonts===
[https://wiki.beds24.com/index.php/Google_Font_on_Booking_Page Hier] wird erklärt, wie Webfonts eingebunden werden können.
=== Buchung einzelner oder mehrerer Einheiten===
Sie können die Buchung nur einer Einheit oder mehrerer Einheiten erlauben oder Gästen die Wahl geben. Die Einstellung hierfür befindet sich in {{#fas:cog}} (KONFIGURATION->) BUCHUNGSMASCHINE->BUCHUNGSSEITEUNTERKUNFT.
=== Anfragen erlauben, wenn kein Preis gefunden wird ===
Wenn Sie Raten benutzen, können sie in den Raten "Anfrage erlauben" = ja einstellen. Wenn Sie generell nur "Anfragen" erhalten möchten gehen Sie zu {{#fas:cog}} (KONFIGURATION->) UNTERKÜNFTE->REGELN und stellen "Buchungstyp" = Anfrage === Zusätzliche Nachrichten und Warnungen ===Zusätzliche Nachrichten können auf der Buchungsseite in {{#fas:cog}} (KONFIGURATION) BUCHUNGSMASCHINE > BUCHUNGSSEITE UNTERKUNFT >INHALT hinzugefügt werden. Hier können Sie auch die Standard-Warnmeldungen ändern, die angezeigt werden, wenn ein Zimmer nicht verfügbar ist. <span class="" style="color: #f3e504; font-size: 250%;" >{{#fas:lightbulb}} </span> Die Warnung für den Mindestaufenthalt wird auf Offertesniveau angezeigt.Wenn die Nachricht zum Mindestaufenthalt nicht auf Ihrer Seite angezeigt wird, sind alle Ihre Offerte auf 'Nur wenn verfügbar' eingestellt. Sie müssen mindestens 1 Offerte = Immer haben, dann wird die Warnung für den Mindestaufenthalt angezeigt, wenn die Suchdetails nicht verfügbar sind. === Ein Logo zu Ihrer Seite hinzufügen ===* Gehen Sie zu {{#fas:cog}} (KONFIGURATION) BUCHUNGSMASCHINE > BILDER und wählen Sie die zu importierende Datei.* Scrollen Sie zum Bild und klicken Sie auf "Bearbeiten", scrollen Sie bis zum Ende der Seite und kopieren Sie die URL.* Gehen Sie zu {{#fas:cog}} (KONFIGURATION) BUCHUNGSMASCHINE > BUCHUNGSSEITE UNTRKUNFT > INHALT "Beschreibung Unterkunft 1"* Clicken Sie 'Bearbeiten', Suchen Sie dann das Symbol "Bild" und fügen Sie die URL in das URL-Feld ein, fügen Sie ggf. eine Beschreibung hinzu, ändern Sie die Größe nach Bedarf und klicken Sie auf OK. Verwenden Sie die anderen Funktionen, um das Bild wie gewünscht zu positionieren (Mitte, links, rechts).* Klicken Sie auf Speichern. === Spamschutz ===Sie können sich über Ihre Buchungsseite vor Spam schützen in {{#fas:cog}} (KONFIGURATION) BUCHUNGSMASCHINE > BUCHUNGSSEITE UNTRKUNFT > VERHALTEN. *Setzen Sie "Captcha Code" auf "Pflichtfeld", damit Ihre Gäste einen Captcha-Code eingeben müssen, um die Buchung fortzusetzen. *Setzen Sie "Code per Email" auf "Pflichtfeld", damit Ihr Gast die Buchung nur fortsetzen kann, wenn er einen Code eingibt, der automatisch an ihn gesendet wurde.
=== TripAdvisor Widgets ===
=== Zusätzliche Informationen und Warnungen ===
Zusätzliche Informationen können unter {{#fas:cog}} (KONFIGURATION->) BUCHUNGSMASCHINE->BUCHUNGSSEITE-UNTERKUNFT>CONTENT angelegt werden. Hier können Sie auch die Wanrungen individualisieren, die angezeigt werden, wenn keine Verfügbarkeit vorhanden ist.
=== Cookies===
Sie können ein Tool wie dieses https://cookieconsent.insites.com/download/ nutzen, welches ein Skript erzeugt, dass Sie in {{#fas:cog}} (KONFIGURATION-) BUCHUNGSMASCHINE >BUCHUNGSSEITE UNTRKUNFT > DEVELOPER "Einfügen in HTML" eingeben. === Chat hinzufügen===Chat Systeme stellen eine Skript zur Verfügung, welches in {{#fas:cog}} (KONFIGURATION) BUCHUNGSMASCHINE ->BUCHUNGSSEITE UNTRKUNFT > DEVELOPER "Einfügen in HTML" eingebenwerden kann.
==Multiple Layouts==
Sie können bis zu 6 verschiedene Layouts gleichzeitig einsetzen.
Das "Standard" Layout wird in {{#fas:cog}} (KONFIGURATION->) BUCHUNGSMASCHINE ausgewählt.
Die Facebook App nutzt das "Standard" Layout, welches in {{#fas:cog}} (KONFIGURATION->) BUCHUNGSMASCHINE ausgewählt ist.
Wenn Sie verschiedene Layouts benutzen wollen, können Sie vor dem "Speichern" den Selektor auf die gewünschte Nummer ändern. Um ein anderes als das Standard Layout zu öffnen können Sie über einen Parameter zur URL definieren. Beispiel
https://www.beds24.com/booking2.php?propid=13437&layout=2
öffnet die Buchungsseite in Layout 1. Wenn Sie Wordpress benutzen können sie dem Shortcode einen Parameter hinzufügen. Weitere Informationen finden Sie in den Plugin Einstellungen.
== Developer ==
Funktionen für Entwickler sind in {{#fas:cog}} (KONFIGURATION-) BUCHUNGSMASCHINE >BUCHUNGSMASCHINE-BUCHUNGSSEITE UNTRKUNFT >DEVELOPER verfügbar.
*Wenn Sie mit CSS arbeiten können, können Sie Ihre eigenen Styles anlegen
Gehen Sie zu KONFIGURATION->BUCHUNGSSEITE und wählen Sie "Version Buchungsseite"= Responsive. Damit aktivieren Sie Layout 1.
Wenn Sie von der adaptiven auf die responsive Version wechseln müssen Sie die Bilder erneut zuordnen. Gehen Sie zu {{#fas:cog}} (KONFIGURATION->) BUCHUNGSMASCHINE->BILDER. Wählen Sie die Einheit, dann "Offerte 1" und ordnen das/die Bilder zu, die Sie zeigen möchten. Wenn Sie mehr als eine Offerte aktiviert haben, wiederholen Sie das für jede Offerte.
Die meisten Einstellungen werden automatisch übernommen.
<embedvideo service="youtube">https://www.youtube.com/watch?v=UOK8Hs_PnOM</embedvideo>  HINWEISNOTE: Wenn Sie "Version Buchungsseite"= Responsive auswählen ändert sich die Buchungsseite auf Ihrer Website. Wenn Sie nur testen wollen, können Sie dies tun, in dem Sie &version=3 zur URL Ihrer Buchungsseite hinzufügen. Um die verschiedenen Layouts zu sehen fügen Sie zu Nummer hinzu. z.B. &version=3&layout=2 zeigt Layout 2. Alternativ können sie Ihre Unterkunft zum Testen kopieren. Wenn Sie das tun stellen Sie sicher, dass alle Channel Manager Verbindungen in der kopierten Unterkunft deaktiviert sind. Für die zusätzlichen Einheiten fällt die normale Gebühr an. Wenn Sie mit den Anpassungen fertig sind können Sie die Einstellungen "Unterkunft klonen" Funktion in SUBACCOUNT (Menue oben rechts) nutzen, um die Änderungen auf Ihre "echte" Unterkunft zu übertragen. Um diese Funktion zu nutzeb, klicken Sie auf das 'User Icon' oben rechts und dann auf 'Account Management' (im alten Control Panel gehen Sie zu SUB ACCOUNTS im Menu oben rechts).

Navigationsmenü