Facebook is an essential platform for businesses and individuals to connect with their audience, and it’s crucial to display your Facebook page on your WordPress website. It helps increase engagement and encourages visitors to stay on your website longer. In this article, we will guide you through the process of embedding a Facebook Page on your WordPress website without using a plugin.
#1. Go to the Facebook Developers Page
The first step is to go to the Facebook Developers Page and log in to your account. Once you are logged in, click on the “Plugins and Integrations” option in the left-hand menu, and select “Page Plugin” from the list of options.
#2. Insert Your “Facebook Page URL” and Generate Code
After selecting “Page Plugin,” you will see a page where you can insert your Facebook Page URL and customize the panel.
You can choose the width and height of the panel or leave it as the default size.
- Width: The width of your Facebook Page panel. Default value: 340px
- Height: The height of your Facebook Page panel. Default value: 500px
Additionally, you can display multiple tabs, such as your timeline, events, and messages, by using a comma-separated list.
#3. Insert the Generated Code into WordPress Site
There are two ways to add the generated code to your WordPress site.
iFrame
The easiest way to display the Facebook Page panel is by using an iFrame. Copy the iFrame code generated in Step 2 and paste it wherever you want the panel to appear on your website. You can paste the code in a new page or post, in the sidebar, or even in the footer of your website.
JavaScript SDK
The alternative to using an iFrame is to use the JavaScript SDK. To do this, you need to include the JavaScript SDK on your WordPress footer by adding the following code snippet to your (child) theme’s functions.php file:
/**
* Add scripts to display facebook page
*/
add_action('wp_footer', function () {
?>
<!-- Insert your own code in step 1 -->
<?php
});
After including the code in the functions.php file, add a custom HTML widget where you want the Facebook Page panel to appear and insert your code generated in Step 2.
