Help visitors share your content to their Facebook feeds.

Add Facebook Like buttons to your site to help visitors share your content in their Facebook friends' News Feeds. This guide demonstrates how to add custom like buttons to pages and blog posts using code blocks.

The steps in this guide include using code injection and adding advanced code to code blocks. These are features available in the Core, Plus, Advanced, Business, Commerce Basic, and Commerce Advanced plans. To learn more, visit Choosing the right Squarespace plan.

Before you begin

The best way to add Facebook Like buttons depends on which version of Squarespace your site is on.

• Version 7.1 - Version 7.1 doesn't have built-in options for adding like buttons. Follow the steps in this guide to add them.
• Version 7.0 - We recommend displaying like buttons using Share buttons instead. However, you can follow the steps in this guide if you have coding knowledge and want more control over where the button appears. If you use custom code, first follow the steps below to disable the Facebook Share button.

Add a Facebook Like button

To add a Facebook Like button to your site:

1. If your site is on version 7.0, first disable the Facebook Share button. Open the Share Buttons panel and uncheck Facebook.
2. Follow the instructions in Facebook's developer documentation to generate your custom code using the Facebook Like Button Configurator. A window will open with your code in two fields.
3. Copy the Javascript SDK code from the first field.
4. Open your Squarespace site in a new tab. Open the Code Injection panel.
5. In the Header field, paste the Javascript SDK code and click Save.
6. Return to the Facebook Like Button Configurator and copy the code from the second field. This is your Facebook Like button code.
7. Open the editor for the page or post where you’d like to add the like button, click an insert point, and select Code from the block menu.
8. In the code block editor, paste the like button code.

   Note: Embedded code is sometimes disabled while you're logged in as a security measure. If you're not seeing your code, log out or view the page using your browser's private or incognito mode. For more help, visit Why can't I see custom code while logged into my site?

Add post-specific like buttons to blog posts

You can modify your custom code to display a unique Facebook Like button below each of your blog posts. When visitors click this like button, they will like the specific blog post, rather than your site as a whole.

To add blog post-specific like buttons:

1. In the Pages panel, hover over a blog page, and click to open page settings.
2. In the Advanced tab, paste the Facebook Like button code (from step 6 above) in the Blog Post Item Code Injection field.
3. Replace your site URL in the code with {permalink}.
4. Click Save.

The Facebook Like button will display directly after the content for each blog post.

Note: This code-based customization falls outside the scope of our support. This means that we’re unable to help further with setup or troubleshooting. Additionally, since this is a code-based solution, we can’t guarantee its functionality or full compatibility with Squarespace. This includes how it functions with our responsive design, particularly its appearance on mobile devices, and if it functions on all templates. Code-based customizations can also cause display issues with future updates to our platform. While we can't help further, there are many resources that can point you in the right direction:

• Learn best practices for adding custom code.
• Read our general guide on code-based customizations.
• For help with Facebook's Developer tools, visit their documentation.
• Visit the Squarespace Forum, our customer and developer forum.
• Hire a Squarespace Expert to help build custom code for your site.