blau direkt WordPress Plugin zum Vergleichsrechner einbinden

Um die Einbindung der Vergleichsrechner in WordPress-Blogs zu vereinfachen, haben wir ein entsprechendes blau direkt WordPress-Plugin programmiert. Nach der Installation und Aktivierung des Plugins in Ihrem WordPress-Blog, finden Sie im Administrationsbereich unter „Einstellungen“ den Schritt „blau direkt“. Hier können Sie Ihre Vermittler-Nummer sowie weitere Einstellungen eintragen und eine Liste der möglichen Platzhalter einsehen. Wenn Sie einen solchen Platzhalter, zB [RECHNER:NAME-DES-RECHNERS], in einem Artikel einsetzen, wird dieser Platzhalter automatisch durch den entsprechenden Vergleichsrechner ersetzt. Zusätzlich kann das Plugin schon Catcher für einige Vergleichsrechner erstellen.

Was ist WordPress?

WordPress ist eine kostenlose Blog-Software, welche i.d.R. selbst gehosted, administriert und gepflegt werden muss. Ein Blog ist aber keinesfalls mit einer Website gleichzustellen. Vielmehr sollte ein Blog zusätzlich zur eigenen Website eingesetzt werden. Weitere Informationen finden Sie auf der deutschen Website von WordPress. Sollten Sie nur wenige oder gar keine Erfahrungen im Bereich Blogging haben, ist dieses Plugin nicht das richtige für Sie. Als „Profi-Blogger“ aber kann es Ihnen das Leben angenehmer machen.

Installation

  1. Laden Sie sich die Datei blau-direkt.zip herunter.
  2. Loggen Sie sich im Administrationsbereich Ihres WordPress-Blogs ein.
  3. Öffnen Sie die Seite „Plugins“ -> „Installieren“.
  4. Wählen Sie oben links „hochladen“, wählen Sie die Datei blau-direkt.zip auf Ihrer Festplatte aus und folgen Sie den Anweisungen der Software.

Konfiguration

Nach der erfolgreichen Installation und Aktivierung des Plugins finden Sie unter „Einstellungen“ die Seite „blau direkt“. Tragen Sie bei „Vermittler-Nummer“ bitte als erstes Ihre blau direkt Vermittler-Nummer ein. Alle weiteren Einstellungen sind entweder bereits vorausgefüllt oder optional.

Vergleichsrechner in Blog einfügen

In den Einstellungen finden Sie eine Liste der möglichen Platzhalter. Um beispielsweise den Vergleichsrechner für Glasbruchversicherungen in einem Blog-Artikel einzufügen, suchen Sie sich den jeweiligen Platzhalter heraus und kopieren Sie diesen 1zu1 in Ihren Artikel.

Achtung: Sobald Sie das Plugin deaktivieren oder löschen, werden die Platzhalter natürlich nicht mehr ersetzt.

Zur Verbesserung der Optik empfehle ich Ihnen sich an die in unserem Blog-Artikel „4 Arten der Vergleichsrechner-Einbindung“ unter dem Punkt „Die Einbindung per iFrame“ genannten Tips zu halten.

Catcher in Blog einfügen

Ebenso wie Sie die Vergleichsrechner von blau direkt über praktische Platzhalter in Ihren WordPress-Blog einfügen können, können Sie dies auch mit sog. „Catchern“ tun. Eine kleine Einleitung zu dem Thema „Catcher“ finden Sie in unserem Blog-Artikel über die 5 Elemente einer erfolgreichen Makler-Website.

Bitte haben Sie Verständnis dafür, dass wir die Catcher aktuell noch nicht für alle unsere Vergleichsrechner fertiggestellt haben. Wir werden die Liste aber nach und nach erweitern, weshalb Sie den Changelog des Plugins im Auge behalten sollten. Außerdem sollten Sie das Plugin regelmäßig händisch updaten.

Der Platzhalter für einen Catcher ist etwas länger als der für einen Vergleichsrechner, da Sie dem Plugin noch sagen müssen, wo genau der dazugehörige Vergleichsrechner platziert ist.

Beispiel

Sie platzieren den Catcher auf der Startseite. Der Vergleichsrechner ist aber unter der Adresse https://pfad.zum/rechner-fuer-hundehaftpflicht.html erreichbar. In diesem Fall sieht der Platzhalter für den Catcher, welchen Sie auf der Startseite einfügen müssen, wie folgt aus:

