Installation
- Schritt 1: Fordern Sie Ihre Ausgabe ID an
- Schritt 2: Integration des Clients in die Webseite
- Schritt 3: SEO und/oder Facebook Share Preview Support
- Schritt 4: Einbindung eines Content Elementes und/oder Widgets
- Schritt 5 (optional): Einbindung einer dynamischen Sitemap für bessere/schnellere SEO Ergebnisse
- Optional: Verwendung eigens definierter Referralcodes
Schritt 1: Fordern Sie Ihre Ausgabe ID an
Sofern Sie von uns nicht schon eine Ausgabe ID erhalten haben, wenden Sie sich an unseren Support unter Angabe Ihrer bestehenden oder geplanten Webseite (und bei Agenturen mit den nötigen Kundendetails). Wir senden Ihnen dann im Prozess des Einrichtung eine ID zu. Ohne diese ID können Sie nicht fortfahren.
Wir benötigen in diesem Schritt ebenso alle Domains unter denen der Frontend Client eingebunden werden soll. Bitte übermitteln Sie uns eine vollständige Liste (keine Wildcards), sofern sie uns noch nicht bekannt ist.
Schritt 2: Integration des Clients in die Webseite
Fügen Sie den Frontend Client in den HEAD
Bereich der Webseite ein. Ersetzen Sie dabei YOUR_ID
mit der ID die Sie von uns bekommen haben.
<script async type="text/javascript" src="https://www.optimale-praesentation.de/frontend/js/bin/boot?secratoid=YOUR_ID"></script>
Tipp: Verwenden die
<link rel="preconnect" href="https://www.optimale-praesentation.de">
imHEAD
der Webseite, um ein wenig (Lade-)Zeit zu gewinnen. Seien Sie jedoch sicher, den Bootstrapper dann auch unbedingt zu verwenden, ansonsten ist dies nur Verschwendung!
Schritt 3: SEO und/oder Facebook Share Preview Support
Dieser Abschnitt kann (und sollte sogar) übersprungen werden, wenn Ihnen Facebooks Share *Preview* und Bing egal sind und für Sie nur Google relevant ist. Google ist in der Lage das Frontend vollständig ohne Hilfsmittel zu crawlen.
Wenn Sie wollen, dass Ihre Einbindung u.a. von Bing indiziert und in den entsprechenden Suchen gefunden werden kann, dann müssen Sie den SEO Helfer auf Ihrer Seite einbinden. Wenn Sie diesen Schritt auslassen sind die vom Frontend Client geladenen Inhalte für Bing & Co. unsichtbar und können nicht gefunden werden.
Ebenso ist diese Erweiterung nötig, wenn Sie Inhalte auf Facebook mit Vorschaubildern teilen wollen (siehe etwa "Suche" -> Option "enableShare"). Auch ohne diesen Schritt ist natürlich immer ein Teilen einer beliebigen URL möglich, allerdings ohne vollständige Preview innerhalb von Facebook.
Laden Sie das nachfolgende Paket herunter:
SEO Helfer Dateien
Kopieren Sie dazu die Datei simpleproxy.php in das Stammverzeichnis Ihrer Webseite. Die von uns gelieferte .htaccess Datei können Sie entweder direkt verwenden oder in Ihre eigene integrieren. Für andere Webserver als Apache muss der Inhalt der .htaccess Datei sinngemäß übertragen werden.
Hier finden Sie den Inhalt der htaccess und Detailinformationen dazu.
Damit die Suchmaschinen wissen, dass sie die Inhalte indizieren sollen, muss zudem in den HEAD
der Seite ein Meta-Tag
aufgenommen werden. Stellen Sie sicher, dass dieses Element nur auf den Seiten gesetzt ist, die auch Inhalte des Frontend Clients
enthalten und die indiziert werden sollen (beispielsweise wäre dies für das Suchwidget auf der Startseite unnötig, für die Suche
und die Detailsseiten aber sehr wünschenswert). Falls Sie nur an Facebooks Share Previews interessiert sind, lassen Sie diesen Schritt aus,
er ist nur für Suchmaschinen relevant.
<meta name="fragment" content="!">
Schritt 4: Einbindung eines Content Elementes und/oder Widgets
Der letzte Schritt besteht nun darin das vorhandene Basis-Framework zur Einbindung eines Inhaltselements zu nutzen.
Grundsätzlich entspricht der Aufbau einer Einbindung dabei immer dem gleichen nebenstehenden Schema.
Details zu den Konfigurationsoptionen können Sie in der Dokumentation des jeweiligen Elements finden.
Tipp: Der Javascript Aufruf zum Laden des Inhaltes kann dabei natürlich auch außerhalb des Einbettungselements erfolgen.
Suchen Sie sich einfach das gewünschte Element aus unserem Bestand aus:
<div id="op_content_box">
<script type="text/javascript">
// diese Werte können/müssen angepasst werden:
var loadOptions = {
module: 'op-frontend-suche', // Name des zu ladenden Moduls
content_id: 'op_content_box', // ID des HTML Elements, in das der Inhalt geladen wird
options: {
hasOwnCookieInfo: false, // Beispieloption
// weitere Optionen des Moduls hier einfügen
}
};
// diesen Code nicht mehr ändern!
var secra_op_client;
if(secra_op_client && secra_op_client.loadModule){
secra_op_client.loadModule(
loadOptions['module'],
loadOptions['content_id'],
loadOptions['options']
);
} else {
if(!secra_op_client) { secra_op_client = {}; }
secra_op_client.loadQueue = [];
secra_op_client.loadQueue.push({
module: loadOptions['module'],
embed_id: loadOptions['content_id'],
options: loadOptions['options']
}
);
}
</script>
</div>
Schritt 5 (optional): Einbindung einer dynamischen Sitemap für bessere/schnellere SEO Ergebnisse
Weitere Details dazu gibt es hier im entsprechenden Sitemap Abschnitt.
Optional: Verwendung eigens definierter Referralcodes
Sie können bis zu 200 sogenannte Referralcodes definieren. Diese dürfen nur aus alphanumerischen Zeichen [a-zA-Z0-9] bestehen mit einer maximalen Länge von 200 Zeichen (aber mindestens 3 Zeichen).
Diese Referralcodes teilen Sie dann bitte unserem Support mit, damit diese dann zu ihrer Ausgabe hinzugefügt werden können.
Anschließend kann ein Referralcode am Einbindungslink angefügt werden. Dieser wird mit dem GET-Parameter refid
angegeben.
Beispiel-Einbindung mit zusätzlichem GET-Parameter refid
:
Ersetzen Sie dabei YOUR_REFERRAL_CODE
mit einem ihrer definierten Referralcodes.
<script async type="text/javascript" src="https://www.optimale-praesentation.de/frontend/js/bin/boot?secratoid=YOUR_ID&refid=YOUR_REFERRAL_CODE"></script>