Quick heads-up before we dive in: always back up your theme first. It only takes a second, but it’s a total lifesaver if a snippet of code doesn't behave. Think of it as a "reset button" that saves you a massive headache later.
Step 1: Add the Widget
Head over to your Layout tab and add a new HTML/JavaScript widget to your sidebar. Paste the widget code into the box. Important: Make sure you swap out Jesus in the URL with your actual Facebook page username so it links correctly to your profile!
<center><div class="fb-page" data-href="https://www.facebook.com/jesus" data-width="360" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"></div></center>Step 2: Insert the Facebook SDK
For the plugin to actually load, you need the Facebook SDK script. This is just a small piece of code that handles the connection between your blog and Facebook. Open your Theme HTML, find the </body> tag at the very bottom, and paste the SDK code right above it. Once you're done, save your theme.
<!-- Facebook SDK -->
<script type='text/javascript'>
//<![CDATA[
(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 = 'https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v20.0';
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
//]]>
</script>Refresh your blog, and you should see your Facebook feed live on your site! This is a great way to let visitors like and follow your updates without ever having to leave your blog. It helps boost your engagement and keeps your traffic flowing to your social media.
