Sie sind auf Seite 1von 7

FGEN SIE RESERVIERUNGEN ZU IHRER WEBSEITE HINZU DAS OPENTABLE RESERVIERUNGSWIDGET AUF DEUTSCH

Das Reservierungswidget fr einzelne Restaurants wird verwendet, um Tische in einem bestimmten Restaurant zu suchen. Der untenstehende Code ermglicht die Anzeige des Widgets auf Deutsch. Die Reservierungen, die ber dieses Widget gebucht werden, sind fr Sie kostenfrei. Wir empfehlen Ihnen, den Widget Code auf Ihrer Homepage und allen anderen reservierungsrelevanten Seiten zu platzieren. Nach der Implementierung dieses Codes, testen Sie bitte erst, ob alles korrekt implementiert wurde und die Reservierungen funktionieren, bevor Sie ihn auf die Webseite setzen. Sobald Sie ihn erfolgreich getestet haben, schicken Sie uns bitte eine Email an reservationlinks@opentable.com mit einem Link zu Ihrer Seite, damit wir sicherstellen knnen, dass die Reservierungen korrekt zur kostenfreien Rate gebucht werden. Das Reservierungswidget funktioniert nicht mit Webseiten, die mit Flash erstellt wurden. Wenn Ihre Webseite Flash verwendet, benutzen Sie bitte die Textlink Option am Ende dieses Dokuments. Diese Reservierungen werden ebenfalls kostenfrei sein.

EINLEITUNG
Nachdem Sie das passende Widget fr Ihre Webseite ausgewhlt haben, mssen Sie die Nummern in rot (1234) gegen Ihre OpenTable Kundennummer austauschen. Ersetzen Sie alle vier Nummern, damit korrekt und kostenlos gebucht werden 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 verffentlichen. Bitte berprfen Sie die Kalender Pop-Up Anzeige und machen Sie eine Testbuchung. Denken Sie daran, die Reservierung wieder zu stornieren! Wir empfehlen Ihnen, das Widget auf diversen Browsern zu testen, wie z. B. Internet Explorer, Firefox und Chrome.

Page 1 of 7, Rev. 20110523

WHLEN SIE IHRE WIDGET OPTION


Das Reservierungswidget ist in drei verschiedenen Versionen erhltlich: kurz, hoch und breit. Code-Ausschnitte fr alle Versionen finden Sie unten. Eine Anleitung zur individuellen Anpassung des Widgets finden Sie im Folgenden.

Widget Version Kurz (Standard) Hoch Breit Kurzes Widget:

Ungefhre Dimensionen (B x H) 180 px x 295 px 180 px x 410 px 885 px x 70 px

Kopieren und konfigurieren Sie fr 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>

Page 2 of 7, Rev. 20110523

Hohes Widget:

Kopieren und konfigurieren Sie fr 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 fr 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>

Page 3 of 7, Rev. 20110523

INDIVIDUELLE ANPASSUNG RESERVIERUNGSPFAD (OPTIONAL)


Das Reservierungswidget wird standardmig die Reservierungs-Suchergebnisse in einer Webseite innerhalb des gleichen Browserfensters ffnen. Alternativ knnen 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 schlieen. Fgen Sie dazu &hover=1 in den Code ein.

Beispiel fr einen Reservierungswidget Code-Ausschnitt fr 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 fr das berlagernde Fenster, um sicherzustellen, dass das Fenster korrekt angezeigt wird und die Reservierung gebucht werden kann.

Page 4 of 7, Rev. 20110523

INDIVIDUELLE ANPASSUNG FARBE (OPTIONAL)


Die folgenden Elemente Ihres Widgets knnen individuell angepasst werden. Um die einzelnen Elemente im Widget zu verndern, fgen Sie bitte die entsprechenden Parameter fr die Farbnderung in den Code-Ausschnitt des Reservierungswidgets ein. Sie finden die Parameter Definitionen in der untenstehenden Anpassungstabelle. Bitte beachten Sie Verwenden Sie Kontrastfarben fr Text, Icons und Hintergrund fr ein mglichst benutzerfreundliches Widget.

Titelfarbe Untertitelfarbe Icon Stil


(hell oder dunkel)

Hintergrundfarbe Button Farbe


(rot, schwarz oder wei)

Button Text Color


