Add Facebook Scrolling Feed To Your Sidebar / Widget

facebook-scrolling-feed-box

If you are not seeing your Facebook Scrolling Feed or other FB plugins in Chrome, go to your settings in Chrome.  Look to the left and click on “Extensions”.  Disable all extensions, then re-enable each one, one at a time and check to see which extension is the problem.

I don’t know why Facebook makes it so hard to find the code for this,  but they do.  Some day people will understand what “user friendly”  means!

Log In to your WordPress Site and go to your Dashboard.

Click on “Appearance” or click the arrow next to “Appearance” to see the hidden menu.

Click on “Widgets”

Find the “Text” widget and click and drag it under the appropriate sidebar (slowly so that the dashed border appears for a placement box – you can add above or below existing widget titles)

(you may have to click the arrow next to the sidebar name for the hidden contents to show underneath before dragging the “Text” box there)

Once the “Text” widget is in place, the widget will resize to allow for inputting text.

There is no need to give it a title!

Copy this code into the body of the box (second window for text).

<p> <script src=”http://static.ak.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US” type=”text/javascript”></script><script type=”text/javascript”>FB.init(“324ad502db80d15939a0dd8fcb5ff352″);</script><fb:fan profile_id=”121022166846″ stream=”1″ connections=”10″ width=”175px”></fb:fan><div style=”font-size:8px; padding-left:10px”><a href=”http://www.facebook.com/pages/Asheville-NC/Clickable-Digital/121023164846″>Clickable Digital</a> on Facebook</div></p>

Now you have to change the code!!!!

Go to your Facebook page:

Sign In to Facebook.

If you have a personal page as well as a business page, Look under to the upper right and find a drop=down arrow and select “Use Facebook as Page”.

Now Copy Your URL – look for the text “http://www.facebook.com/pages/……….”  Click in the url window to highlight all words.  On your keyboard, hold down “Ctrl” and “C” keys to copy.

Now go back to your website (“Alt” and “Tab” for shortcut to get there)

Find the code within the previously pasted text – <a href=”http://www.facebook.com/pages/…

BE CAREFUL TO KEEP THE QUOTATION MARKS AROUND YOUR URL WITHIN THE CODE!!!!!!!!!!

Paste the url you just copied from Facebook into the code that refers to the Clickable Digital page.  (“Ctrl” and “V”)

You also need to change the profile ID (here – <fb:fan profile_id=”121022166846″ stream…) within the code to reflect the numbers at the end of your url (in the example above, 121022166846)

SAVE  !!!!!!

Now make sure it looks OK by viewing your homepage.  If it is too large or too small, change the “width” in the code.  Usually 10 pixels less than your sidebar width will do

You did it!  (when you view your website, it may take a few times refreshing the page to see the widget! Hit the circle-arrow next to the url to refresh)

Leave a Reply

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