5/12/2018 De Widget Instructions - slidepdf.com

http://slidepdf.com/reader/full/de-widget-instructions 1/7Page 1 of 7, Rev. 2011

FÜGEN SIE RESERVIERUNGEN ZU IHRER WEBSEITE HINZU 

DAS OPENTABLE RESERVIERUNGSWIDGET AUF DEUTSCH 

Das Reservierungswidget für einzelne Restaurants wird verwendet, um Tische in einem bestimmten Restaurant zusuchen. Der untenstehende Code ermöglicht die Anzeige des Widgets auf Deutsch. Die Reservierungen, die über diesWidget gebucht werden, sind für Sie kostenfrei. Wir empfehlen Ihnen, den Widget Code auf Ihrer Homepage und allenanderen reservierungsrelevanten Seiten zu platzieren.

Nach der Implementierung dieses Codes, testen Sie bitte erst, ob alles korrekt implementiert wurde und dieReservierungen funktionieren, bevor Sie ihn auf die Webseite setzen. Sobald Sie ihn erfolgreich getestet haben, schickSie uns bitte eine Email an reservationlinks@opentable.com mit einem Link zu Ihrer Seite, damit wir sicherstellekönnen, dass die Reservierungen korrekt zur kostenfreien Rate gebucht werden.

Das Reservierungswidget funktioniert nicht mit Webseiten, die mit Flash erstellt wurden. Wenn Ihre Webseite Flashverwendet, benutzen Sie bitte die Textlink Option am Ende dieses Dokuments. Diese Reservierungen werden ebenfall

kostenfrei sein.

EINLEITUNG 

Nachdem Sie das passende Widget für Ihre Webseite ausgewählt haben, müssen Sie die Nummern in rot (1234) gege

Ihre OpenTable Kundennummer austauschen. Ersetzen Sie alle vier Nummern, damit korrekt und kostenlos gebuchtwerden kann. Ersetzen Sie bitte auch den RestaurantNamen Text in blau mit Ihrem Restaurant Namen.

WICHTIG  – Bitte testen Sie das Widget, bevor Sie den neuen Code auf Ihrer Webseite veröffentlichen. Bitte überprüfeSie die Kalender Pop-Up Anzeige und machen Sie eine Testbuchung. Denken Sie daran, die Reservierung wieder zustornieren!

Wir empfehlen Ihnen, das Widget auf diversen Browsern zu testen, wie z. B. Internet Explorer, Firefox und Chrome.

5/12/2018 De Widget Instructions - slidepdf.com

http://slidepdf.com/reader/full/de-widget-instructions 2/7Page 2 of 7, Rev. 2011

WÄHLEN SIE IHRE WIDGET OPTION Das Reservierungswidget ist in drei verschiedenen Versionen erhältlich: kurz, hoch und breit. Code-Ausschnitte für alleVersionen finden Sie unten. Eine Anleitung zur individuellen Anpassung des Widgets finden Sie im Folgenden.

Kurzes Widget:

Kopieren und konfigurieren Sie für die kurze Version diesen Code:

<script type="text/javascript"src="http://www.opentable.de/frontdoor/default.aspx?rid=1234&restref=1234"></script><a class="OT_ExtLink"href="http://www.opentable.de/single.aspx?rid=1234&restref=1234">RestaurantName Reservierungen</a>

Widget Version Ungefähre Dimensionen (B x H)

Kurz (Standard) 180 px x 295 px

Hoch 180 px x 410 px

Breit 885 px x 70 px

5/12/2018 De Widget Instructions - slidepdf.com

http://slidepdf.com/reader/full/de-widget-instructions 3/7Page 3 of 7, Rev. 2011

Hohes Widget:

Kopieren und konfigurieren Sie für die hohe Version diesen Code:

<script type="text/javascript"src="http://www.opentable.de/frontdoor/default.aspx?rid=1234&restref=1234&mode=tall"></script>

<a class="OT_ExtLink"

