This article provides instructions on how to add your organization's Facebook page as a widget in your Higher Logic environment.

TIP: Open a text editor such as Notepad so you can store some information throughout this process.

Steps - Facebook

1. Open a browser and navigate to the Facebook Page Plugin page: https://developers.facebook.com/docs/plugins/page-plugin.
2. In the Facebook Page URL field, replace the default Facebook URL with your organization's Facebook page URL (for example, https://www.facebook.com/higherlogic).

3. Specify the dimensions of the widget and select your display preferences.

4. Below the preview, click Get Code. A pop up will appear with two sets of code. Do not close the browser.

TIP: As a fail-safe, copy the code from both sections and paste it into the blank text editor. Minimize the editor to your system tray.

Steps - Higher Logic

In Higher Logic:

1. Access the CMS and navigate to the page that will host the Facebook widget.
2. Click the ellipsis menu and select Edit.

You will now create two HTML content items and populate each with the code from the Page Plugin site.

1. Add an HTML content item by dragging and dropping it from the Build menu to the Canvas.
2. Click the HTML content item to select it. Name it Facebook JavaScript and ensure the Show Title Above Content option is unchecked.
3. With the HTML content item still selected, click the pen and paper icon to display the WYSIWYG editor.

4. Click the HTML button, and in the Source code field, paste the div id code from the Step 1 section of the Get Code pop up.

5. Add another HTML content item. Click the HTML content item to select it. Name it Facebook Widget and ensure the Show Title Above Content option is unchecked.
6. With the HTML content item still selected, click the pen and paper icon to display the WYSIWYG editor.

7. Click the HTML button in the editor and in the Source code field, paste the div class code from the Step 2 section of the Get Code pop up.

8. Click Publish.

NOTE: The widget should display after a few moments.

You can close the browser and text editor.