I am new to Yii and trying to build an application with Facebook integration. I found an extension yii-facebook-opengraph as a wrapper of facebook php sdk. When I tried to place a facebook like button on my index.php, the like button doesn’t show up. Here is my code:

In configuration /webroot/protected/config/main.php




			'class' => 'ext.yii-facebook-opengraph.SFacebook', 

			'appId'=>'My_Facebook_AppID', // needed for JS SDK, Social Plugins and PHP 	SDK

			'secret'=>'My_Facebook_App_Secret', // needed for the PHP SDK 

			//'locale'=>'en_US', // override locale setting (defaults to en_US) 

			//'jsSdk'=>true, // don't include JS SDK 

			//'async'=>true, // load JS SDK asynchronously 

			//'jsCallback'=>false, // declare if you are going to be inserting any JS callbacks to the async JS SDK loader 

			//'status'=>true, // JS SDK - check login status 

			//'cookie'=>true, // JS SDK - enable cookies to allow the server to access the session 

			//'oauth'=>true,  // JS SDK -enable OAuth 2.0 

			//'xfbml'=>true,  // JS SDK - parse XFBML / html5 Social Plugins 

			//'html5'=>true,  // use html5 Social Plugins instead of XFBML 

     		'ogTags'=>array(  // set default OG tags 

				'title'=>'My site title', 

				'description'=>'My site description', 






In /webroot/protected/components/Controller.php, I’ve added the afterRender function

	protected function afterRender($view, &$output)


    	parent::afterRender($view, &$output);

    	//Yii::app()->facebook->addJsCallback($js); // use this if you are registering any $js code you want to run asyc

    	Yii::app()->facebook->initJs(); // this initializes the Facebook JS SDK on all pages

    	Yii::app()->facebook->renderOGMetaTags(); // this renders the OG tags

    	return true;


Finally, in /webroot/protected/views/site/index.php, I’ve added the following code in the end:

<?php $this->widget('ext.yii-facebook-opengraph.plugins.LikeButton', array(

   //'href' => 'YOUR_URL', // if omitted Facebook will use the OG meta tag


   'send' => true

)); ?>

After the page is rendered, I view source and found the following code in the html source

In the <header> section:


<meta property="og:title" content="My site title" />

<meta property="og:description" content="My site description" />

<meta property="fb:app_id" content="My_Facebook_AppID" />

<meta property="og:type" content="website" />

<meta property="og:url" content="My site URL" />[/html]

before the footer section, I saw the facebook like button rendered as


<div data-show_faces="true" data-send="true" data-skin="default" class="fb-like"></div>[/html]

before the end body tag, I saw:


<script type="text/javascript">


window.fbAsyncInit = function(){FB.init({‘appId’:‘My_Facebook_AppID’,‘status’:true,‘cookie’:true,‘xfbml’:true,‘oauth’:true});};


			var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}

			js = d.createElement('script'); js.id = id; js.async = true;

			js.src = '//connect.facebook.net/en_US/all.js';






It seems that the missing piece is a div


<div id="fb-root"></div>[/html]

I did see code in SFacebook::initJs

            $fbRoot = '<div id="fb-root"></div>';


Can anyone help me understand what I did wrong here and why the fb-root div was not rendered?

Many thanks!

Oooo man, thanks, you found a big bug. The fb-root thing that I thought was working… was not working at all. I just released a new version of the plugin with the bugfix - try it out now!

Thanks for bringing this to my attention!

Downloaded the latest and tried it out. it works. thanks for the quick fix and for putting this extension together.

Cheers and happy coding!

<div id="fb-root"></div>

before end body tag? okey…

Please show an example of Facebook login/logout using facebook-opengraph …

I have several updates for your SFacebook class, go to my PM for details.

A bit of a newbie question. Would somebody be kind enough to share how to do Facebook Login? I am particularly interested in understanding how to store in the Yii User database the facebook id (which is what I require).