Branding For Dummies
Book image
Explore Book Buy On Amazon

The following steps create code for a Like button on your Facebook business page. We’re not going to go into the deeper development of code with Open Graph Tags, which would provide you additional analytic data from liking activity. In fact, we’re going to go through only what Facebook calls Step One:

  1. Go to http://developers.facebook.com/docs/reference/plugins/like.

    You’re on the page that generates the code for your Like button.

  2. In the form, enter the URL of the web page where users will like your posts.

    Type the complete URL of your website, including the http:// part.

  3. Decide whether you want to include the Send button with your Like button.

    We suggest that you select the box to include it.

  4. Choose your layout style from the drop-down menu.

    The three choices are standard, button count, and box count. You can click each one to see a preview.

  5. Type in the width you want to use for your Like button.

    Choose a width that complements the layout of your website or blog. The default size — 450 pixels — works for most sites.

  6. Select the Show Faces check box if you want to show the Profile images of the people who like your post.

    The faces show up on the standard button style only and appear next to the button. Having the faces of visitors’ Facebook Friends on a blog post helps build social trust and encourages them to like something if they see that their Friends have already liked it. Note that users see only the faces of their Friends, not of everyone who liked the post.

  7. From the drop-down menu, choose which verb (Like or Recommend) you want to display in the button.

    Some people suggest that you choose Like most of the time because it’s more widely recognized by Facebook users.

  8. Choose the color scheme for your button from the drop-down menu.

  9. Choose the font for your button from the drop-down menu.

  10. Click Get Code.

    A dialog box pop ups, displaying two code boxes. You can choose iFrames code or XFBML code.

    XFBML code is more versatile, but you need to know how to use the JavaScript SDK. The XFBML code allows you to resize the button height dynamically — and, with a bit of code tweaking, to know in real time when someone clicks the Like button. XFBML creates a comment box to allow people to add a comment to the like.

    You may have seen on other blogs that when you click the Like button, a little text field opens that gives you a chance to type a comment. If users do add a comment, the story published back to Facebook is given more EdgeRank!

    Modifying code takes a little expertise. If you enjoy working with code and are a do-it-yourself kind of person, Facebook has some support and training for you at http://developers.facebook.com/docs/reference/javascript/.

    If you aren’t concerned about the deeper analytics of tracking and just want people to like and share your posts on Facebook, you can configure the code from the preceding steps and copy either the XFBML or iFrames code that’s generated.

  11. Copy the code you want.

    Now you can place the code on your website or give the code to your webmaster to place on your site.

About This Article

This article can be found in the category: