Facebook Integration via “Like” Box

Website Resource Toolbox
 
image

Let’s take a look at how to add a Facebook “like” box to your Rotary Club’s website.  This tutorial assumes that your club already has established a Facebook page.  If you have not yet setup a Facebook page for your Rotary club you can do that by starting here http://www.facebook.com/pages/create.php.  Once you have your Facebook page setup you will need your Facebook page URL.  You can find this by loading your Facebook page and examining your browser address bar (see image 1).

Visit http://developers.facebook.com/docs/reference/plugins/like-box/ to create your Facebook embed code:

  1. Enter in your Facebook URL in the “Facebook Page URL” input box (image 2).
  2. Set the desired width and height of your Facebook plugin. If you don’t know what to enter here start with the default settings.
  3. Set the additional parameters as you see fit then click the “get code” button.  A popup window will open with your embed code.
  4. Choose “IFRAME” from the top menu, copy the code provided, then click the OK button to close the window (image 3).
  5. Navigate back to the ClubRunner  editor and click the HTML button at the bottom of the editor screen (image 4). It is important to note that unless you are in the HTML view you can't successfully paste in the Facebook embed code.
  6. Paste the code into your editor window.
  7. Finally click the Design button at the bottom of the editor screen (image 4).  Click the update button to save your work and you are done! If the Facebook like box isn't the right size for your page you can go back to step 2 and tweak the parameters until it fits.

Image 1
Image

Image 2
Image
Image 3
Image
Image 4
Image

Example of Facebook "like" box