href="http://www.opentable.de/single.aspx?rid=1234&restref=1234">RestaurantName Reservierungen </a>

Breites Widget:

Kopieren und konfigurieren Sie für die breite Version diesen Code:

<script type="text/javascript"src="http://www.opentable.de/frontdoor/default.aspx?rid=1234&restref=1234&mode=wide"></script><a class="OT_ExtLink"href="http://www.opentable.de/single.aspx?rid=1234&restref=1234">Restaurant Name Reservierungen </a>

5/12/2018 De Widget Instructions - slidepdf.com

http://slidepdf.com/reader/full/de-widget-instructions 4/7Page 4 of 7, Rev. 2011

INDIVIDUELLE ANPASSUNG – RESERVIERUNGSPFAD (OPTIONAL)Das Reservierungswidget wird standardmäßig die Reservierungs-Suchergebnisse in einer Webseite innerhalb desgleichen Browserfensters öffnen.

Alternativ können Sie Reservierungs-Suchergebnisse in einem neuen Fenster überlagernd zu Ihrer Webseite öffnen

(siehe Screenshot unten). Der Gast kann nach Erledigung der Reservierung das Reservierungsfenster einfach schließeFügen Sie dazu &hover=1 in den Code ein.

Beispiel für einen Reservierungswidget Code-Ausschnitt für das überlagernde Fenster:

<script type="text/javascript"src="http://www.opentable.de/frontdoor/default.aspx?rid=1234&restref=1234&hover=1"></script><a class="OT_ExtLink"href="http://www.opentable.de/single.aspx?rid=1234&restref=1234">RestaurantName Reservierungen </a>

WICHTIG  – Bitte testen Sie das Widget für das überlagernde Fenster, um sicherzustellen, dass das Fenster korrektangezeigt wird und die Reservierung gebucht werden kann.

5/12/2018 De Widget Instructions - slidepdf.com

http://slidepdf.com/reader/full/de-widget-instructions 5/7Page 5 of 7, Rev. 2011

INDIVIDUELLE ANPASSUNG – FARBE (OPTIONAL)Die folgenden Elemente Ihres Widgets können individuell angepasst werden. Um die einzelnen Elemente im Widget zuverändern, fügen Sie bitte die entsprechenden Parameter für die Farbänderung in den Code-Ausschnitt desReservierungswidgets ein. Sie finden die Parameter Definitionen in der untenstehenden Anpassungstabelle.Bitte beachten Sie  – Verwenden Sie Kontrastfarben für Text, Icons und Hintergrund für ein möglichst

benutzerfreundliches Widget.

Widget Element

Fügen Sie dieseParameter in IhremJavaScriptSuchanfrage Strangein

Fügen Sie die gewünschte Farbe hinzu

Titel Farbe &titlecolor=Schwarz als Standard. Um dies zu ändern fügen Sie die hexadezimalFarbe ein. Lassen Sie dabei das # Symbol weg (siehe Tabelle auf dernächsten Seite)

Untertitel Farbe &subtitlecolor=Schwarz als Standard. Um dies zu ändern fügen Sie die hexadezimalFarbe ein. Lassen Sie dabei das # Symbol weg (siehe Tabelle auf dernächsten Seite)

Icon Stil&icon=

Zwei Farboptionen: Weiß und Schwarz. Die Icons sind standardmäßigschwarz. Möchten Sie weiße Icons, fügen Sie light ein. 

Hintergrundfarbe&bgcolor=

Hellgrau als Standard. Um dies zu ändern fügen Sie die hexadezimalFarbe ein. Lassen Sie dabei das # Symbol weg (siehe Tabelle auf dernächsten Seite)

Button Farbe&btnbgimage= 

Drei Farboptionen: Rot, Weiß und Schwarz. Die Icons sind standardmärot. Möchten Sie schwarze Icons, fügen Sie dies ein:http://www.opentable.com/frontdoor/img/ot_btn_black.p

Für weiße Buttons fügen Sie dies ein:http://www.opentable.com/frontdoor/img/ot_btn_white.p

