Neben der Integration des Like Button (z.B. im Blog) gibt es auch im Rahmen der Facebook Social Plugins die Facebook Fan-Box (seit dem Umbenennen von “Fan werden” zu “mag ich” als Like Box) für die eigene Webseite.

Facebook stellt hierfür, wie für die anderen Plugins auch, einen Like Widget Codegenerator zur Verfügung. Leider baut der Facebook Generator für die Fan-Box / Like-Box den Code zur Integration falsch auf, das Ergebnis sähe bei unserer Firmen-Fanbox so aus:

<iframe src="http://www.facebook.com/plugins/likebox.php?profile_id=341249284440&amp;width=292&amp;height=350&amp;connections=10&amp;stream=true&amp;header=true" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:292px; height:350px"></iframe>

Bei der Übergabe der Parameter (http://www.facebook.com/plugins/likebox.php?profile=16id=341249284440) hat sich leider bei Facebook ein Fehler eingeschlichen, es müsste korrekt “likebox.php?profile=16id=341249284440″ übergeben werden:

<iframe src="http://www.facebook.com/plugins/likebox.php?profile=1&id=341249284440&amp;width=450&amp;height=350&amp;connections=10&amp;stream=true&amp;header=true" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height:350px"></iframe>

Hier könnt ihr direkt Fan werden:

Im Gegenzug zu dem Zugang in einen “Stream” (den Wall von Usern bei Facebook), auf dem der User all seinen Freunden mitteilt, was gerade so passiert (und was er so alles mag), sieht Facebook meiner Vermutung nach natürlich, wer sich von welchen auf welche Seiten im Netz bewegt, kann Statistiken hierüber für Werbepartner auswerten, kann somit “re-marketing” Möglichkeiten an Werbekunden verkaufen und sich generell fester in den Web-Sattel setzen.

Meines Erachtens nach kommt in Zukunft niemand im Marketing von Unternehmen an Facebook vorbei (hierbei auch interessant: Mein Blogbeitrag über den 2010 Social Media Marketing Industry Report in unserem Agentur Unternehmensblog).

Wie dem auch sei mag ich die technischen und konzeptionellen Möglichkeiten des Like Buttons, daher möchte ich hier schnell erklären, auf welche Art und Weise dieser in einem Blog oder auf einer Webseite integriert werden kann:

Facebook ermöglicht dies auf zwei Weisen. Entweder nutzt man einen iFrame, der den benötigten Inhalt direkt von Facebook einbettet. Der Code hierfür lautet so (den Parameter für die URL muss an die entsprechende Seite angepasst werden):

<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.reitenschwimmenlesen.de%2F&amp;layout=standard&amp;show-faces=true&amp;width=450&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:500px; height:60px"></iframe>

In einem WordPress Template kann man den benötigten href Parameter wie folgt auslesen lassen:

<?php echo urlencode(get_permalink($post->ID)); ?>

Man kann aber auch auf die von Facebook zur Verfügung gestellte FBML (Facebook Markup Language) zurückgreifen. Dies erfordert allerdings ein Einbetten von Facebook JavaScripts in die Seite. Wenn auf Facebook Connect zurückgegriffen wird, sind die benötigten JavaScripts aber höchstwahrscheinlich sowieso schon Teil des Quelltextes und müssen daher ohnehin geladen werden. Hierbei sieht dann das Einbetten des Like Buttons so aus:

<fb:like href="http://www.reitenschwimmenlesen.de/" layout="standard" show_faces="true" width="450" action="like" colorscheme="light" />

Das benötigte JavaScript von Facebook kann man wie hier beschrieben irgendwo im Quelltext der Seite einbetten.

Einen Generator gibt es dafür auch bei Facebook selbst.

Für den ein oder anderen Einsteiger und Fortgeschrittenen iPhone Entwickler sind hier mit Sicherheit einige Perlen dabei.

Programming for the iPhone is still pretty new. It might be a bit tougher to find iPhone developer resources, but we found a bunch that will get you through building any iPhone app you might be starting on. Check out our list of our favorite developer books, blogs, podcasts, screencasts, open-source libraries, communities, forums, conferences, training, and more!

DVPmysqlucFederation at Flickr: Doing Billions of Queries Per Day

Bei der Entwicklung von CakePHP Anwendungen können von Haus aus Informationen z.B. zur Datenbankabfrage mithilfe der Konfigurationsvariable debug und des Befehls

Configure::write("debug", 1);

ausgegeben werden.

Es gibt insgesamt 4 Debug Level, die hier im Kontext einer älteren CakePHP Version (dort wird die Konstante DEBUG genutzt) folgendermaßen bezeichnet werden:

There are 4 levels of debug: 0-production, 1- development, 2- full debug with sql and 3- full debug with sql and dump of the current object. Specifying this setting to a non-zero value will force Cake to print out the results of pr( ) and debug( ) function calls, and stop flash messages from forwarding automatically. In production, the “flash messages” redirect after a time interval. With the other debug levels you get to click the “flash message” to continue. For example, if you want to set the debug level to “full debug with sql”, the line should look like this: define(‘DEBUG’, 2);

Da die Debug Informationen von Cake immer am unteren Seitenende gerendert und – sobald man vom CakePHP Standardlayout abweicht – auch äußerst hässlich werden, gibt es bei Snook.ca die folgenden CSS Klassendefinitionen, um diese Infos generell schicker zu gestalten:

.cake-sql-log {
	position:fixed;
	top:99%;
	z-index:10;
	width:100%;
	background-color:#000;
	color:#FFF;
	border-collapse:collapse;
}

.cake-sql-log caption {
	background-color:#900;
	color:#FFF;
}

.cake-sql-log:hover {
	top:auto;
	bottom:0;
}

.cake-sql-log td {
	padding:3px;
	border:1px solid #999;
	background-color:#EEE;
	color:#000;
}

Wer jetzt noch weitere Informationen braucht (wie oben bereits erwähnt u.a. zu Sessiondaten, Log-Aktivitäten, Timings etc.) der ist mit der CakePHP DebugKit Toolbar von Mark Story gut bedient.

Die Toolbar “versteckt” sich geradezu absolut positioniert in der rechten oberen Ecke der Webseite und öffnet sich blei Klick auf ein kleines Icon.

Was sie alles bietet, zeigt sich in den folgenden Screenshots:

Ich binde die Toolbar dynamisch je nach Umgebung auf folgende Art und Weise im app_controller ein:

	public function __construct(){
		parent::__construct();
		if(DEVELOPMENT_ENVIRONMENT){
			$this->components[] = 'DebugKit.Toolbar';
			Configure::write('debug', 2);
		} else {
			Configure::write('debug', 0);
		}
	}

Hier prüfe ich auf die Konstante DEVELOPMENT_ENVIRONMENT, die ich, wie alle anderen Variablen, die global für die App zur Verfügung stehen müssen, in der bootstrap.php definiere. Solche Variablen könnten eben serverseitig zur Auswahl der entsprechenden Pfade (z.B. für Logs oder temporäre Uploads) oder auch für die Auswahl der entsprechenden Datenbankverbindungen herangezogen werden.

Hier gibt es – wie ich gelesen habe – hundert Ansätze, das Problem zu umschiffen, der leichteste und praktikabelste ist in meinem Setting (mit MAMP auf Mac OS) folgender, direkter Aufruf einer anderen PHP Version zum Ausführen des PHP Scripts.

Der Aufruf erfolgt in dem Projekt- Konsolenordner (z.B. in meinem Fall /Users/lrheingans/Documents/Workspace/Project_X/cake/console/)

/Applications/MAMP/bin/php5/bin/php cake.php bake

Von hier läuft dann alles wie gewohnt.

Um das Bake Script unter Eclipse ausführen zu können, gibt es auch in der Bakery einige Tutorials (mir war der mini Aufwand allerdings nicht wert, ich mag meine Konsole)

Wer sich für Softwareentwicklung im Webbereich mit Java und Spring interessiert, sollte sich auf jeden Fall seinen RSS Feed abonnieren.

Page Speed

Page Speed integriert sich in Firebug und verhält sich ähnlich wie das von Yahoo! herausgebrachte YSLOW Plugin, mit einigen weiteren Extrafeatures die eine Seitenoptimierung erfolgreicher machen können:

So bietet Page Speed eine ausgefeilte CSS Analyse an, die Hinweise auf ungenutztes (und ineffizientes) CSS Styling ausgibt:

In der Performance Summary bietet sich ein von YSlow bekanntes Bild, wenn auch mit einigen weiteren Hinweisen:

Eine besonders interessante Funktion ist der sogenannte Acticvity Recorder, bei dem sämtliche Aktivität von der Page Speed Extension anhand einer mitlaufenden Zeitleiste dargestellt wird:

Ich werde mir unsere Webseiten in den nächsten Tagen einmal genauer mit Page Speed ansehen, und schauen, wie es sich gegenüber YSlow verhält.

In der Datei includes/application_top.php befindet sich die folgende Zeile:

$breadcrumb->add($product->getBreadcrumbModel(), xtc_href_link(FILENAME_PRODUCT_INFO, xtc_product_link($product->data['products_id'], $product->data['products_name'])));

die folgendermaßen angepasst werden muss:

$breadcrumb->add($product->data['products_name'], xtc_href_link(FILENAME_PRODUCT_INFO, xtc_product_link($product->data['products_id'], $product->data['products_name'])));

Um das ganze noch ein wenig suchmaschinenoptimierter zu gestalten empfiehlt es sich, in der Datei /lang/german/german.php (und, bei mehrsprachigen Shops, entsprechend in den anderen Sprachdateien und -ordnern) die folgende Anpassung vorzunehmen, um von den unsinnigen Standardwerten “Startseite” und “Katalog” von xtCommerce wegzukommen und die Premium Position doch lieber für eigene, für die Suchmaschinen relevantere Keywords zu nutzen (hier am Beispiel der Palmenoase, einem Onlineshop für mediterrane Pflanzen und Palmen):

define('HEADER_TITLE_TOP', 'Palmenoase');
define('HEADER_TITLE_CATALOG', 'Shop');

Kleiner Aufwand, große Wirkung, wie man in den folgenden Screenshots in der Brotkrumennavigation feststellen kann.

Das folgende Fehler PopUp der Internet Explorer 6, 7 oder 8 sind ein immer wiederkehrendes Ärgernis, wenn man versucht, einen Dateidownload mittels PHP zu realisieren:

Hierbei handelt es sich um ein dynamisch im Memory des Webservers generierten PDF Dokuments, das eigentlich als PDF_Preview.pdf betitelte Datei im Browser ankommen soll (und im Firefox, Safari, Opera und Chrome auch tut).

Zur Erzeugung wird der PDFLib Personalization Server genutzt, und am Ende des ganzen Erzeugungsprozesses steht ein Buffer (hier beispielhaft $pdf_buffer) des kompletten Dokumentes als Variable zur Verfügung.

Was für den Browser jetzt noch passieren muss: Per PHP header() Funktion wird dem Browser mitgeteilt, dass es sich um einen bestimmten Mimetype (ein Tool, um den MIME Type bei Dateiuploads herauszufinden gibt es hier) bzw. Datenstrom handelt (in diesem Fall handelt es sich um ein PDF, dass mit Content-type: application/pdf beschrieben wird). Weiterhin wird definiert, dass es als Dateidownload zur Verfügung gestellt werden soll, und der gewünschte Dateiname wird vom Script übergeben).

