Facebook Embed – Step by Step Anleitung zum Einbinden von Postings im Blog

Noch recht frisch ist die Funktion von Facebook Postings (Meldungen innerhalb von Facebook) in externe Anwendungen einbetten (embed) zu können. Das Verfahren und die Möglichkeit der Einbindung von externen Inhalten ist recht bekannt von YouTube oder Anwendungen wie SlideShare.

In dieser kurzen Step-by-Step Anleitung wollen wir das Einbetten von Facebook Postings in einen Blog (in diese Falle WordPress System) dokumentieren. Im eigentlichen ist das Verfahren relativ simpel. Wir gehen aber davon aus, dass mittles Plugins und weiteren Steuerungsmöglichkeiten Postings zukünftig noch individueller eingebettet werden können.

A Facebook Posting öffnen

Auf den ersten Blick ist nicht erkennbar, wo nun die „Embed-Funktion“ bei einem Facebook Posting zu finden ist. Wenn Sie mit der Maus über den Facebook Beitrag fahren erscheint rechts oben in der Box eine Pfeilspitze/Haken nach unten zeigend.

Facebook Embed Schritt für Schritt - Auswahl

Der kleine Haken/Pfeil rechts oben (1) erscheint nur – wenn mit dem Mauszeiger über den Beitrag gefahren wird

Per Klick auf den Haken/Pfeil öffnet sich das Auswahlmenü für weitere Funktionen rund um das Facebook Posting. Augenscheinlich erst einmal nicht vorhanden ist die „Embed Funktion“. Zu finden ist diese unter dem Punkt „Beitrag einfügen“ (2)

fb-embed-schritt-2
Über „Beitrag einfügen“ (2) gelangt man zur Funktion des Einbettens von Facebook Postings

Der Menüpunkt „Beitrag einfügen“ öffnet ein neues Fenster zentral im Browser. Hier ist der Einbettungscode und eine Vorschau über das Posting sichtbar. Der Code ist bereits ausgewählt und muss nur noch mittles „STRG+C“ oder Menü „Bearbeiten_Kopieren“ in die Zwischenablage des Rechners kopiert werden.

fb-embed-schritt-3
Bereits per Auswahl markiert – der Einbettungscode für das Facebook Posting

Es lohnt sich einmal auf den Link „Mehr dazu“ zu klicken. Dieser führt aktuell auf eine englischsprachige Hilfeseite.

B Einbetten in das Blog-Posting

Das Einbinden (Einbetten) in ein Blog Posting oder eine Webseite ist nun relativ einfach. Hierzu im Falle von WordPress den Beitrag öffnen und im Editor den Bearbeitungsmodus „Text“ auswählen. Der Editor wechselt nun vom Ansichtsmodus (WYSIWYG) in die HTML-Code Ansicht.

fb-embed-schritt-4
Auswahl des HTML-Code Modus im Editor von WordPress

Kopieren Sie nun den Code aus der Zwischenablage an die Stelle an der das Facebook Posting erscheinen soll. Aktualisieren Sie dann den Beitrag und schauen Sie sich das Ergebnis in der Artikelansicht an.

fb-embed-schritt-5

 Vorab ein XX an die Stelle schreiben – an die das Facebook Posting eingebunden soll – dort den Code platzieren

Der „XX“ Tipp
Die HTML Programmierung wirkt teilweise etwas unübersichtlich. Dies gerade für Anwender die in der HTML-Programierung nicht so erfahren sind. Platzieren Sie daher vor dem Wechsel in die Text-Ansicht einfach die Buchstaben XX an die Stelle für das Facebook Posting. Nun finden Sie die exakte Position für den Facebook-Einbettungs-Code mittels der Buchstaben XX. Diese können Sie einfach durch den Code ersetzen.

Möglichkeiten mit der Facebook Embed-Funktion

Die  neue Funktion eröffnet Betreibern von Facebook Seiten zahlreiche Möglichkeiten. Die rechtlichen Eingrenzungen lassen wir hier einmal Außen vor und werden diese als Links-Liste nachliefern. Sicherlich wird es für deutsche Verhältnisse auch mit dem Blick auf das LSR Problemhaftet sein gerade Meldungen von Medien in eigenen Postings zu veröffentlichen.

Wir haben uns einige Gedanken zu den Chancen und Möglichkeiten rund um die Embed-Funktion gemacht und listet diese hier einmal auf.

– Erhöhung der Reichweite eines Facebook Postings durch Veröffentlichen auf einem Blog/Webseite