Button Textfarbe &otlink=Weiß als Standard. Um dies zu ändern fügen Sie die hexadezimal Farein. Lassen Sie dabei das # Symbol weg (siehe Tabelle auf der nächsteSeite)

TitelfarbeUntertitelfarbe

Icon Stil(hell oder dunkel)

Hintergrundfarbe

Button Farbe(rot, schwarz oder weiß)

Button Text

5/12/2018 De Widget Instructions - slidepdf.com

http://slidepdf.com/reader/full/de-widget-instructions 6/7Page 6 of 7, Rev. 2011

Hexadezimal Farbtabelle (zusätzliche Farbcodes sind erhältlich unter http://html-color-codes.info/ ):

FarbeHexadezimal Farbencode, zu platzieren neben derParameter Definition

Weiß FFFFFF

Blau 08088A

Grün AECC76 Braun 8A4B08

Rot B40404

Beispiel für ein Reservierungswidget mit angepassten Parametern:

<script type="text/javascript"src="http://www.opentable.de/frontdoor/default.aspx?rid=1234&resef=1234&titlecolor=FFFFFF&subtitlecolor=FFFFFF&&icon=light&bgcol=AECC76&btnbgimage= http://www.opentable.com/frontdoor/img/ot_btn_white.png&otlink=0000"></script>

<a class="OT_ExtLink"href="http://www.opentable.de/single.aspx?rid=1234&restref=1234"estaurantName Reservierungen</a>

ANGEPASSTER TEXT LINK:Die Text Link Option erstellt einen Link von Ihrer Webseite zu Ihrer OpenTable Online Reservierungsseite. Sie könnendiesen Link auch in Marketing Emails verwenden. Verlinken Sie die URL-Adresse mit einem handlungsorientiertenSchlagwort oder Satz wie zum Beispiel „Reservierung buchen“ oder „Jetzt reservieren“. Sie sollten allerdings eineVerlinkung mit dem OpenTable Logo vermeiden.

Bitte verwenden Sie das untenstehende Format, um für Ihr Restaurant eine URL-Adresse zu erstellen, bei der Reservierungen für Sie kostenlos sind. Kopieren Sie diese URL-Adresse und ersetzen dabei die Nummern in Rot (

1234) mit Ihrer OpenTable Kundennummer.

Anpassbarer URL auf Englisch:

http://www.opentable.de/en-gb/single.aspx?rid=1234&restref=1234

Anpassbarer URL auf Deutsch

http://www.opentable.de/single.aspx?rid=1234&restref=1234

5/12/2018 De Widget Instructions - slidepdf.com

http://slidepdf.com/reader/full/de-widget-instructions 7/7Page 7 of 7, Rev. 2011

FAQS 

Wieso sieht mein Reservierungswidget wie in diesem Screenshot aus, wenn ich es mir im Internet Explorer anschau

Antwort: Ein DocType muss ganz oben auf der Seite, in der das Reservierungswidget geladen wird, festgelegt sein. Dies hdem Browser zu bestimmen, wie der Inhalt auf der Webseite angezeigt werden soll. Wenn die Webseite keinen festgelegtenDocType hat, fügen Sie bitte einen DocType über dem <html> Tag auf der Webseite hinzu (siehe Beispiel). Verweisen Sienicht auf einen DocType, kann es sein, dass der Widget nicht funktioniert.

Beispiel:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Wieso erscheint das überlagernde Fenster über meiner Webseite nicht?

Antwort: Es gibt kleine Untergruppen von Webseiten, die nicht kompatibel sind mit dem Verfahren für überlagerndeFenster. Sollten Sie Schwierigkeiten mit der Anzeige des überlagernden Fensters haben, empfehlen wir Ihnen,“&hover=1” aus dem Code wieder herauszunehmen.

Wenn Sie weitere Hilfe benötigen, können Sie uns gerne unter dieser Email Adresse kontaktieren:reservationlinks@opentable.com. 

.