Jump to content

Facebook Page Plugin

Recommended Posts

Site URL: https://developers.facebook.com/docs/plugins/page-plugin

Hello,

Does anyone have experience adding the Facebook Page Plugins to their Squarespace site?

I have tried following every tutorial online to no avail, it always ends up in a random string of code, or just the title of my Facebook page in black letters instead of the embedded object. Neither the iFrame or the Javascript option have brought about any results. I have the Apps installed in the developer tools for Facebook.

Thanks for your help

J

Link to comment

Can you clarify this question: "adding the Facebook Page Plugins"?

Get iframe embed code > Add Code Block > paste code (remember DO NOT CHECK DISPLAY SOURCE)

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Hi Tuanphan,

Thanks for your reply.

I would like to embed the facebook page feed to my Squarespace site, and I followed the instructions that you said there and it doesn't work.

It is just a blank block, nothing, that shows up...

 

Edited by jayh
Link to comment
On 3/21/2020 at 2:18 AM, jayh said:

Hi Tuanphan,

Thanks for your reply.

I would like to embed the facebook page feed to my Squarespace site, and I followed the instructions that you said there and it doesn't work.

It is just a blank block, nothing, that shows up...

 

Can you share link to the page where you inserted FB code?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 3 months later...
  • 1 year later...
5 hours ago, SamM33 said:

If anyone has a recommendation it would be very welcome

Can you provide more details of what you've tried so far? Screenshots often help. For example:

  1. Where should the Facebook feed appear (which page and position)? 
  2. Which Squarespace Block have you used and what are the settings? 
  3. Please share the code that you added.
  4. What symptoms you are seeing?

About: SQSP User for 17 yrs. Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥.
Work: Founder of SF Digital, building Squarespace Extensions to supercharge your commerce website. 
Content: Links in my posts may refer to SF Digital products or may be affiliate links.
If my advice helped, you can thank me by clicking one of the feedback emojis below. I love coffee too.

Link to comment

Thanks @paul2009 I'd like to embed the Facebook page plugin with timeline tab at the bottom of this page: https://www.stroudvalleysproject.org/svp-eco-shop. Presently I've generated the code from developers.facebook.com and have added it as follows:

Within settings > advanced > code injection > footer:
<!-- for FB feed -->
<div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v11.0" nonce="AcU7VpiV"></script>

Within an embed block on the page:
<div class="fb-page" data-href="https://www.facebook.com/stroudvalleysprojectecoshop" data-tabs="timeline" data-width="" data-height="" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><blockquote cite="https://www.facebook.com/stroudvalleysprojectecoshop" class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/stroudvalleysprojectecoshop">Stroud Valleys Project eco shop</a></blockquote></div>

Oddly, my browser will let me see what I want when I'm signed in to Squarespace (previously it wouldn't even render in Squarespace), but when I launch an incognito window or alternative browser I get the following...

Incognito window:
1566777272_Screenshot2021-09-08at17_42_04.png.91fb418c80b2a86473254efcfb8f0f80.png

 

Safari browser (loads the header but no timeline posts):
1592535540_Screenshot2021-09-08at17_44_21.thumb.png.1625efb88476c24fa2044270efcf442f.png

Link to comment
18 hours ago, SamM33 said:

I'd like to embed the Facebook page plugin with timeline tab at the bottom of this page

The first section of code (the JavaScript SDK) should be in site's header (not footer) or, if you only want the Facebook feed to appear on this page, add it to the injection header of that page instead. You'll find this in the Advanced Settings of the page.

The second section of code (the HTML) should be added to a Code Block wherever you want this to appear. 

Give this a try and let me know how you get on.

 

About: SQSP User for 17 yrs. Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥.
Work: Founder of SF Digital, building Squarespace Extensions to supercharge your commerce website. 
Content: Links in my posts may refer to SF Digital products or may be affiliate links.
If my advice helped, you can thank me by clicking one of the feedback emojis below. I love coffee too.

Link to comment

Hello @paul2009, I moved the first part of the code to 'Header' injection, and added the second part on the page in a 'code' block. I've also cleared the cache on both my browsers (chrome and safari). It seems to work on chrome in the live site. On safari however I don't get the posts from the timeline, but I do get the header. I'll ask the clients to check it in a few browsers as this feels like a step forward! Thanks, Sam

Link to comment
  • 8 months later...

I was able to embed an FB page. I don't know if you created a Meta developer account https://developers.facebook.com/ but I think that's the first step because it includes  "app id" info that goes into the code you put in Squarespace. I also added some code into my "site.region" file (Squarespace Developer mode) I think I saw you can add. I think there is a browser compatibility issue because on Chrome it doesn't load the feed correctly for me. 

squarespace_forum_answer_1.JPG

squarespace_forum_answer_2.JPG

squarespace_forum_answer_3.JPG

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.