How to Embed and Display Files on Your Squarespace Site

How to Embed and Display Files on Your Squarespace Site

By Michael Turner

December 20, 2024 at 01:10 PM

Here's how to visualize various file types directly on your website using embedded third-party code.

PDF Files Use Issuu to embed PDF files on your site. Follow their platform-specific instructions for implementation.

Microsoft Files (Excel and PowerPoint)

  1. Upload your file to OneDrive
  2. Navigate to Files page
  3. Right-click the document (Control + click on Mac)
  4. Select "Embed"

Embed option in popup menu

Embed option in popup menu

  1. Click "Generate"
  2. Copy the provided embed code

iframe code for OneDrive

iframe code for OneDrive

  1. Add a Code Block to your page
  2. Paste the embed code
  3. Save changes

Google Drive Documents

  1. Open your document
  2. Click File
  3. Select "Publish to the web"

Download and save web page

Download and save web page

  1. Click "Publish"
  2. Copy the embed code from the Embed tab

"Code to insert link"

"Code to insert link"

  1. Add a Code Block to your page
  2. Paste the embed code
  3. Save changes

Resizing Tips

  • For slide presentations: Adjust height and width numbers in the embed code
  • For documents and spreadsheets: Add height and width parameters after the URL
  • Use
    height=600px
    for standard height
  • Set width to 100% for full-column width
  • Use spacer blocks for custom widths

Note: Custom code modifications may affect responsive design and mobile functionality. Consider consulting with a platform expert for complex implementations.

Related Articles

Previous Articles