The Best Way to Embed PDFs in Squarespace in 2022

By David Nge • Last Updated: March 31, 2022

Embedding and displaying PDFs in Squarespace can confusing... until now.

In this tutorial, I'll walk you through step-by-step on how you can embed PDF on your site without signing up on obscure platforms and without knowing how to code.

Best of all? It's completely free.

All you need is a Google and Squarespace account, which I presume you already have. Right?

Pardon the meme
Pardon the meme

We'll go over:

Let's dive right in.

Upload your PDF to Google Drive and get the embed code

First, sign in to your Google Drive account. If you have an account with Gmail, Youtube, or any other Google products, you can use the same login to access your Google Drive.

If you don't have an account, then create a new Google account here.  

Once logged in, upload your PDF by selecting NewFile Upload.

Select New from the sidebar
Select New from the sidebar
Upload a new file in Google Drive
Upload a new file in Google Drive

Select the file from your computer or mobile and click Open.

Once the file upload has complete, change the file access permission to public so that anyone can view your PDF.

Share permission for your PDF file
Right click to share permission for your PDF file

Now double click on the PDF to open it.

Double click on the PDF to view
Double click on the PDF to view

Head to the top right corner, click on the three dot (kebab) menu and select Open in new window.

Open the file in a new window
Open the file in a new window

You should see a similar screen with a view of you PDF file. Not the URL for this page, it should end with 'view'.

Check the URL. Make sure you're viewing the PDF file
Check the URL. Make sure you're viewing the PDF file

Click on the three dot (kebab) menu on the top right corner again and select Embed item.

Select Embed item from the drop down menu
Select Embed item from the drop down menu

Copy the embed code and paste it in a note pad or text editor. You will need this when you embed the PDF file on your Squarespace site later.

Copy the embed code
Copy the embed code

Embed PDF on Squarespace

First, login to your Squarespace account and select a site to edit.

Select a site to edit in Squarespace
Select a site to edit in Squarespace

Click Edit to start editing your site.

On the page, head to the section where you'd like to embed the PDF, click an insert point and add an embed block.

Add an Embed block in the Squarespace editor
Add an Embed block in the Squarespace editor

In the embed block settings, click on the code icon.

Select the code icon to add the embed code
Select the code icon to add the embed code

Then add the embed code that you copied from Google Drive earlier in the text field.

Add the embed code and you will see a preview of the pdf
Add the embed code and you will see a preview of the pdf

You should see a preview of your PDF on your page.


Pro tip

Adjust the width and height to customize the outlook of the PDF.

Customize the height and width of the PDF file
Customize the height and width of the PDF file

Making the PDF mobile responsive.

You can also make the PDF mobile responsive by changing the width to 100%. That way the PDF will always be displayed in full width no matter the screen size.

Change the width to 100% so it will fit on any screen size
Change the width to 100% so it will fit on any screen size

Once you're done, click Save to publish your changes.

That's it!

Didn't think embedding PDF in Squarespace is that easy didn't you? ;)