Walczyłem dzisiaj z dostosowaniem wyglądu „nowej” wersji wtyczki społecznościowej Facebook Like Box. Mając doświadczenia ze starą wersją XFBML <fb:fan>, która pozwalała na podłączenie własnego arkusza CSS, liczyłem, że będzie równie łatwo. Niestety przeliczyłem się. Nowa wtyczka nie dość, że została pozbawiona opcji css, to na dodatek nie obsługuje prawidłowo parametru height! Kolejny przykład, że nowe nie znaczy lepsze…
Żeby tego było mało, stara wersja nie jest już wspierana i na próżno szukać oficjalnej dokumentacji. Na szczęście wiele serwisów nadal jej używa a w sieci można znaleźć sporo artykułów o tym jak dostosować jej wygląd do własnych potrzeb. Skompletowanie obsługiwanych parametrów nie było więc trudne. Po chwili jednak okazało się, że nie wszystko działa tak jak powinno.
W momencie wprowadzenia Facebook Places like box (dla profili z wprowadzonym adresem) zaczął domyślnie wyświetlać „friends check-ins” zamiast wpisy z tablicy a nowa wtyczka wyposażona została w parametr force_wall. Jak można się było spodziewać nowy parametr nie jest obsługiwany w starym tagu <fb:fan>. Ponieważ wolę wychodzić z założenia „nie ma rzeczy niemożliwych” niż mówić „nie da się” zacząłem drążyć temat.
Na rozwiązanie problemu wpadłem zupełnie przypadkiem. Jak już wspomniałem parametr force_wall nie jest obsługiwany w tagu <fb:fan> ale, ku mojemu ogromnemu zaskoczeniu, jest obsługiwany jako parametr GET w adresie ramki, która jest wynikiem parsowania XFBML! Mogę się tylko domyślać, że obsługa tego parametru w starym API znalazła się „przypadkiem” dzięki stosowaniu zasad DRY i KISS przez developerów Facebook’a 
Skoro nie mogłem użyć tagu FBML, który sprytnie upraszcza konstrukcję długich i mało czytelnych adresów dla iframe, postanowiłem zaszyć tą złożoność w postaci helpera widoku dla Zend Framework, oto on:
<?php
/**
* ModernWeb
*
* LICENSE
*
* This source file is subject to the new BSD license that is bundled
* with this package in the file LICENSE.txt.
* It is also available through the world-wide-web at this URL:
* http://www.modernweb.pl/license/new-bsd
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to kontakt@modernweb.pl so we can send you a copy immediately.
*
* @category Modern
* @package Modern_Facebook
* @subpackage View
* @author Rafał Gałka <rafal@modernweb.pl>
* @copyright Copyright (c) 2007-2011 ModernWeb (http://www.modernweb.pl)
* @license http://www.modernweb.pl/license/new-bsd New BSD License
*/
/** @see Zend_View_Helper_Abstract */
require_once('Zend/View/Helper/Abstract.php');
/**
* Helper widoku generujący Facebook Like Box.
*
* @category Modern
* @package Modern_Facebook
* @subpackage View
* @author Rafał Gałka <rafal@modernweb.pl>
* @copyright Copyright (c) 2007-2011 ModernWeb (http://www.modernweb.pl)
* @license http://www.modernweb.pl/license/new-bsd New BSD License
*/
class Modern_Facebook_View_Helper_LikeBox extends Zend_View_Helper_Abstract
{
/**
* Adres API pluginu Like Box.
*
* @var string
*/
protected $_pluginApi = 'http://www.facebook.com/plugins/fan.php';
/**
* Domyślne wartości parametrów GET adresu ramki
* zawierającej wpisy z profilu "wall".
*
* @var array
*/
protected $_defaults = array(
'colorscheme' => 'light',
'header' => 'false',
'force_wall' => 'true',
'stream' => 'true',
'connections' => '0',
);
/**
* Generuje kod iframe Like Box'a.
*
* @param string $fanpageHref
* @param integer $width
* @param integer $height
* @param array $params
* @param string $css
* @return string
*/
public function likeBox($fanpageHref, $width, $height, $params = array(), $css = '')
{
$args = array();
foreach($this->_defaults as $k => $v) {
$args[$k] = (isset($params[$k])) ? $params[$k] : $v;
}
$args['href'] = $fanpageHref;
$args['css'] = $css;
$iframeSrc = $this->_pluginApi . '?' . htmlentities(http_build_query($args));
$script = '<iframe src="%s" scrolling="no" frameborder="0" ' .
'style="overflow:hidden;width:%spx; height:%spx;" ' .
'allowTransparency="true"></iframe>';
return sprintf($script, $iframeSrc, $width, $height);
}
}
Kod jest na tyle krótki, że przejdę od razu do przykładów użycia:
<?php
// wpisy z tablicy profilu
echo $this->likeBox('http://www.facebook.com/ZendTechnologies', 300, 500);
// "lajkersi"
echo $this->likeBox('http://www.facebook.com/ZendTechnologies', 300, 500, array(
'stream' => 'false',
'connections' => '20',
));
// wpisy i "lajkersi"
echo $this->likeBox('http://www.facebook.com/ZendTechnologies', 300, 550, array(
'connections' => '10',
));
// wpisy i własne style
echo $this->likeBox('http://www.facebook.com/ZendTechnologies', 300, 500, array(), 'http://example.com/facebook.css?v=1');
W temacie samego dostosowania wyglądu like box’a nie będę się rozpisywał ponieważ został już wyczerpany w wielu artykułach, np:
