Calendar blocks

Pull events or other collection items from your collection pages to display in a calendar format.

Last updated December 22, 2023

Use calendar blocks to create calendars that display events from events pages in other areas of your site. Calendar blocks can also display other collection items.

Watch a video

Before you begin

Calendar blocks don’t support booking. For booking, we recommend using scheduling blocks.

 Add the calendar block

To add a calendar block:

  1. Edit a page or post, click Add Block or an insert point, then click Calendar. For help, visit Adding content with blocks.
  2. Open the block editor by clicking the pencil icon on the block.
  3. Choose a collection page to display content from. Calendar blocks can only display content from one collection page. If your site is on version 7.0, click Apply to publish your changes.

 Calendar block display

 Calendar blocks can display items from the following collections

  • Events - Links to upcoming and past events. Displays event title, event time, and featured image. Calendar blocks are optimized for use with events pages.
  • Blog - Links to blog posts by publication date. Displays post title and featured image.
  • Products - Links to products by publication date. Displays product name, description, and featured image.
  • Album (version 7.0) - Links to album tracks by publication date. Displays track title.
  • Gallery (version 7.0) - Links to images by publication date. Displays image title.

For the best visual display, we recommend adding excerpts and featured images to every item in the collection displayed in your calendar blocks.

Keep in mind:

  • Item excerpts display on hover.
  • Featured images display cropped to fit the square area of the given calendar date.
  • Dates without items appear gray or match your site’s background color, depending on the size of your block. Calendar blocks don’t have their own style tweaks.
  • If an event is set to end at midnight, calendar blocks will display the event on both days. To only display the first day, adjust the end time to 11:59pm on the linked events page.
  • Blog posts scheduled for future publication won't appear in calendar blocks, though upcoming events will.

Interactive features

Calendar blocks load with the current month displayed, and include interactive features to help visitors navigate and view details:

  • Arrow controls automatically appear at the top to navigate by month.
  • Clicking any date with an item will open the original item page.
  • If there are multiple items occurring on the same date, each item's time and title displays in the same box. The height of the week expands automatically to display additional items.
  • In the case of multiple items on a given date, featured images for individual items won't display.

Responsive design

Calendar blocks adjust to fit the page when viewed on a smaller display. You can resize the blocks to adjust their size relative to other page content. 

  • When the block width is smaller than 600 pixels, titles, event times, and excerpts display, but not featured images.
  • When the block width is smaller than 300 pixels, only titles display.
Footer Image
  • Get help from our community

  • Get help from our community on advanced customizations.

  • Hire a Squarespace Expert

  • Stand out online with the help of an experienced designer or developer.