Um diesen Dateidownload (auch mit dem Internet Explorer) hinzubekommen, müssen zusätzlich diese zwei weiteren Headerinformationen mit angegeben werden:

header(‘Content-type: application/pdf’)
header(‘Content-Disposition: attachment; filename=”PDF_Preview.pdf”‘);

// Folgende zwei Zeilen sind für den IE wichtig,
// alle anderen Browser brauchen sie nicht
// (stören sich daran aber auch nicht)
header(“Pragma: public”);
header(“Cache-Control: max-age=0″);

echo $pdf_buffer;

Im Vorfeld (auf jeden Fall bevor der Buffer mit echo ausgegeben wird) sollte allerdings in jedem Fall die zu erwartende Dateigröße mittels

$pdf_buffer = PDF_get_buffer($p);
$len = strlen($buf);
header(“Content-Length: $len”);

berechnet und ebenfalls per Header ausgegeben werden.

Vielleicht hilft dieser schnelle Artikel mir selbst auch beim nächsten Auftreten solcher Probleme als Gedächtnisstütze…

Mittels der Google Analytics AS3-API kann auf alle Features von Google Analytics jetzt direkt aus Flex heraus zugegriffen werden, das Ding nennt sich “gaforFlash”. Getestet hab ich da noch nix, aber nachzulesen ist die Geschichte hier: Google Analytics within Flex/Flash Applications. Ich verabschiede mich kurz in einen spontanen, wohlverdienten Urlaub…..

