Schlagwort-Archiv: fbml

fbml icon

Endgültiges Ende für Static-FBML-Tabs am 5.Dezember 2012

Erinnern Sie sich noch an Static FBML, die alte Methode zum Erstellen von eigenen Facebook-Seiten-Tabs? Neue erstellen kann man damit ja schon länger nicht mehr, aber alte Tabs wurden bislang noch angezeigt. Das wird sich am 5.Dezember 2012 ändern, denn dann werden alle solchen Tabs von Facebook gelöscht.

Falls Sie also noch alte Tabs dieser Art auf Ihrer Facebook-Seite benutzen, sollten Sie rechtzeitig auf neue iframe-Tabs umstellen.

Wie das geht, habe ich hier im Blog bereits erklärt. (Das Tutorial können Sie sich unter http://spr.li/iframe kostenlos herunterladen oder via Scribd einsehen.) Wichtig: Für diese Umsetzung sind Webdesign-Kenntnisse, eigener Webspace und ein Developer-Account in Facebook nötig.

Falls Sie diese Voraussetzungen nicht erfüllen, können Sie zum Beispiel auf folgende vorhandenen Apps zurückgreifen:

 

Ich freue mich, wenn Sie diesen Beitrag weitersagen via        

Kommende Änderungen für Facebook-Seiten

Lange, lange kündigen meine Kollegen und ich es schon an, jetzt gibt es – laut Facebook – endlich ein konkretes Datum für die Umsetzung:

In der Woche vom 23. August 2010 werden

  • Felder (Boxes) abgeschafft (und zwar in Profilen und Seiten!). Die Nutzer sollen sowohl in den Feldern als auch im Hilfe-Bereich darauf hingewiesen werden.
  • Anwendungs-Reiter (z. B. individuelle Reiter mit Static FBML oder Reiter für selbst geschriebene Anwendungen) auf 520px Breite verkürzt! Seiten-Admins sollen eine Vorschau davon erhalten, so dass sie ihre individuellen reiter rechtzeitig anpassen können. So oder so werden alle individuellen Reiter (auch die in Profilen) in der Woche vom 23.August 2010 automatisch größenangepasst.

Und so sieht das dann aus (anklicken, um den tatsächlichen Reiter zu sehen):

Dazu Facebook:

“These updates are designed to simplify navigation for users, reduce complexity for developers, and enable us to build the next generation of tools for growing your business with Facebook. We’ll share more of our plans for the roadmap in the coming weeks.”

Wir dürfen gespannt sein, wie dieser Übergang weiter kommuniziert und gemanagt wird. Am besten schieben Sie es nicht auf die lange Bank und richten Ihre Facebook-Präsenz gleich auf die kommenden Änderungen ein (wenn Sie es nicht ohnehin längst getan haben).

Ich freue mich, wenn Sie diesen Beitrag weitersagen via        

Was sollte Facebook an den Offiziellen Seiten verbessern?

Logo: Facebook Pages

Für Juli sind ja einige Änderungen in Sachen Offizielle Facebook-Seiten angekündigt. So sollen Felder (Felder-Reiter und auch auf die Pinnwandansicht verschobene Felder) abgeschafft werden und die maximale Breite des Inhalts von individuellen Reitern auf 520px eingeschränkt werden.

Seitenbetreiber sollen rechtzeitig vorher über anstehende Veränderungen informiert werden.

Weitere Verbesserungen wären wünschenswert. Etwa eine leichtere Verwaltung der Fans (derzeit ist dies mit Einschränkungen nur über Umwege machbar) oder das Abschaffen des Info-Reiters (der keine individuelle Darstellung erlaubt und bei Hinzufügen eines Static FBML-Reiters ohnehin überflüssig wird).

Welche Verbesserungen würden Sie sich für Offizielle Seiten wünschen?

Übrigens hat Facebook gerade auf den Quick Start Guide für Seiten bzw. das ausführlichere Pages Manual hingewiesen, die beide den Einstieg ins Seiten Erstellen und Verwalten erleichtern sollen. Mehr Infos zum Thema Seiten.(Derzeit alles leider nur in englischer Sprache verfügbar.)

Weitere Blogposts zum Thema Seiten in diesem Blog:

Ich freue mich, wenn Sie diesen Beitrag weitersagen via        

Facebook-Fanseiten: Inhalte auf FBML-Reitern nur für Fans sichtbar machen

FBML ist hinfällig. Individuelle Inhalte müssen jetzt mit eigener Anwendung via iframe oder mit Hilfe von Drittanwendungen eingebunden werden.

Dank des Hinweises eines meiner Blogleser wurde ich heute auf die Möglichkeit aufmerksam gemacht, bestimmte Inhalte in FBML-Reitern nur für Fans sichtbar zu machen. Alles, was man zu tun braucht, ist den betreffenden Bereich mit folgendem Tag zu versehen:

<fb:visible-to-connection>INHALT NUR FÜR FANS</fb:visible-to-connection>

 

Die so definierten Inhalte werden erst dann sichtbar, wenn jemand Fan der betreffenden Seite ist. Nichtfans kann man im öffentlichen Text auf die Tatsache hinweisen, dass weitere Inhalte nur für Fans sichtbar werden und Sie zum Fanwerden auffordern.

Weitere interessante Tags finden sich im FBML Developer Wiki.

Diesen Tipp finden Sie ab sofort auch im kostenlosen Tutorial für FBML-Reiter (pdf, 920kb) von Alexandra Steiner und mir.

Ich freue mich, wenn Sie diesen Beitrag weitersagen via        

Facebook-Fanseiten: Menü in FBML-Reiter einbauen

UPDATE März 2011: FBML-Reiter sind hinfällig. Das Einbinden individueller Inhalte, sollte jetzt über iframe-Tabs gelöst werden. Siehe http://dewww.schwindt-pr.com/2011/03/04/facebook-iframetabs/

Nachdem hier schon gezeigt wurde, wie man einen FBML-Reiter auf Facebook-Fanseiten anlegt und wie man eine eigene CSS dafür einbindet, möchte ich nun am Beispiel meiner Fanseite darauf eingehen, wie man den Inhalt eines solchen FBML-Reiters durch ein weiterführendes Menü ergänzen kann:

Einer der FBML-Reiter auf der Fanseite von schwindt-pr

 

Dieser FBML-Reiter besteht aus folgenden Elementen:

  • Kopfgrafik (blauer Kasten)
  • Tabelle mit einer Zeile und fünf Spalten für das Menü
  • rechts floatende div für den grauen Kasten
  • eine div für den restlichen Inhalt

Hier soll nur die Tabellenkonstruktion für das Menü erklärt werden. Der Quelltext hierfür lautet:

<table class=”menutable“>
<tr>
<td
class=”menufront“>Home</td>
<td class=”menucell
><a href=”http://www.schwindt-pr.com/facebook_beratung.html”>Facebook-Beratung</a></td>
<td
class=”menucell><a href=”http://delicious.com/annetteschwindt/facebook+sprblog“>Blogposts über Facebook</a></td>
<td
class=”menucell><a href=”http://www.fbbuch.de/”>Buchblog</a></td>
<td
class=”menucell><a href=”http://www.facebook-buch.de/kontakt/”>Kontakt</a></td>
</tr>
</table>

Da Facebook die maximale Breite der Fanseiten-Reiter auf 520px begrenzen wird, habe ich in der CSS zu diesem Reiter die Weite der Tabelle über die Klasse menutable genauso definiert. Dadurch passt sich die Weite der Zellen je nach Anzahl und Inhalt der Zellen immer auf diese Weite an.

Um den “aktiven” Menüpunkt optisch abzuheben, habe ich für diesen eine eigene Klasse menufront angelegt, die mit weißem Hintergrund und einem grauen Rand definiert wurde (analog zum Design von schwindt-pr.com). Die restlichen Menüpunkte wurden überdie Klasse menucell als grau hinterlegt definiert.

Wie Sie am Quelltext oben sehen, brauchen Sie die einzelnen Menüpunkte dann nur noch mit der gewünschten Webpage zuverlinken. In meinem Fall führen sie zu verschiedenen Unterseiten meiner Agenturwebsite bzw. zum Seite über mein Facebook-Buch bei O’Reilly.

Aber Sie können natürlich auch auf Reiter innerhalb der Fanseite verweisen. So habe ich es auf meinem anderen FBML-Reiter gemacht: Der Menüpunkt “Facebook-Buch” verweist hier auf oben gezeigten Reiter.

Haben Sie Fragen dazu oder möchten Sie, dass ich einen solchen Reiter für Ihre Fanseite umsetze? Dann hinterlassen sie mir doch einen Kommentar oder schicken Sie mir eine Mail an fragen@facebook-beratung.de

Static FBML-Tutorial für individuelle Fanseiten-Reiter (pdf, 910kb)

Ich freue mich, wenn Sie diesen Beitrag weitersagen via        

Facebook-Fanseiten: Einbinden von CSS in FBML-Reiter

UPDATE März 2011: FBML-Reiter sind hinfällig. Das Einbinden individueller Inhalte, sollte jetzt über iframe-Tabs gelöst werden. Siehe http://dewww.schwindt-pr.com/2011/03/04/facebook-iframetabs/

*

Die selbständige Webdesignerin Alexandra Steiner aus Wien ist einer der Netzwerkpartner von schwindt-pr. Kürzlich zeigte mir Alexandra folgenden Weg zur Einbindung eines eigenen CSS in einen FBML-Reiter auf Facebook. Ich bat sie daraufhin, diesen in einem Gastbeitrag kurz zu erläutern:

Nichts ist schlimmer, als ein unüberschaubarer Quelltext. Gerne hätte ich eine einfachere Variante genutzt, doch leider lassen sich in FBML-Reitern  weder iframes noch externe Stylesheets  über JavaScript einbinden. Die im folgenden erläuterte Vorgehenseweise scheint also die einzige Möglichkeit zu sein, statische Seiten mittels CSS und HTML darzustellen.

Mit dieser Möglichkeit bleibt der CSS-Teil schlank und unübersichtliche CSS-Deklaration für jedes einzelne Element sind nicht nötig. Somit bleibt der Quelltext übersichtlich und aufgeräumt.

Um den Quelltext innerhalb des FBML-divs zu entschlacken sollte man Folgendes tun:

<style>
<!–
Element {Eigenschaft:Wert; …}
–>

</style>

Danach folgt der übliche HTML-Part.
Innerhalb von <style> … </style> kann man nun problemlos Klassen, ids und Elemente deklarieren. Im HTML-Part werden wie gehabt die Klassen oder ids aufgerufen.
Hier ein kleines Beispiel:

<div>
<h1>FBML als praktische Werbeplattform</h1>
<p>Fbml ist die neue und unkomplizierte Art sein Unternehmen noch effizienter zu präsentieren.</p>
<p><a href=“#“>Werden Sie Fan!</a></p>
</div>

<style>
<!–
div {background:url(http://www.deinewebseite.at/images/bla.gif) top center #fff;}
h1 {color: green; font-size: 25px;}
p {color: red; font-size: 14px;}
a {color: black; text-decoraiton: underline;}
–>
</style>

Der Einfachheit halber sollte man den gesamten CSS-Teil am Ende des HTML-Teil stellen. Das hat den Vorteil, dass man sich keinen Wolf scrollen muss, um die Inhalte zu bearbeiten. Erfahrungsgemäß arbeitet man öfter an den Inhalten als an der CSS.

Empfehlenswert ist es, sowohl den HTML-Part als auch den CSS-Part extern vorzubereiten, also nicht direkt in die FBML-Box reinzuschreiben. Es ist einfach gemütlicher, beide Teile in einem HTML-Editor zu erstellen. Somit vermeidet man Fehlerquellen und muss nicht unnötig rumdoktern. Zumal das FBML-Formularfeld nicht sehr nutzerfreundlich gestaltet wurde.

Erwähnt sei auch, dass komplexe CSS-Strukturen nicht umsetzbar sind. Daher sollte man auf verschachtelte divs verzichten. Hier empfehle ich ausnahmsweise Tabellenkonstrukte – in der konventionellen Webseitengestaltung würde ich diese Technik nicht anwenden. Da ja Facebook an sich schon keinen Wert auf Validität und Barrierefreiheit legt, kann man auch alle beiden Augen zudrücken. Hier geht es wirklich nur um das optische Darstellen und nicht unmittelbar um Barrierefreiheit, Validität oder gar Benutzerfreundlichkeit… Facebook hat viele Möglichkeiten unterbunden, um zu tiefes Eingreifen in den Code zu verhindern. Ob das gut oder schlecht ist, sei mal dahingestellt.

*

Static FBML-Tutorial für individuelle Fanseiten-Reiter (pdf, 910kb)
von Annette Schwindt und Alexandra Steiner

Ich freue mich, wenn Sie diesen Beitrag weitersagen via        

FBML-Tutorial für eigene Reiter auf Facebook-Fanseiten

UPDATE: Static FBML wurde abgeschafft. Der folgende Artikel ist also hinfällig. Individuelle Inhalte können jetzt nur noch über eine eigene Anwendung via iframe eingebunden werden. Mehr dazu unter http://dewww.schwindt-pr.com/2011/03/04/facebook-iframetabs/

Da ich gerade heute wieder danach gefragt wurde, poste ich diesen Beitrag auch noch einmal hier (dieser Artikel erschien kürzlich auch als Gastbeitrag auf facebookmarketing.de, allerdings mit anderen Screenshots).

Im Zuge der anstehenden Änderungen für Facebook-Fanseiten wird der Bedarf an individuell gestalteten Reitern stark an Bedeutung zunehmen. Daher hier noch einmal ein ausführliches Schritt-für-Schritt-Tutorial:

Über die Anwendung “Static FBML” können Sie individuell gestaltete und auch individuell benannte Reiter zu Ihrer Fanseite hinzufügen. Innerhalb dieser Reiter können Sie mit normalen HTML-Befehlen ihrer Kreativität freien Lauf lassen. Gehen Sie dabei wie folgt vor:

1. FBML-Anwendung zur Seite hinzufügen

Gehen Sie zur Anwendung “Static FBML” und klicken Sie auf “Zu meiner Seite hinzufügen”.

Wenn Sie mehrere Fanseiten betreuen, müssen Sie hier ggf. noch diejenige, die Sie bearbeiten wollen, auswählen. Sehen Sie den Link “Zu meiner Seite hinzufügen” nicht, haben Sie vermutlich ein Unternehmenskonto ohne Profil angelegt und können keine Anwendungen benutzen.

2. FBML-Anwendung einstellen

Gehen Sie zu Ihrer Fanseite und klicken Sie dort auf “Seite bearbeiten” (unter dem Profilbild). Scrollen sie runter bis zur Anwendung FBML:

Klicken Sie zunächst auf “Anwendungseinstellungen”. Es erscheint ein Fenster wie dieses:

Möglicherweise hat Facebook die Anwendung bereits automatisch als Feld (auf dem “Felder”-Reiter) hinzugefügt. Dann klicken Sie hinter “Feld: hinzugefügt” auf “entfernen” (denn der “Felder”-Reiter soll demnächst abgeschafft werden).

Über “hinzufügen” hinter “Reiter: Verfügbar” erstellen Sie einen eigenen Reiter und klicken auf “OK”.

3. FBML-Reiter benennen

Wählen Sie jetzt innerhalb des FBML-Abschnitts die Option “Bearbeiten” und geben Sie dem neuen Tab einen (möglichst kurzen) Namen, indem Sie das Formularfeld “Titel des Feldes” ausfüllen. Sobald Sie dies über “Änderungen speichern” am Ende des FBML-Formulars gespeichert haben, wird die Anwendung in der Liste unter “Seite bearbeiten” mit diesem Namen angezeigt (hier im Beispiel lautet der Name “schwindt-pr”):

Auf der Fanseite sollte jetzt auch ein gleichnamiger Tab erschienen sein.

4. Inhalte per HTML einfügen

Befüllen können Sie diesen Tab jetzt über “Bearbeiten” (innerhalb der FBML-Anwendung auf “Seite bearbeiten”), indem Sie das Formularfeld “FBML” befüllen. Möglicherweise steht darin bereits folgender Code zu lesen:

Dies soll sie daran erinnern, dass Sie hier nur HTML-Befehle ab der div-Ebene abwärts (!) verwenden können. Erlaubt ist allerdings – wie der Name schon sagt – nur statisches HTML; Skript wird nicht zugelassen.

WICHTIG:

  • Tabs werden in der Weite auf 520 Pixel begrenzt werden! Achten Sie also darauf, dass Sie diese Weite nicht überschreiten! Dies ist v.a. beim Einbinden von Grafiken oder Definieren von Weiten (z.B. bei gefloateten Bereichen) wichtig!
  • Das FBML-Formularfeld leider sehr eng und unübersichtlich. Am besten bereiten Sie also Ihren HTML-Code erst mal offline über einen Text- oder HTML-Editor vor und fügen ihn dann nachher einfach ein und klicken dann auf “Änderungen speichern” am Ende des FBML-Formulars. (Achten Sie nur wieder darauf, dass Sie nur Code ab div-Ebene einfügen! Alle übergeordneten Ebenen sind bereits für Facebook an sich belegt!)
  • Wenn Sie den einzelnen Elementen wie Überschriften, Text etc. keine weiteren style-Definitionen mitgeben, verwendet Facebook das Facebook-CSS. Wenn Ihnen dieses Layout aber nicht gefällt, können Sie es über eigene style-Befehle auch überschreiben.

5. FBML-Reiter verschieben

Zurück auf der Pinnwandansicht Ihrer Fanseite können Sie den neuen Reiter jetzt noch per Drag&Drop verschieben. Nur der Pinnwand-Reiter und der Info-Reiter (solange er noch vorhanden ist) sind am Anfang der Reiter-Liste fixiert. Alle anderen Reiter lassen sich in der Reihenfolge tauschen.

6. Weitere FBML-Reiter hinzufügen

Am Ende des FBML-Bearbeitungsformulars (s. Schritt 3) finden Sie den Link ” Weiteres FBML-Feld hinzufügen”. Wenn Sie den anklicken, erscheint wieder ein neues noch unbenanntes FBML-Feld auf dem “Felder”-Reiter, das Sie dann wie ab Schritt 2 beschrieben bearbeiten können.

So ist z.B. dieser selbst gestaltete Reiter auf der Fanseite von schwindt-pr entstanden:


UPDATE: Lesen Sie auch die Blogposts über das Einbinden von CSS in FBML-Reiter und das Einbauen eines Menüs in einen FBML-Reiter oder laden Sie gleich das Static FBML-Tutorial für individuelle Fanseiten-Reiter (pdf, 1.01MB) herunter.

Ich freue mich, wenn Sie diesen Beitrag weitersagen via        

Mehr zum Thema FBML-Tabs für Facebook-Fanseiten

UPDATE: FBML ist hinfällig. Individuelle Inhalte müssen jetzt mit eigener Anwendung via iframe oder mit Hilfe von Drittanwendungen eingebunden werden.

Heute ist ein Gast-Tutorial von mir zum Thema FBML-Tabs für Facebook-Fanseiten auf facebookmarketing.de erschienen, in dem ich nochmal ausführlicher darauf eingehe, wie man einen solchen Tab (oder Reiter) erstellt.

Diese Schritt-für-Schritt-Anleitung ist auch als pdf-Download (7.2 MB) über Scribd erhältlich. Oder mit weiteren Beispiel-Screenshots hier im Blog zu lesen.

Vielen Dank an Philipp Roth und Jens Wiese für die Anfrage nach diesem Gastbeitrag und die Umsetzung der pdf-Datei! :-) Philipp wird dann demnächst hier einen Gastbeitrag  zum Thema Facebook-Unternehmenskonten beisteuern.

Wenn Sie auch an einem Gastbeitrag von mir interessiert sind, lassen Sie es mich wissen! ;-)

Ich freue mich, wenn Sie diesen Beitrag weitersagen via        

Facebook: Die häufigsten Fragen zum Thema Fanseiten

In letzter Zeit erreichen mich immer wieder dieselben Fragen zum Thema Facebook-Fanseiten. Daher möchte ich die Antworten hier kurz zusammenfassen:

Warum erscheinen die Postings der Seite nicht im Nachrichtenstrom auf der Startseite der Fans?

Antwort: Facebook leitet Fanseiten-Postings nur noch automatisch ins “Seiten”-Feed weiter, aber nicht ins Feed “Livemeldungen”. Möglicherweise erscheinen Seiten-Postings im “Neugikeiten”-Feed von Fans, wenn deren Userverhalten dazu passt bzw. ein Posting besonders viel Interaktion bekommt.

Und nein, das kann man nicht durch irgendwelche Einstellungen verändern.

Wenn Sie sichergehen wollen, dass eine Nachricht bei allen Fans ankommt, verschicken Sie sie über “Aktualisierung versenden” (s.nächste Frage).

Wohin ist der Link zum Versenden von Aktualisierungen verschwunden?

Antwort: Der Link “Aktualiserungen an Fans versenden” befand sich früher unter dem Profilbild einer Fanseite. Inzwischen ist er nur noch über Seite bearbeiten > Marketing erreichbar.

Sie sollten diese Funktion allerdings nicht überstrapazieren, wenn Sie den Fans nicht auf die Nerven gehen wollen.

Die über diese Funktion verwendeten Nachrichten landen im Facebook-Postfach der Fans unter “Aktualisierungen”.

Es gibt neue Richtlinien für das Durchführen von Gewinnspielen auf Fanseiten?

Antwort: Ja, und Sie können sie nachlesen unter:
http://de-de.facebook.com/promotions_guidelines.php

Welche Änderungen sind für Fanseiten noch zu erwarten?

Antwort: In nächster Zeit sollen folgende weitere Änderungen für Fanseiten in Kraft treten:

  • Abschaffung der Felder (zukünftig können Anwendungen nur noch über eigene Reiter/Tabs eingebunden werden)
  • (gerüchteweise) Abschaffung des Info-Reiters (indivduelle Infos ohnehin besser über FBML-Reiter einbinden!)
  • maximale Weite (width) der Reiter wird auf 520px begrenzt (ggf. in FBML-Reiter eingebundene Grafiken aktualisieren!)
  • Profilbild wird auf max. 180 x 540px begrenzt (früher 200 x 600px)

Mehr zum Thema Fanseiten für Unternehmen und ein ausführlicheres Tutorial zum Thema FBML folgen in Kürze!

Ich freue mich, wenn Sie diesen Beitrag weitersagen via        

Individuell gestaltete Reiter auf Facebook-Fanseiten dank FBML

UPDATE: FBML ist hinfällig. Individuelle Inhalte müssen jetzt mit eigener Anwendung via iframe oder mit Hilfe von Drittanwendungen wie z.B. iframeWrapper eingebunden werden.

fbml page on schwindt-pr facebook fanpage

Angepasster Reiter auf meiner Facebook-Fanseite

Dank eines Tipps von Andrea Vascellari bin ich auf die Anwendung Static FBML auf Facebook entdeckt. Fügt man diese Anwendung seiner Fanseite hinzu, kann man damit einen neuen Reiter (Tab) auf seiner Fanseite kreieren, der sich per html individuell gestalten lässt.

Bearbeiten lässt sich der Reiter über das Fanseiten-Menü unter dem Profilbild “Seite bearbeiten”. Dann runterscrollen und den Abschnitt FBML suchen:

fbml1

Über den blauen Stift am rechten oberen Ende dieses Abschnitts gelangt man zur Option “Bearbeiten”:

Über “Anwendungseinstellungen” kann man bestimmen, ob man ein FBML_Feld oder einen eigenen Reiter zu seiner Seite hinzufügen möchte.

Beim Klick auf “Bearbeiten” erscheint ein Formular, über das man den neuen Reiter mit einem Namen versehen kann (“Titel des Feldes”).

Übrigens: Sobald man diesen Titel gespeichert hat, erscheint dieser auch im o.g. FBML-Abschnitt unter “Seite bearbeiten”. Aber das nur am Rande.

fbml

 

Zurück zum Formular: Hier kann man nun im “FBML”-Feld die gewünschten hmtl-Befehle eingeben und über “Änderungen speichern” veröffentlichen.

Wichtig ist, dass man nur mit div und untergeordneten Elementen arbeitet (da Facebook selbst ja schon einen body, head etc. pro Seite benutzt). Skripte werden laut Anwendungsbeschreibung nicht akzeptiert.

Weitere FBML-Reiter lassen sich übrigens von einem Link unter dem genannten Formular hinzufügen. diese landen jedoch – je nach Anzahl bereits vorhandener Reiter) u.U. auf dem “Felder”-Reiter.

UPDATE: Schritt-für-Schritt-Anleitung zu diesem Thema

Wie finden Sie diese Anwendung? Und falls Sie sie schon verwenden, welche Erfahrungen haben Sie damit gemacht?

 

Ich freue mich, wenn Sie diesen Beitrag weitersagen via