There are lot of ways to promote your content using social sharing platforms. However, many platforms like Instagram and WhatsApp are primarily used for entertainment and news sharing purposes. For general informational or knowledge sharing, you may find Facebook and Twitter work better. Especially, Facebook Page is one of the dedicated ways to promote your content to targeted users. If you are using WordPress and have a Facebook Page for your site, here is how to embed Facebook Page widget in the sidebar to get more likes or action.
Facebook Page Widget
The advantage with Facebook Page is that you can reach out vast number of audiences for free. If required, you can also boost the posts with paid advertisement. Below is the Facebook Page widget of our Page in simplified format without timeline feed. You can customize the appearance by adding timeline, events and also adjust the size.
By inserting the Facebook Page widget on your site, you have the following advantages:
- Users can scroll and read your feed in the Page. Besides your own content, you can also promote some affiliate pages or other useful content and directly drive traffic to those pages from your website.
- The widget shows like and a call to action button that you have added on your Page settings. For example, you can add “Shop on Website” button to send users to your online store.
- Finally, it’s free and you can embed this widget anywhere on your website.
Embed Facebook Page Widget in WordPress
There are multiple ways to insert the widget in your WordPress site. In this article, we will explain the following three ways using different plugins.
- Manually create a widget
- Using Jetpack
- With Widgets for Social Page Feeds plugin
1. Manually Creating Facebook Page Widget
Facebook offers a developer section to use different types of Social Plugins for embedding Page, post, comments, Like button, etc. You can use your own Facebook login details to access the developer section and get the embed code for Page plugin. Go to Facebook Page Plugin section on their developer’s section.
Fill out the following details:
- Facebook Page URL – paste your Page URL, you will see the instant preview so that you can be sure that you have used correct Page URL.
- Tabs – enter timeline in the text box to show your Page’s timeline feed. However, you can also use messages or events show them instead of timeline. When you type timeline, the preview will change to show the timeline from your Page feed.
- Width and Height – you can leave the width and height and select the “Adapt to plugin container width” option to fit the available space on your sidebar or footer widget area. If you want to have the widget with specific size, then provide the details in pixels. Width can be from 180 to 500 pixels and height should not be less than 70 pixels.
- Other Options – enable or disable other options for showing big/small header, show/hide friend’s faces and hide/show cover photo.
If required, you can go through the developer document to add additional parameters. However, the above are the basic stuff needed for creating a Page Plugin for your WordPress site. Scroll down below the preview and click on “Get Code” button.
You will see the code like below showing JavaScript SDK and IFrame options.
Embedding Facebook Page Plugin Iframe Code
The easy way is to use the iframe option that does not need any additional plugins. Click “IFrame” tab and copy the code to your clipboard.
Now, login to your WordPress admin panel and navigate to “Appearance > Widgets” section. Click on the + icon and search for “Custom HTML” block. When you find it, click to insert on your sidebar or footer area.
Simply, paste the copied iframe code in the Custom HTML block and it should look like below.
Click on “Preview” option to see the live preview of your Page widget.
If everything looks fine, click “Update” button to publish your widget. Open any page on your site and check the sidebar (or footer, if you have added the widget in footer).
As you can see, the widget is bit hidden due to the width of the container. We have used the plugin’s container width option when creating the widget. In this case, you can adjust the width and provide exact width as per your sidebar or footer area to make the widget visible properly.
Using JavaScript SDK Code
If Iframe code does not work on your site for any reasons, you can use the JavaScript SDK code. You can copy the code in Step 1 and Step 2 from Facebook developer site.
Paste both the code inside the Custom HTML block as shown below:
Though this will work, it is appropriate to insert the body code (Step 1) and plugin code (Step 2) separately. To do this, you can go to “Appearance > Theme Editor” and edit the theme’s file to find the <body> tag in header.php or single.php (or in the appropriate file). Alternatively, you can install and activate Insert Headers and Footers plugin and paste the body code by navigating to “Settings > Insert Headers and Footers > Scripts in Body” section.
You can insert the plugin code from Step 2 inside Custom HTML block as explained above.
Note: With Gutenberg block editor, you can use Custom HTML block anywhere on your site. For example, you can embed Facebook Page widget in-between post content using the same Custom HTML block.
2. Using Jetpack Plugin
If you do not want to spend time in creating the widget, you can consider plugin alternatives. Jetpack is the easy option if you are already using the plugin on your site.
- Go to “Jetpack > Settings” menu and click on “Writing” section.
- Scroll down and enable “Make extra widgets available for use………” under “Widgets” section and save your settings
- Now, go to “Appearance > Widgets” and insert the “Facebook Page Plugin (Jetpack)” block.
- The settings of this widget are exactly similar to the original Facebook Page Plugin.
- Fill up the details and “Update” the widgets section to see your Facebook Page widget in action.
3. Using Widgets for Social Page Feeds Plugin
Jetpack is a good option, however the plugin has too many modules and slow down your site if your only purpose is to use Facebook Page Plugin widget. The alternate option is to use a dedicated plugin like “Widgets for Social Feeds”. This is a lightweight plugin and will not affect the speed of your site as Jetpack.
- Go to “Plugins > Add New” section in your WordPress admin panel and install/activate the plugin on your site.
- After that, go to “Appearance > Widgets” and insert “Facebook Page Like Widget” block to your sidebar.
- Though this plugin needs similar details like original Facebook Page plugin, it also needs an App ID that you have to create from your Facebook Developer account. You can also use the developer’s App ID instead of using your own and finish the setup quickly.
- Fill up all the required details and update the widgets section.
The plugin also offers a shortcode [fb_widget] that you can insert anywhere on the site to showcase Facebook Page widget.
Final Words
There are multiple ways to embed Facebook Page widget in your WordPress site. Creating your own Facebook Page widget is much easier from official Facebook Social Plugins section. WordPress also makes the task easier with in-built Custom HTML block. However, you can use the plugins if you do not want to login to your Facebook account or creating widget on your client’s site.
Leave a Reply
Your email is safe with us.