Tuesday, March 29, 2011

The Facebook Fanpage Tab as a App

One of the coolest new features of the new Facebook Fan Page tab is the IFrame and the end of static FBML. This means that you are no longer hemmed in by the restrictions of static FBML. Now with the IFrame you can use Facebook Connect in your Facebook tab and transform your tab from a static page to a fully personal and socially enabled tab. Now your tab can be as powerful as your Facebook App.

It is important to remember that is you add Facebook Connect to your tab and want to perform Facebook API activities that require extended permissions; your tab will need to request these from the user. The impact is that your fan page tab will ask for permissions, this is something that fan pages don't currently do and users may have an issue with this. So, be judicial when asking for permissions and only ask for the necessary  permissions when you need them.
I believe that as more and more tabs become richer, users will begin to accept this.

Monday, March 21, 2011

Twitter Popup Window for Custom Twitter button

Are you tired of having to open a new browser or tab to share a tweet from a custom button?
The "standard" Twitter share button allows you to use a popup window to share on Twitter but custom share buttons have not been able to do this without a lot of custom javascript.

Well I figured out a work around so that you can use existing Twitter libraries with your custom button. The code is based on the Twitter bookmarklet code with a small modification.
 I changed the source of the referenced javascript source from the bookmark.js to the widget.js --- and it worked. See green highlight.


FROM: E.src='http://platform.twitter.com/bookmarklets/share.js?v=1
 
TO:E.src='http://platform.twitter.com/widgets.js

Well here is the code to solve that problem.


<a href="javascript:(function(){window.twttr=window.twttr||{};var D=550,A=450,C=screen.height,B=screen.width,H=Math.round((B/2)-(D/2)),G=0,F=document,E;if(C>A){G=Math.round((C/2)-(A/2))}window.twttr.shareWin=window.open('http://twitter.com/share?url=http://www.nerdery.com&text=cool&via@dan_krueger','','left='+H+',top='+G+',width='+D+',height='+A+',
personalbar=0,toolbar=0,scrollbars=1,resizable=1');E=F.createElement('script');E.src='http://platform.twitter.com/widgets.js';F.getElementsByTagName('head')[0].appendChild(E)}());
"><img src="twitter-logo.png" border="0"></a>


The code in the yellow highlight is the part of the code to customize for your share details. This code is based on the Twitter bookmark code with a small modification.



So now you can get a popup window for sharing from a custom twitter share button

New Facebook Chrome

Bye FBML!
On March 18, 2011; Facebook should have converted all Fan Page sites to the new Facebook chrome. This new chrome will retire FBML from the Fan page tab and enable IFrames for the development of the Fan Page tab. This is exciting news! 
Now the development for the fan page is no longer restricted to the scope of FBML, but wide open to true web development. Now savvy web developers can use their full array of tools and tricks to design and develop a fan page tab. Designers and developers can now utilize HTML/ CSS/JavaScript without restrictions. Most importantly developers can include external JavaScript libraries like jQuery to totally enhance their web development.