– Erhöhung der Reichweite eines Facebook Postings durch weiteres Einbetten von Präsenzen (Blogs, Websites) Dritter

– Umlenken von Diskussionen vom Blog auf eine Facebook Präsenz

– Alternative Video-Embed Funktion zu YouTube

– Einfachere Form von Gewinnspiel-Verknüpfungen vom Blog/Webseite zur Facebook Präsenz (Facebook Guidelines Gewinnspiele beachten)

 

Fallen Ihnen noch weitere Möglichkeiten ein? Wir freuen uns über Ihren Kommentar – entweder hier im Blog oder über das Facebook Embed.

 

[randomtext category=“Klems-Autorenbox“]

 

 

Mobile First – die Mobil-Strategie von infobroker.de

Mobiler Commerce und mobile Kommunikation steht bei vielen Online-Unternehmen ganz oben auf der Agenda der zu verfolgenden Ziele. Alles spricht über SmartPhones und die Nutzung alltäglicher Dinge mittels Apps oder direkt online.

Google hatte mit der Informationskampagne „GoMo“ auf die Wichtigkeit einer mobilfähigen Webseite und auch die hohe Priorität einer mobilen Strategie hingewiesen. Ab diesem Zeitpunkt war mir persönlich klar, dass wir in diesem Segment noch deutlich nachlegen mussten. Die Sichtung von starken E-Commerce Anwendung auf dem eigenen iPhone zeigte. Hier war dringender Handlungsbedarf für unseren Dienst infobroker.de.

 

Eigene Erfahrungen seit 2011
Bereits seit Mai 2011 ist infobroker.de mit einer mobilfähigen Seite (Video Präsentation) versehen worden. Der damalige Einstieg war eine HTML-optimierte Seite die dem SmartPhone Abruf gerecht wurde. Hier stand klassische Information (über uns) und Kontaktaufnahme im Vordergund. Einige Monate später wurden erste Mehrwerte mittels SQL-Abfragen eingebunden. Hierzu gehörten Listungen zu Bilanzdaten Österreich und Insolvenzverfahren (Deutschland).

Knackpunkt Online-Bestellung
Mit der Umstellung der gesamten Webseite auf ein neues Content Management System auf WordPress Basis im November 2011 wurde die mobile Darstellung über eine professionelle Erweiterung ausgebaut. Die alte HTML-Seite wurde abgeschaltet. Probleme bereitete uns der eigentliche Bestellvorgang. Da das Bestell- und Servicesystem auf OsCommerce basierte, waren hier Erweiterungen und Anpassungen kaum möglich. Ursache war das über Jahre (seit 2004) von uns modifizierte ShopSystem von OsCommerce mit teilweise einsetzenden Kompatiblitätsproblemen zu PHP 5.

Als Zwischenlösung wurden für eine Bestellung Bezahlseiten als Auftragsformulare mit einer PayPal Anbindung aufgesetzt. Der Markt nahm diese Lösung kaum an. Hintergrund war hier der einzige Bestellvorgang mittels PayPal. Ein großer Teil der Bestandskunden nutzt die Arbeitsweise per Lastschrift oder VorausRechnung für unsere Recherchedienste.

Magento als Basis-Shop
Dies war der Zeitpunkt (April 2012) über einen Umstieg auf eine neue Shop-Plattform für unser Servicesystem nachzudenken. Das die Entwicklungen nur innerhalb von 2 Monaten eine solche Fahrt aufnehmen konnten wir vorab nicht erkennen. Als neue Plattform wurde Magento aufgesetzt. Der Server beim Hoster wurde erweitert und die Produkte und Leistungen in das neue System eingepflegt. Mit Magento und der Einbindung von angepassten Templates war der Schritt auf eine mobile Commerce Lösung nicht mehr weit. Diesen Schritt konnten wir Ende Juni abschliessen. In den USA wurde ein passendes Template ermittelt und an unsere Gegebenheiten angepasst. Pünktlich zum 01.07.2012 ging die mobile Lösung an den Start.

[fancy_box title=“Mobile Technik bei infobroker.de“]
Inhalte: WordPress Content Management System
Mobile Inhalte: WPTouch Pro
E-Commerce System: Magento
Mobil-Commerce System: Angepasstes Magento Template für SmartPhones
Das System erkennt automatisch „Mobile Webbrowser“ und Geräte und schaltet auf eine verbesserte Darstellung um.
[/fancy_box]

