Adding Facebook and Twitter Buttons to a GWT Project

As a new user to GWT I spent quite some time trying to add a Twitter Tweet button and Facebook Like button to a GWT project. After extensive searching I didn't find a useful answer.

The issue I was having was that I would include the JavaScript and the HTML provided by Twitter and Facebook but my buttons weren't being rendered.

I had the JavaScript includes in my index.jsp and had created a UIBinder .swt.xml with the HTML code but when I launched my app it was just blank.

The solution was to make a call to the Twitter and Facebook JavaScript functions once the Composite had loaded.

This is achieved by over-riding the Composite's onLoad method and calling the rendering functions like so:

@Override protected void onLoad() {
 showSocialButtons();
 super.onLoad();
}

private static native String showSocialButtons() /*-{
 $wnd.twttr.widgets.load(); //Render twitter button
 $wnd.FB.XFBML.parse();     //Render facebook button
}-*/;

And this meant that my social buttons were being rendered properly.