A Beginner’s Guide to Squarespace Audio Blocks

A Squarespace audio block can be used to play an audio file directly from a page on your website.

An audio block can feature a file uploaded directly to Squarespace, or linked from an external source. The audio file will play directly on the page without an additional program.

You can upload an MP3 or M4A audio file that is 160MB or less.

Audio blocks come in two design formats displayed below. The first is the minimal audio block, the second is the classic.

Audio Block
Double-click here to upload or link to a .mp3. Learn more
Audio Block
Double-click here to upload or link to a .mp3. Learn more

How to add an audio block to Squarespace

  1. Select edit on the top left-hand side of your website preview.

  2. Click the add block option on a page section, or the plus sign inside classic editor.*

  3. Select the audio option form the list of content blocks

  4. Upload your audio; you have a few options:

    • Upload a file: Click "Upload" to pick an audio file from your computer.

    • Use a saved file: If you've already uploaded the audio, choose it from your media library.

    • Link to an online file: Paste the web address of the audio file.

  5. Optional: Click the pencil icon to open the audio block editor. You can:

    • Add a title or description: Help people understand what they're about to hear.

    • Change the look: Pick colors and styles that match your site.

    • Download option: Add a download button if you want people to be able to download your audio file to their computer.

*Classic editor is used by blog posts, additional product details, individual events, and sites built on version 7.0 Learn more inside Squarespace Made Simple*

What you can customize about the audio block using Squarespace

  • You can change the style of the block to minimal dark, minimal light, or classic. These colors can not be adjusted using the site style menu.

  • You can add an audio track title, and list the author/artist for the audio track.

  • You can give people the option to download the file.

  • You can connect an individual audio block to your RSS feed.

What you can customize about the audio block design using CSS

CSS stands for Cascading Style Sheet and it’s a special type of code that you can use to customize Squarespace. This tutorial will teach you how to customize the style of your audio block using simple code.

Where you can learn more about the Squarespace audio block

Squarespace Made Simple

This mini course for beginners will teach you how to create your first Squarespace website. Lesson seven includes information about audio blocks.

LEARN MORE →

Squarespace Support Article

Learn more from the official Squarespace support blog

Previous
Previous

Archive Block

Next
Next

Bandsintown