Facebook How-To’s

Have a Facebook page and wondering how to integrate your Page with your website? Facebook has many badges, boxes and widgets that work quite nicely in your Faithwebsite application. Here are step-by-step instructions for just a few of our favorite integration picks.

Facebook Badge Example1. Facebook Badge

The “badge” comes in a few different formats, with the vertical option fitting well in both the Right Side Columns or Under the Left Nav area.  For the footer, change the format to to Horizontal or 2 Column, and for the main body – the likely choice would be the 2 Column.

To embed this badge on your website:

  1. On your Facebook page, click Edit Page
  2. On the right hand side, find “Promote with Facebook Badge” and click “Get your badge”
  3. Click “Edit this badge”
  4. Select the layout and items you want – you can see the preview changing as you select / unselect items; click “Save”
  5. Click the “Other” button; a field of code will pop up below
  6. Click in the code field and Copy;

    keep that window open

  7. In your FWS admin site, head to your Navigation Builder Home and go to the page you wish to place this badge on
  8. In your Main Body/Right Side or Under Left Nav, create a new text/graphic editor
  9. In the editor, click the Source button; in the Source mode, Paste your Facebook badge code into the editor
  10. Click Submit; preview your page on the live site to see how your Badge looks!

2. Facebook Like Box

The Like Box is a great combination of offering your visitors a one-click option for “Liking” (previously known as Becoming a Fan) your Facebook page, a way to see some of the feed from Facebook right on your website, and a way to share a bit of your growing community online. Many organizations have seen great success in merging their Facebook pages and their website once they’ve added this box to one or several pages.

To place the Like Box on your site:

  1. On your Facebook page, click “Edit Page”.
  2. On the right hand side, click “Promote with a Like Box”.
  3. In the Like Box menu, the first thing you need is your Page ID. To find this, look up at your address bar in your browser window. The last digits in your address URL is your page ID.

    See image below:

  4. Enter your Page ID and tab; once you do so, the example on the Right hand side of the screen should change – and if you grabbed the right ID, it will show your Facebook page.
  5. Next you have choices to make on how you want your Like Box to look. If you are entering this in a Main Body text editor on your site, you can keep the default width, or consider widening it. The preview will change as you make changes.  You can also enter this in the Right side bar but the width can only be 185 pixels, which is quite narrow – but check it out and see if you like it! For a Main Body placement, you can go up to about 500 pixels, with something between 250 and 400 pixels wide being recommended.
  6. Once  you are satisfied with the look, click “Get Code”. In the pop-up box, click to highlight all the “iframe” code and Copy.
  7. In your FWS admin site, select the page you want to place your Like Box on. Create a new Text/Graphic Editor and click the Source button.

  8. Click Paste; Click Submit.
  9. In the admin site, the Facebook Like Box may look like it is just “spinning”, but preview your live site – you should be good to go!

With all widgets, it is always recommended that you place the HTML code into a new, or separate Editor. Be aware of your Right Side, Main Body and Under Left Navigation widths prior to inserting widgets that may inadvertently expand or alter the alignment of your site’s page. If you would like additional information or need support in adding these Facebook widgets to your Faithwebsite, please click on your Support Center link in your admin site and start a new ticket.

If you have found another Facebook promotion box or widget that has been successful for you, please share in the comments of this post!

Tags: ,

Leave a Reply

Your email address will not be published. Required fields are marked *

Subscribe to our RSS Feeds

Blog Search

Join Us on Twitter

Join Us on Facebook