A Beginner’s Guide to Squarespace Menu Blocks
Display an organized list of your offerings with a Squarespace menu block.
A premium feature for business and commerce plans, the menu content block allows you to place an organized menu of items directly into your Squarespace site.
Menu blocks will help you organize your delicious offerings into pages and sections that contain items. This makes it much easier for your visitors to find exactly what they're craving!
Each page is a group of related items. Maybe you have a "Starters" page, a "Main Courses" page, and a "Desserts" page. You can even add a little blurb under each page title to describe what it's all about (optional, but it adds a nice touch!). Inside each page you can have sections and individual menu items.
How to add a menu block to Squarespace
Select edit on the top left-hand side of your website preview.
Click the add block option on a page section, or the plus sign inside classic editor.*
Select the menu option form the list of content blocks.
Double click on the menu block, or click once and select the pencil icon to open the content block.
The content tab in the menu block has demo content that you can replace with your own. Check out the menu block formatting guide below.
Use the design tab, you can to change the layout to multi column, which will separate menu items from each section into two columns automatically, or you can choose the single column, which will center the contnt. to edit the currency. The current currency options are dollar $, euro € , pound £ , and yen ¥
*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*
How to format content for your Squarespace menu block
LUNCH === Section Title ---- section description Item Title description $10 Second Item second description $20 DINNER === new Section Title ---- dinner section description Item Title description $10 Second Item second description $20 Third Item Title third description $30
Use 3+ equal signs under a line of text to create pages
Use 3+ dashes to create sections inside your menu
Use two lines to separate menu items.
Here is the text used in this example menu:
How to customize the Squarespace menu block with CSS
CSS stands for Cascading Style Sheet and it’s a special type of code that you can use to customize Squarespace. Squarespace designers use custom CSS when the design menu has limited options.
Where you can learn more about Squarespace content blocks
Squarespace Made Simple
This mini course for beginners will teach you how to create your first Squarespace website. Lesson seven includes information about content blocks.
Squarespace Support Article
Learn more from the official Squarespace support blog
Squarespace
made simple
Get all the info you need to confidently
launch your Squarespace website ASAP.