Webseiten sehen in unterschiedlichen Browsern immer etwas anders aus.

Hier könnte der Service der Firma xenocode, einem Anbieter für Virtualisierungslösungen, schon zumindest etwas mehr Komfort mitbringen, denn über Ihre Webseite “Run IE8/7/6, Firefox, Safari, Chrome, and Opera from the web” können die verschiedenen Browser als “Mini System” heruntergeladen und dann auf einer Windows-Maschine getestet werden.

So bekommt jeder Browser (z.B. der als IE8.exe verpackte Internet Explorer seine eigene .exe – Sandbox und kann somit parallel zu anderen Browsern laufen.

Ich als Mac Jünger habs noch nicht getestet (beim Mac zeigt auch der Link schon an, dass es auf “meinem device” nicht funktioniert), aber runterladen (für Parallels und die anderen Rechner im Office) werde ich sämtliche Sandboxen auf jeden Fall

Für mich kam es gerade beim Einpflegen französicher Messagebundles gerade recht, dort müssen französische Sonderzeichen in die korrespondierenden HEX Werte umgewandelt werden.

Zu finden ist das kleine Tool, das zwar leider nur einzelne Buchstaben konvertiert, unter diesem Link: Online-Tools: Int/Hex/Char-Converter und Entity-Generator gegen EMail-Spam.

Dort werden die von Cake bereitgestellten Funktionen (den Artikel Localizing your Application gibt es übrigens hier) beschrieben, wie die verschiedenen Strings der .po Dateien aus Cake heraus aufgerufen werden können.

Was in manchen unserer Projekte auch oftmals wichtig war, ist und sein wird:
Wie können dynamische Inhalte, also solche aus der Datenbank, internationalisiert werden? Statische Strings sind mit der .po-File Variante kein Problem – aber wie sieht es mit dynamischem Content aus?

Ein nützliches Tutorial für diesen Ansatz findet sich z.b. hier und der dazugehörige Teil 2 hier. Wie die Stolpersteine hier aussehen und wie CakePHP ein Speichern / Updaten von i18n Einträgen behandelt kann ich später erläutern, grundsätzlich gibt es bei dieser Herangehensweise eine weitere Tabelle im Datenbankmodell, die folgendermaßen aussieht:

In dieser Datenbanktabelle werden sämtliche Übersetzungen der verschiedenen Models gespeichert (die Tabelle kann also ziemlich fix ziemlich “umfangreich” werden).

Für alle, die auf dem Mac den hervorragenden und günstigen SQLEditor nutzen, gibt es hier die oben gezeigte SQS Datei, ansonsten kann die Tabelle auch im Terminal angelegt werden, indem man im Verzeichnis /console von Cake folgenden Befehl eingibt:

./cake i18n

[ einige weitere andere Infos dazu auch unter dem top-to-bottom-persistent-internationalization-Tutorial auf CakePHP.org zu finden ]

Leider können HABTM Relationships erst ab Version 1.3 mit dem Translation Behavior von Cake bedient werden, heisst also: Hier muss manuell Hand angelegt werden, sobald HABTM Relationships ins Spiel kommen.

Kleiner Seitenhinweis:
Über die Konsole kann bei Cake auch ein komplettes, sog. “Baking” stattfinden, das anhand der Datenbankkonfiguration das komplette Projekt einmal initial erstellt, mit sämtlichen Models, Controllern und Views und sämtlichen CRUD Funktionen.

Sehr gute, verschiedene Screencasts zu CakePHP (Installation, Baking,
Scaffolding, …) finden sich im Übrigen sich auf der Webseite von David Golding, seines Zeichens Verfasser des Buches “Beginning CakePHP” (das, in meinen Augen, bei weiterm nicht mit dem CakePHP Buch von O’Reilly mithalten kann).

Durch umfangreiche Arbeiten mit CakePHP in den letzten Wochen könnten verschiedene Themen aus unterschiedlichsten Bereichen interessant sein, die ich ggfls. in den nächsten Tagen Wochen mal vorstellen könnte:

• Wie sieht eine sinnvolle Entwicklungsumgebung in Teams von Entwicklern aus? Wie kann man also mit Eclipse und SVN und anderen Techniken besser und schneller gemeinsam mit weniger Fehlern entwickeln.
• Wie kann ich die CakePHP config so anpassen, dass ein Deployment auf unterschiedlichen Servern sinnvoll funktioniert (z.B. für verschiedene Server für Development, Testing und Live)
• Wie nutzt man die CakePHP Auth Component richtig (immer wieder ein heisses Thema)?
• Wie binde ich die i18n Features von CakePHP richtig ein?
• Wie kann man die Pagination von CakePHP mit weiteren, eigenen Parametern oder Filtern versorgen?
• Wie kann ich die Performance von CakePHP Projekten weiter verbessern?

Falls bei dem ein oder anderen Thema besonderes Interesse bestehen sollte – immer her mit Kommentaren.