Adding your Instagram, Facebook or Twitter widget to your Squarespace blog is easy.

Follow these steps to create your widget. Once you've created your widget, follow the appropriate steps below to add it to your blog.

Note that Squarespace allows you add your widget to a specific page by means of an Embed block.

  • Log in to Squarespace and on your Dashboard select your site and click on WEBSITE.

  • Select Pages on the left sidebar.

  • Select the page you want to add your widget to.

  • Click on Edit to open the page in Edit mode.

  • For this tutorial we have created pages with one section containing a text block. The text block contains the title of the respective widget we are going to add, i.e. Grid Display or SlideShow Display.

  • Letโ€™s add the Embed block.

You can add another section to add your widget to or add a block to the existing section. In our case we will add a new block to our existing section underneath the title.

  • Click on + ADD BLOCK

  • Under Basic, select the Embed block.

  • This will add an Embed block to the section in which you can paste your snippet.

  • Squarespace provides a grid to allow you to add blocks in an orderly manner and also assist in sizing and justifying your widget. The standard Embed block is set to 8 x 8 grid blocks.

  • Using the handles you can change the size of the displayed widget to any size you want.

  • You can also move the widget to anywhere in the allowed space of the section. We will move the widget to center page just underneath the title text block.

  • Sizing your widget depends on the type of widget. The Grid Display uses more space than the Slideshow Display so therefore wait until you have inserted your widget and then resize it by using the handles. Please note that if you make the size of the widget too small, you wonโ€™t be able to click on an item and the social media buttons also wonโ€™t be displayed properly.

  • To insert your snippet, click on Edit.

  • This will display the Content dialog allowing you to enter a link to an external item or a Code Snippet.

  • Select Code Snippet and Embed data to insert your snippet.

  • A preview of your widget will be provided.

  • You will notice that the widget displays very small. To resize, click on the EMBED area and use the handles to resize.

  • Click on Save (top left on page under DONE) and check how your widget displays.

  • Click on one of the items and the full image will be displayed in a Lightbox.

The same process applies when you insert your SlideShow widget.

  • On your dashboard, select the page for adding your SlideShow widget.

  • Click on Edit to open the page in Edit mode and follow the same steps as above for the Grid Display.

  • Center your Embed block.

  • Insert your snippet under Embed data.

  • A preview of your widget will be provided.

Donโ€™t worry about the way the widget displays, after you have saved the page it will be displayed properly.

  • Click on Save (top left on page under DONE) and check how your widget displays.

  • Click on one of the items and the full image will be displayed in a Lightbox.

Did this answer your question?