Fgen Sie diese Parameter in Ihrem JavaScript Suchanfrage Strang ein &titlecolor=

Widget Element

Fgen Sie die gewnschte Farbe hinzu

Titel Farbe Untertitel Farbe Icon Stil

&subtitlecolor=

Schwarz als Standard. Um dies zu ndern fgen Sie die hexadezimal Farbe ein. Lassen Sie dabei das # Symbol weg (siehe Tabelle auf der nchsten Seite) Schwarz als Standard. Um dies zu ndern fgen Sie die hexadezimal Farbe ein. Lassen Sie dabei das # Symbol weg (siehe Tabelle auf der nchsten Seite) Zwei Farboptionen: Wei und Schwarz. Die Icons sind standardmig schwarz. Mchten Sie weie Icons, fgen Sie light ein. Hellgrau als Standard. Um dies zu ndern fgen Sie die hexadezimal Farbe ein. Lassen Sie dabei das # Symbol weg (siehe Tabelle auf der nchsten Seite) Drei Farboptionen: Rot, Wei und Schwarz. Die Icons sind standardmig rot. Mchten Sie schwarze Icons, fgen Sie dies ein: http://www.opentable.com/frontdoor/img/ot_btn_black.png Fr weie Buttons fgen Sie dies ein: http://www.opentable.com/frontdoor/img/ot_btn_white.png Wei als Standard. Um dies zu ndern fgen Sie die hexadezimal Farbe ein. Lassen Sie dabei das # Symbol weg (siehe Tabelle auf der nchsten Seite)

&icon=

Hintergrundfarbe &bgcolor=

Button Farbe

&btnbgimage=

Button Textfarbe

&otlink=

Page 5 of 7, Rev. 20110523

Hexadezimal Farbtabelle (zustzliche Farbcodes sind erhltlich unter http://html-color-codes.info/): Farbe Wei Blau Grn Braun Rot Hexadezimal Farbencode, zu platzieren neben der Parameter Definition FFFFFF 08088A AECC76 8A4B08 B40404

Beispiel fr ein Reservierungswidget mit angepassten Parametern: <script type="text/javascript" src="http://www.opentable.de/frontdoor/default.aspx?rid=1234&restr ef=1234&titlecolor=FFFFFF&subtitlecolor=FFFFFF&&icon=light&bgcolor =AECC76&btnbgimage= http://www.opentable.com/frontdoor/img/ot_btn_white.png&otlink=000 000"></script> <a class="OT_ExtLink" href="http://www.opentable.de/single.aspx?rid=1234&restref=1234">R estaurantName Reservierungen</a>

ANGEPASSTER TEXT LINK:


Die Text Link Option erstellt einen Link von Ihrer Webseite zu Ihrer OpenTable Online Reservierungsseite. Sie knnen diesen Link auch in Marketing Emails verwenden. Verlinken Sie die URL-Adresse mit einem handlungsorientierten Schlagwort oder Satz wie zum Beispiel Reservierung buchen oder Jetzt reservieren. Sie sollten allerdings eine Verlinkung mit dem OpenTable Logo vermeiden. Bitte verwenden Sie das untenstehende Format, um fr Ihr Restaurant eine URL-Adresse zu erstellen, bei der die Reservierungen fr Sie kostenlos sind. Kopieren Sie diese URL-Adresse und ersetzen dabei die Nummern in Rot (hier 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

Page 6 of 7, Rev. 20110523

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

Antwort: Ein DocType muss ganz oben auf der Seite, in der das Reservierungswidget geladen wird, festgelegt sein. Dies hilft dem Browser zu bestimmen, wie der Inhalt auf der Webseite angezeigt werden soll. Wenn die Webseite keinen festgelegten DocType hat, fgen Sie bitte einen DocType ber dem <html> Tag auf der Webseite hinzu (siehe Beispiel). Verweisen Sie

nicht 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 fr berlagernde Fenster. Sollten Sie Schwierigkeiten mit der Anzeige des berlagernden Fensters haben, empfehlen wir Ihnen, &hover=1 aus dem Code wieder herauszunehmen. Wenn Sie weitere Hilfe bentigen, knnen Sie uns gerne unter dieser Email Adresse kontaktieren: reservationlinks@opentable.com. .

Page 7 of 7, Rev. 20110523