How to display Facebook Page and Profile on a website?

Share

Since the Facebook scandal, erupted over personal data mishandling, Facebook API has been constantly changing and updating. Almost every week, apps and plugins using this API including Facebook Feed widget face performance problems.

Therefore, we have developed a 100% working solution to display a Facebook page or profile on your website, that will not be affected by constant changes.

Video tutorial

A step-by-step tutorial on how to add Facebook page or profile to website

So, to integrate your Facebook page into your website, you need to meet only one condition – you need to be the administrator of the page which you would like to display on the site.

1. Add a new app in Facebook for developers

Follow the link https://developers.facebook.com/apps and add a new app.

Add a new Facebook developers app

2. Create a new app ID

Enter Display name, Contact email and then press Create App ID button.

Create a new Facebook App ID

3. Choose your app in Graph API Explorer

Go to https://developers.facebook.com/tools/explorer and replace Graph API Expolrer with the app you’ve created.

Choose your app in Graph API Explorer

4. Get your User Access Token

Press Get Token and select Get User Access Token.

Get your User Access Token

5. Select permissions for your Facebook Access Token

Check the required options on the popup window.

To display your Facebook page on a website choose:

  • manage_pages
Permissions to display your Facebook page
To display your Facebook page choose only «manage_pages»

To display your Facebook profile on a website choose:

  • user_likes
  • user_photos
  • user_posts
  • user_status
  • user_videos
  • user_managed_groups
Permissions to display your Facebook profile
To display your Facebook profile choose the permissions stated above

Confirm all the requests.

6. Open in Access Token Tool

Click Info icon next to the token and Open in «Access Token Tool» button.

Open in Access Token Tool

7. Extend Access Token

Press Extend Access Token.

Extend Facebook Access Token
Important: Facebook Access Token is valid only for two months, so make sure you take all these steps again in two months, to get a new access token.

8. Copy your Facebook Access Token

Select the whole Access Token and copy it.

Copy Facebook Access Token

9. Insert your token in a Facebook Feed to get attractive widget!

Fill in Facebook User Access Token field and set your Facebook page URL or ID below. After widget adjustment, press Join to install to get a code for easy adding to your website.
  • Katijke

    Hi, pre-sales question. I’ve been looking at the tutorial to add the Facebook feed to a WordPress website and in the last step is says “This new long-lived access token will expire on August 5th, 2018”. I don’t know when these screenshots have been made but does this mean you have to renew the access token every … month(s)?

    Also i wanted to see the plugin in action on https://elfsight.com/facebook-feed-widget/examples/ and in all frames it says “No search results for given source. Please, check the input data and make sure the page is open for public access.”

    • Hello Katijke,
      We are sorry for coming back to your question so late! Unfortunately, based on Facebook policy, your access token gets expired every two months, which means that you will need to renew it once it is expired.
      We are sorry that you didn’t manage to check our plugin in action and now the link is fixed, so if you are still interested, please give it a second try!
      We hope you will like it!

      If you have any further questions, do not hesitate to contact us.

      Sincerely,
      Elfsight Team