Einführung
In diesem Teil erhalten Sie Informationen, wie Sie die edoobox Templates (siehe Design-Manager) direkt in Ihre Website integrieren können. Die Widgets aus dem Design Manager werden als HTML-Code verfügbar gemacht. Mit dem Rewrite PHP Beispiel und dem JavaScript Beispiel, möchten wir Ihnen die Möglichkeiten dieser Ressource aufzeigen.
De Template Ressource unterstützt kein edoobox Konto welches auf intern gestellt ist. Einzelne Kategorien jedoch können intern sein.
Allgemeine Information
Diese Ressource unterstützt die folgenden Operationen:
| Name | URL | GET | POST | PUT | DELETE | Status |
|---|---|---|---|---|---|---|
| Template | v1/templates | Ja | – | – | – |
Wenn Sie auf diese Ressource zugreifen möchten, verwenden Sie folgende URL:
https://api.edoobox.com/v1/templates
Definitionen
GET Parameter für Abfrage
Sämtliche Parameter, welche bei einer GET Anfrage enthalten sein können oder erforderlich sind:
| Parameter | Art | Beschreibung | Erforderlich |
|---|---|---|---|
| language | String | Sprache z.B. „de“ oder en, fr, es, cn, cs | |
| filter > path | Array | Der Pfad zur gewünschen Kategorie oder zum Angebot in edoobox
| – |
| data > url | Array | URL der Integrations-Seite, sämtliche Links erhalten diese URL.
Ausgeschlossen alle Links welche auf edoobox.com/book/.. verweisen. | – |
| GET | Array | Es können GET-Parameter an den Request übergeben werden z.B. um das Tag Filtering oder die Labels von edoobox verwenden zu können. |
GET Beispiel
Dazu ein Beispiel, wie diese Parameter im GET-Request übergeben werden. Dieses Beispiel enthält alle Parameter, somit müssen erst die unnötigen Parameter entfernt werden:
Einfaches PHP Integrations Beispiel
In diesem Beispiel wird die Möglichkeit aufgezeigt, wie Ihre URL um die edoobox URL zu Ihren Angeboten erweitert werden kann. Suchmaschinen können so jede Seite, die in edoobox existiert, auf Ihrer Seite indexieren.
Datei zum URL umschreiben
Legen Sie auf Ihrem Server einen neuen Ordner mit dem Namen „events“ an. In diesem Ordner erstellen Sie eine Datei mit dem Namen „.htaccess“ (evt. benötigen Sie hierzu zusätzliche Berechtigungen von Ihrem Server-Anbieter, bitte vorgängig abklären). Die .htaccess Datei schreibt die URL so um, dass alles was in der URL nach „events/“ steht, als GET Parameter der index.php Datei zur Verfügung gestellt wird.
Kopieren Sie diesen Inhalt in die .htaccess Datei:
PHP Datei für die Abfrage
Wie Sie sehen, haben wir uns in diesem Beispiel auf das Wesentliche konzentriert. Es wird ein HTML5 Dokument mit einem Standard Bootstrap Style erstellt. Den API Key und den Secret Key finden Sie in Ihren edoobox Einstellungen. Erstellen Sie nun eine neue Datei im Ordner „events“ und benennen diese „index.php“.
Kopieren Sie diesen Inhalt in die index.php Datei:
– Ersetzen Sie den jeweiligen Key bei den entsprechenden XXXXX.
– Ersetzen Sie das VALUE bei der „provider.url“ durch Ihre URL und fügen am Ende noch /events/ hinzu. https://www.ihredomain.com/events/
Laden Sie nun die index.php Datei auf Ihren Server.
Starten Ihrer Integration
Nun können Sie die Integration testen. Kopieren Sie Ihre URL https://www.ihredomain.com/events/ in einen Browser. Wichtig, die URL muss mindestens um Ihr Konto-Kürzel ergänzt werden, also: https://www.ihredomain.com/events/Kuerzel.
Möchten Sie ein/e bestimmte/s Kategorie/Angebot direkt ansprechen, können Sie die URL aus edoobox über die Funktion Vorschau – Share finden, oder Sie verwenden die Angebotsressource.
Einfaches JavaScript Integrations Beispiel
In diesem Beispiel wird die Möglichkeit aufgezeigt, wie die Templates mit JavaScript geladen werden können. Dazu erstellen wir eine neue HTML Datei.
Die edoobox JavaScript API kann direkt über unser Content Delivery Network CDN geladen werden:
https://cdn1.edoobox.com/edooboxAPI.v1.0.5.js
HTML Datei erstellen oder in einem CMS eine neue Seite
Kopieren Sie diesen Inhalt in die neue Seite. Wenn Sie den Inhalt in Ihrem CMS hinzufügen, beachten Sie, dass ein Bootstrap Style geladen werden muss. Passen Sie die Werte hinter API_KEY (= Public Key) und edoobox_URL (= Konto Kürzel) an:
Ein Bootstrap-Style gilt immer für die ganze Seite. Wenn Sie nicht schon Bootstrap für Ihre Website verwenden, empfehlen wir Ihnen ein Bootstrap-Style für ein bestimmtest Element zu erstellen. So wird Bootstrap nur für dieses Element angewendet und nicht gleich für die ganze Seite. Hier finden Sie eine Anleitung, wie ein Bootstrap-Style für ein Element isoliert werden kann: https://formden.com/blog/isolate-bootstrap
