OnBuSys - Widgets PDF Drucken E-Mail

Damit Sie OnBuSys in einfacher Weise in Ihre Homepage, auf der Sie Ihre Objekte anbieten, integrieren können, werden Ihnen im Folgenden einige sogenannte Widgets zur Verfügung gestellt. Dies sind Javascript Codefragmente, die Sie lediglich an geeigneter Stelle in den Seitenquelltext Ihrer Homepage kopieren müssen. Dabei ist zusätzlich nur erforderlich, dass Sie bei einigen wenigen Variablen die Werte an Ihre speziellen Gegebenheiten anpassen müssen, was ausführlich an den entsprechenden Stellen kommentiert ist.

So müssen Sie den Pfad_zum_Ordner_OBS in einer bestimmten Form eingeben.
Die entsprechende Kommentarzeile im Widget sieht folgendermaßen aus:
//Geben Sie für die Variable "obspfad" (Pfad_zum_Ordner_OBS) den entsprechenden Wert OHNE 'http://www.' ein
Lautet der Pfad zu Ihrem Ordner 'OBS' z.B.
          http://www.fewo-am-see.de/Buchungen/OBS/
dann müssen Sie als Wert für die Variable obspfad eingeben:
          obspfad='fewo-am-see.de/Buchungen';
Änderungen am eigentlichen Programmtext sind nicht erforderlich.

Nachfolgend erhalten Sie einige Varianten, die in der Praxis oft verwendet werden. Über die Links können Sie sich jeweils bei einer Demoseite diese Variante ansehen. Dabei handelt es sich jeweils um eine bewusst einfach gehaltene Seite, auf der lediglich die Funktionalität der Variante dargestellt werden soll.
Jeweils am Ende der Demoseiten befinden sich die Codesequenzen mit Erläuterungen, wie diese in Ihre Seite einzufügen sind. Weiter können Sie mithilfe des Seitenquelltexts erkennen, wo die Codesequenzen eingefügt werden müssen.
Die vollständigen Dateien stehen im Ordner /OBS/widgets/ zu Ihrer Verfügung.
 



Bei den ersten drei Varianten können Sie zum Testen die Codesequenzen in beliebige eigene html-Seiten einfügen. OnBuSys muss dafür nicht auf Ihrem Server installiert sein, hier werden die Objekte der Demoseite von OnBuSys verwendet.

Variante 1: Buchungskalender beim Objekt 


Auf der Demoseite sind zwei Buchungskalender integriert:
- ein 1x1 - Belegungskalender mit Buchungslink am linken Rand
- ein 3x2 - Belegungskalender ohne Buchungslinks am rechten Rand



Im Gegensatz zu den vorangehenden Varianten, bei denen der Buchungskalender in einem separaten Fenster geöffnet wird, wird bei den folgenden vier Varianten der Buchungskalender in der gleichen Seite geöffnet und behält beim Scrollen seine Position bzgl. des Bildschirms bei. Mithilfe einer Variablen in dem Skript für den Buchungskalender kann man einstellen, ob die Seite grau und inaktiv wird während der Buchungskalender geöffnet ist. In der Voreinstellung (wie hier bei den Demos) ist die Seite grau und inaktiv.
Bei diesen Varianten müssen zwei Javascript Codefragmente verwendet werden:
  • Das erste Skript erzeugt jeweils den Buchungskalender und sollte in den Headbereich der Seite kopiert werden,
  • das zweite erzeugt die jeweilige Belegungsübersicht, das an die Stelle kopiert werden muss, an der die Belegungsübersicht auf der Seite erscheinen soll.

Auf der Demoseite sind zwei Belegungskalender integriert:
- ein 1x1 - Belegungskalender am linken Rand
- ein 3x2 - Belegungskalender am rechten Rand


Hier sind alle Objekte in einer Tabelle sichtbar.


Hier können Sie festlegen, wie viele Objekte in der Tabelle sichtbar sein sollen, die weiteren erreichen Sie via Scrollbar.


Bei der Integration der Belegungsübersicht in eine CMS- oder Do-It-Yourself Homepage kann das Problem auftreten, dass der Belegungskalender wegen seiner Breite nicht in das fest vorgegebenen Spalten-Layout der Seite passt.

In der Beispielseite wird eine Möglichkeit aufgezeigt, wie man trotzdem die Belegungsübersicht in solche Homepages einfügen kann. Unten sehen Sie die beispielhafte Einfügung der Belegungsübersicht bei dem Zwei-Spalten-Layout dieses Joomla-CMS.











 

Aktualisiert ( Sontag, 26. Februar 2012 19:23 )