[ CATCHER:HUNDE:https://pfad.zum/rechner-fuer-hundehaftpflicht.html]

(natürlich ohne das Leerzeichen zwischen der eckigen Klammer und dem Wort „CATCHER“. Aber würde ich das jetzt weglassen, würde es ja durch einen Catcher ersetzt werden.)

Gestaltung des Catcher

Der Catcher selbst enthält nur sehr wenig HTML-Quelltext. Die Optik dieses Quelltextes wird durch entsprechende CSS-Definitionen festgelegt, welche Sie bequem im Administrations-Bereich Ihres Blogs ändern können. Es empfiehlt sich beispielsweise, die Formular-Felder (inkl. Senden-Button) dem Aussehen der anderen Formular-Elemente auf Ihrer Website anzupassen.

Beispiel: Catcher – optisch unverändert

Beispiel: Catcher – optisch an den Blog angepasst

Zusätzlich können Sie beim Verfassen des Artikels Einfluss auf die Optik des Catchers nehmen, indem Sie diesen beispielsweise in einen bestimmten HTML-Kontext setzen oder ein Bild darüber platzieren. Oder Sie lassen die Optik einfach unverändert 🙂

Changelog

07.11.2011 - V 1.1 - 44 Vergleichsrechner (DE), 14 Catcher (DE)
                     Alphabetische Sortierung der Rechner
                     Änderung der Plugin-URI
                     Performance-Optimierung in replaceRechner()
                     Option "automatische Breiten-Anpassung" implementiert
19.10.2011 - V 1.0 - 32 Vergleichsrechner (DE), 14 Catcher (DE)

Download

16 Kommentare

Avatar von Males
Males am 20.10.2011 um 18:28 Uhr

Hallo Hannes,
sehr schöner erster Versuch. Die Catcher müssen aber durch Programmierarbeit aufgewertet werden. Ansonsten funktioniert es aber schon.
Es sollte aber noch geregelt werden, das die Breite und Höhe des Rechner an den Content Bereich richtig anpasst!
Gruß
Ricki

Avatar von Bürgschaftsversicherung
Bürgschaftsversicherung am 20.10.2011 um 21:23 Uhr

Lieber Hannes,
mal wieder eine sehr schöne Idee. Man spürt wie Ihr Euch richtig mit Herzblut daran macht, das System immer wieder ein Stückchen weiter zu verbessern. *daumenhoch*
Habt Ihr auch noch vor die AJAX Einbindung der Rechner über das Plugin zu machen? Derzeit müsste ich das sehr umständlich über Widgets und eigene HTLM-Texte machen. Würde mir sehr viel Arbeit abnehmen im Blog.
Beste Grüße!
Ulf

Avatar von Hannes Heilenkötter
Hannes Heilenkötter am 21.10.2011 um 15:45 Uhr

Hallo Ricki,

die Catcher sind mit Absicht sehr simpel gehalten, damit man von Außen die Chance hat so viel wie möglich zu beeinflussen. Also zum Beispiel ein Bild und eine Überschrift darüber einzubinden. Das geht ja mit WordPress ganz fix. Die eigentliche Optik lässt sich mit CSS-Definitionen im Admin-Bereich beeinflussen. Ich geb aber zu: Etwas HTML und CSS muss man dafür natürlich können.

Die Breite des iFrames beträgt immer 100%. Das bedeutet, dass der iFrame immer so breit ist wie der Content. Im Normalfall will man das auch immer so haben. Wenn man ihn wirklich mal kleiner als den Content haben will, kann man ja einfach einen div-Container drum legen und dem eine feste Breite geben.

Dynamische Höhe ist nicht ganz so einfach, da man quasi 2 verschiedene Websites dazu bringen müsste miteinander zu kommunizieren um die Höhen auszutauschen und anzugleichen. Wir arbeiten da schon an einer Lösung – bis diese fertig ist lässt das sich selbe Ziel auch mit unserem AJAX-Tunnel erreichen.

Hallo Ulf,

die Integration per AJAX-Tunnel ist etwas komplizierter weil da noch viel mehr Faktoren reinspielen, prinzipiell aber geplant. Wann kann ich dir leider nicht sagen.

Gruss Hannes

Avatar von Ute Goebels / B.G.-p. oHG
Ute Goebels / B.G.-p. oHG am 05.11.2011 um 11:55 Uhr

Lieber Herr Heilenkötter,

danke für die Erleichterung mit dem WordPress-Plugin. Eine Frage hätte ich noch zur Optik. Ich habe auf die schnelle ein Bericht zur PHV geschrieben und den PHV-Rechner eingebunden. siehe http://www.bav-werkstatt.de/vorsorge

Die Einbindung vom Rechner war super einfach, aber die Optik sprich länge und breite passen nicht so in den Text. Hab ich hier eine möglichkeit das zu ändern und WIE?
Grüße

Ute Goebels

Avatar von Hannes Heilenkötter
Hannes Heilenkötter am 07.11.2011 um 13:44 Uhr

Hallo Frau Goebels,

die Höhe des iFrames können Sie im Administrations-Bereich des Plugins im Backend Ihres Blogs einstellen. Die Breite des Vergleichsrechners können Sie für die iFrame-Einbindung optimieren in dem Sie:

a) Die aktuellste Version des Plugins herunterladen und im Backend die Option der „autom. Breiten-Anpassung“ aktivierten oder
b) den im Artikel „4 Arten der Vergleichsrechner-Einbindung“ unter „Die Einbindung per iFrame“ genannten Empfehlungen folgen. Anbei der Direkt-Link zum Artikel:
http://blog.blaudirekt.de/2011/02/4-arten-der-vergleichsrechner-einbindung/