Sicherlich werden sich verschiedene Marktteilnehmer die uns kennen die Frage stellen, warum wir gerade im B-to-B Bereich auf eine mobile Strategie setzen. Vielen unserer Branche sind wir sicherlich auch recht bekannt, dass wir sehr motiviert neue Technik-Felder besetzen und auch dies kommunizieren. So haben wir frühzeitig auf Audio (infobroker.de Podcast) und auch Video Kommunikation (YouTube, Livestream) gesetzt.

[fancy_box title=“Strategische Ansätze der Mobil-Strategie von infobroker.de“]
Modethemen besetzen
Es gehört zu unserer Philosophie und Tradition neue Techniken kennen zu lernen und für infobroker.de auch einzusetzen. Uns ist bewusst hier teilweise auch Modethemen ohne Zukunftsaussicht zu besetzen (s. Second Life). Bei allen neuen Technologiefeldern hatten wir immer postive Mitnahme-Effekte. Im Falle der Mobil-Strategie gehen wir von einem starken Zukunftsthema aus.

App oder WebApp?
Bis auf einzelnen per Datenbank angebotene Dienste liegt der Schwerpunkt von infobroker.de auf dem E-Commerce. Eine App wäre von der Entwicklung für mindestens zwei Plattformen (iPhone+Android) sehr kostenintesiv gewesen. Zusätzlich wäre eine vorhandene App noch kein Erfolgsrant, da hier das Marketing hätte noch einsetzen müssen. Dies ein weiterer Aufwandspunkt.

Kundenbindung und Service
Mit der mobilen Möglichkeit der Bestellung Datenpflege sollen bereits bestehende Kunden gebunden und Bestellvorgänge noch weiter erleichtert werden. Aufgrund der Kundenstruktur in Form von Viel-Reisenden Kunden kommen wir dem Bedarf der Kunden damit zukunftsgerecht nach.

M-Commerce ist Stand der Technik
Die Nutzung von Internet-Diensten per SmartPhone ist mittlerweile Stand der Technik. Zahlreiche führende Portale und Shops bieten mobile Bestellapplikationen. Diesen Standard wollen wir frühzeitig bzw. rechtzeitig besetzen.

[/fancy_box]

Ausblick – ganz vorne mit dabei sein
In welche Richtung und vor allem wie schnell die zukünftige Entwicklung gehen wird bestimmen die Anwender und deren Nutzungsverhalten. Auch das bislang vorhande Zahlenmaterial steht hier noch am Anfang. Jedoch lassen sich Anteile von 10% SmartPhone Aufruf nicht ignorieren. Hier müssen wir reagieren.

[fancy_box title=“Abrufraten und Wachstum mobile Nutzung der infobroker.de Seiten“]
SmartPhone Anteile
03-2012 2%
04-2012 4%
05-2012 8%
06-2012 10%

Zum Bestellvolumen können wir ab September 2012 erste Zahlen nennen. Aktuell sind die genauen Bestellgrößen teilweise durch E-Mail Anfragen nicht gemessen worden.
[/fancy_box]

Wir wollen unseren Kunden mit der WebApp ganz wesentlich die Bestell- und Kommunikationsmöglichkeit mit unserem Service von unterwegs ermöglichen. Zukünftig sollen neben dem reinen M-Commerce auch Informationsinhalte mit Mehrwert eingebunden werden.

Unsere Erfahrungswerte und was Sie tun können
In einem ersten Schritt sollten Sie die eigene Webseite mit einem SmartPhone oder einem Tablet (iPad) ansteuern. Auf diese Weise haben Sie einen guten Blick wie Anwender den Auftritt mobil sehen. Dies ist sicherlich schon jede Menge Motivation etwas ändern zu wollen. Hilfreich ist die Initiative von Google „GoMo“. Hier sind zahlreiche Schritte für die mobile Strategie gut beschrieben (englisch).

Denken Sie dann darüber nach, ob sich die eigene Website auf mobil „optimieren“ lässt. Sprechen Sie hier mit dem Programmierer oder Hoster der Webpräsenz. Unter Umständen ist nun der Zeitpunkt gekommen über eine komplette Umstellung (Relauch) nachzudenken. Planen Sie dies mit dem Programmierer oder einem Experten.  Die Planungen sollten Sie mittelfristig ansetzen.

Sie glauben nicht daran, dass Anwender Ihre Webpräsenz mit dem SmartPhone ansteuern? Da haben Sie Recht, denn eine nicht optimierte Seite wird sehr schnell wieder per Fingerwisch vom Display des SmartPhones verschwinden. Wenn Sie unsicher sind, dann messen Sie! Nutzen Sie Dienste wie Google Analytics für eine Auswertung der Gerätetypen die auf die Webseite zugreifen. Auf diese Weise liegt erstes Zahlenmaterial vor.

