Adding the Facebook Page Plug In

A Facebook Like box for public pages (not private groups) can be placed into either the Left Side Widget area (below the primary menu) or in the Right Side Widget Area of the three-column page.  If your organization does not have a public Facebook page, you are encouraged to display the like box of the Alumni Association.  See Alumni Association Like Box code below.

Best place to add a Facebook like box is in a 3-column page text widget.

Steps to Add the Facebook Like Box in the Right Column

  1. From the Dashboard, hover over Appearance then click on Widgets
  2. From the list of Available Widgets click on Text (or drag the text box to the appropriate column) and click on the column (right for the 3-column page)
  3. Click on the down arrow  ( ∇ ) of the new text box to expose the text box settings
  4. Leave Title: blank
  5. Paste the appropriate code from below into the Contents: box
  6. Click on Save

Public pages – Getting the Code for the Text Box

Visit https://developers.facebook.com/docs/plugins/page-plugin to obtain the needed code.

facebook-developer

For best appearance, check the box Adapt to plugin container width.

Click on get-code which will provide the needed script in a pop-up window.

Copy & Paste both the javascript SDK and the code for your plugin into the Content: box of the text widget.

Code for the Alumni Association Like Box

if your organization does not have a public page, you may display the Facebook like box for the Alumni Association by inserting this code into the Content: box of the Text Widget:

 

<div id="fb-root"></div>
<script>(function(d, s, id) {
 var js, fjs = d.getElementsByTagName(s)[0];
 if (d.getElementById(id)) return;
 js = d.createElement(s); js.id = id;
 js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.4";
 fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<div class="fb-page" data-href="https://www.facebook.com/USNAAlumni" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true" data-show-posts="false"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/USNAAlumni"><a href="https://www.facebook.com/USNAAlumni">U.S. Naval Academy Alumni Association &amp; Foundation</a></blockquote></div></div>