Ansonsten habe ich nun auch die Ajax-Tunnel Einbindung ins Plugin implementiert. Vielleicht ist dies eine Alternative für Sie. Weitere Informationen zum AJAX-Tunnel finden Sie ebenfalls in unserem Blog-Artikel „4 Arten der Vergleichsrechner-Einbindung“.

Mit freundlichen Grüßen,

Hannes Heilenkötter

Avatar von Krankenversicherung Geschäftsführer
Krankenversicherung Geschäftsführer am 11.11.2011 um 19:47 Uhr

Tolle Sache, werde ich gleich mal in meinen WordPress-Blog integrieren!
Vielen Dank für Eure tolle Unterstützung!

Avatar von Jenny
Jenny am 10.04.2012 um 15:17 Uhr

Sowas habe ich gesucht. Danke für die Info! : )

Avatar von Joachim Biehl
Joachim Biehl am 17.10.2012 um 11:16 Uhr

Hallo, ich möchte das PlugIn auf unserer Seite verwenden und frage mich, ob es möglich ist 2 Rechner mit verschiedenen Vermittlernummern einzubinden? Wäre es möglich, das in das plugIn zu implementieren? Mit freundlichen Grüßen
Joachim

Avatar von Hannes Heilenkötter
Hannes Heilenkötter am 17.10.2012 um 13:41 Uhr

Hallo Herr Biehl,

die Verwendung mehrerer Vermittlernummern auf einer Website wird durch unser WordPress-Plugin nicht unterstützt. Eine Entwicklung in diese Richtung ist auch nicht geplant, da dies eine äußerst selten gewünschte Anforderung ist.

Avatar von JB
JB am 20.11.2012 um 16:05 Uhr

Hallo, wie finde ich denn die Links zu den verschiedenen Vergleichsrechnern?

Avatar von Hannes Heilenkötter
Hannes Heilenkötter am 20.11.2012 um 16:08 Uhr

Hallo,

die Links zu unseren Vergleichsrechnern finden Sie in unserem Maklerportal (geschlossener Bereich) unter „Technik“ -> „Link-Liste“.

Avatar von Bernhard
Bernhard am 28.12.2012 um 15:56 Uhr

Hey,

ein interessantes Plugin… das werde ich direkt mal auf meiner Seite ausprobieren. MAl sehen, ob es das ist, was ich mir wünsche, vielversprechend klingt es ja schonmal…

Avatar von René Schmidtke
René Schmidtke am 17.03.2016 um 9:37 Uhr

Hallo,
wie kann ich in dieses Plugin auch einen Catcher zum Kundenlogin erzeugen?

Avatar von Marvin Kowalski
Marvin Kowalski am 17.03.2016 um 11:32 Uhr

Hallo René,

einen Catcher können wir dir aufgrund der dahinterstehenden Sicherheitsarchitektur nicht anbieten.

Der Grund hierfür ist: Hier werden sensible Kundendaten übertragen. Bei dieser Form der Übertragung kann die Sicherheit des Transports der Kundendaten nicht wirklich sichergestellt werden.

Aber selbstverständlich kannst du dir deinen eigenen Catcher auf deine Webseite platzieren und diesen z.B zu dem Kunden-Login Formular weiterleiten lassen. Du solltest dabei nur keine Logindaten übergeben 😉

Avatar von Sparen
Sparen am 17.03.2017 um 12:17 Uhr

Hallo Herr Heilenkötter,

für 2015 wurde von Herrn Kowalski ein Release des WordPress-Plugins für die neuen Vergleichsrechner 4.0 JS-API angekündigt, siehe http://blog.blaudirekt.de/2014/10/vergleichsrechner-4-0-js-api/

Können mit dem WordPress-Plugin die neuen Vergleichsrechner mittlerweile (2017) genutzt werden?

Beste Grüße,

Sparen

Avatar von Hannes Heilenkötter
Hannes Heilenkötter am 17.03.2017 um 12:25 Uhr

Hallo „Sparen“,

bitte wenden Sie sich mit Ihrem Anliegen an Herrn Kowalski.

Kommentar verfassen