Sprechen Sie mit Kontakten und Kunden. Setzen diese bereits das SmartPhone beruflich für Online-Arbeiten an? Schaffen Sie sich hier Gewissheit, wann und wie Sie auf mobiler Basis aktiv werden.

Zum guten Schluss: Mit der Umstellung oder Anpassung der Seite beginnt die eigentliche Arbeit. Kommunizieren Sie die neue Präsenz und Möglichkeiten. Was für die Webpräsenz gilt, sollte für eine mobile Strategie ebenfalls gelten. Andernfalls ist das gesamente Engagement halbherzig und der Erfolg wird ausbleiben.

Sie sehen gerade einen Platzhalterinhalt von Youtube. Um auf den eigentlichen Inhalt zuzugreifen, klicken Sie auf die Schaltfläche unten. Bitte beachten Sie, dass dabei Daten an Drittanbieter weitergegeben werden.

Mehr Informationen

Nachtrag vom 04.07.2012 – Google Tool und Zahlenwerke

Google bietet über das Tool „Our Mobile Planet“ die Möglichkeit das Mobil-Segment genauer unter die Lupe nehmen zu können. Interaktiv können Grafikenzu verschiedensten Aspekten und geographischen Räumen rund um die Mobil-Welt erstellt werden.

Zur Grafik: Erstellt über das Google Tool „Our Mobile Planet“ – Auswertung der Kernauftragsländer für die infobroker.de Nutzung in Europa


Wir teilen unsere Erfahrungen gerne
Wir freuen uns auf einen aktiven Dialog und Meinungen zu unserem mobilen Angebot. Auch wir müssen hier Erfahrungen sammeln und sind flexibel in der Ausrichtung. Für Hinweise und Impulse danken wir jetzt schon. Was gefällt Ihnen am mobilen Auftritt von infobroker.de? – Rufen Sie die Seite mit Ihrem SmartPhone per mobil.infobroker.de oder direkt das Bestellsystem per SmartPhone über http://www.infobroker.de/servicesystem auf.

Weiterführende Links zum Thema

Mobile Startseite von infobroker.de (per SmartPhone aufrufen!)  mobil.infobroker.de

Funktionen der Mobil-Seite von infobroker.de – erste Übersicht

GfK Online-Survey Mobile-Commerce

[randomtext category=“Klems-Autorenbox“]

infobroker.de Blog Relaunch im Zeitplan

schedule-tafel-artikelAktuell wird der infobroker.de Blog auf ein neues Layout umgestellt. Schon vor dem offiziellen Relaunch am 01.06.2009 geht das System bereits in einer Beta-Phase in das neue Layout über.

Aus technischen Gründen und um den Zeitplan einhalten zu können wird das laufende System live angepasst. Über Twitter und den Blog halten wir Sie über die Umstellungsphasen auf dem Laufenden.

Die Inhalte des Blogs sind von der Umstellung kaum betroffen. Lediglich die Optik und einzelne Navigationselemente werden bei der Anpassung auf das neue WordPress Theme „Corporate“ Veränderungen erfahren.

Wir halten Sie an dieser Stelle über die Kommentare und per Twitter auf dem Laufenden. Danke für das Verständnis innerhalb der Umstellungsphase am Freitag und dem Wochenende.

Blog Update auf WordPress 2.6.3

Für gut 5 Minuten war der Blog heute am Samstag 01.11.2008 gegen 18.30 Uhr down. Ursache waren die Upgrade-Arbeiten auf die neueste WordPress-Version. Hier wurde von der Version 2.5 auf die Version 2.6.3 ein Aktualisierung durchgeführt. Aufgrund von aktuellen Hinweisen zu Sicherheitslücken innerhalb der alten Version haben wir uns kurzfristig für die Aktualisierung entschlossen.

Weiterführende Links: 
Aktuelle Version zum Download
WordPress-Deutschland

Fehler im WordPress korrigiert

Nach der Installation von der WordPress Version 2.2 auf die Version 2.3 erschien diese Fehlermeldung:

Warning: array_key_exists() [function.array-key-exists]: The first argument should be either a string or an integer in xxxx/wp-includes/category-template.php on line 176

Der Fehler lässt sich wie folgt beheben. Es fehlen zwei „Hochkommas“, die wir fett in der Korrektur gekennzeichnet haben. Diese werden in der Datei category-template.php (liegt unter wp-includes) in Zeile 176 gesetzt.

 if(array_key_exists(’$category’, $categories))

Dann ging es bei uns wieder:Â