Squarespace gives you three ways to put a restaurant menu on a page: its built-in Menu block on any current plan, a link to a PDF, or an embedded menu in a Code block, which needs the Core plan or higher for JavaScript and iframes. The Menu block is text you type, styled by your site's fonts and colours. A PDF link sends guests to a file you already have, and an embedded menu comes from a separate menu service as a snippet of code.
This guide walks through each method step by step, then covers which plan you need and how to check the finished page on your phone.
Which way to add your menu on Squarespace
Start with how your menu changes. If your oysters are priced at market, or the kitchen runs out of short rib at 7:30, you want an edit that takes a minute. If a guest asks whether the pesto has nuts, you want the answer written where they can read it.
| Menu block | PDF link | Embedded menu | |
|---|---|---|---|
| Plan | Basic, Core, Plus or Advanced | No plan requirement listed | Core or higher for JavaScript or iframes |
| Where you edit | Text in the block editor | Your design file, then an upload | The menu service's own editor |
| What guests get | The menu as text on your page | A file that opens or downloads | The service's menu on your page |
| Dish photos | Not covered in the block's help page | Whatever the PDF contains | Depends on the service |
| Allergens | Written into descriptions | Whatever the PDF contains | Depends on the service |
| Changing a price | Edit the line and save | Export and upload a new PDF | Change it in the service |
Squarespace's help on uploading files lists no plan requirement for linking a PDF. The Menu block suits a menu of names, descriptions and prices that you change often. A PDF suits a menu that's already designed and rarely changes. An embedded menu suits a restaurant on Core or higher that wants a photo for every dish or dietary filters, from a service that offers them.
How to add a menu with the Squarespace Menu block
The Menu block is Squarespace's own tool for restaurant menus. Its help page lists it on the Basic, Core, Plus and Advanced plans, and describes it as an alternative to embedding PDF menus. Squarespace's guide to building a restaurant site says all the text in a Menu block is indexable by search engines, and points to its menu sections and page layouts, which include a Menu block.
To add one to an existing page:
- Edit the page where your menu should go.
- Hover over a section, click Add block or +, then click Menu.
- Click the pencil icon on the block to open the block editor.
- In the Content tab, replace the sample text with your menus, sections and dishes.
- In the Design tab, choose Centered for a single column, which suits a short menu, or Multi-column. Pick your currency symbol in the same tab.
- Save the page, then open it the way a guest would.
How to type your menu in the Menu block
You type the whole menu as plain text, and Squarespace lays it out. Press Return after every entry, and don't use the space bar to line things up. These are the rules from Squarespace's help:
- A menu is its name, with at least three equals signs (
===) on the line below. An optional description goes under the equals signs. - A section is its name, with at least three hyphens (
---) on the line below. An optional description goes on the next line. - A dish is its name, then its description on the next line, then its price on the line after. The currency symbol goes first.
- For price variants, such as a glass and a bottle or a full and half portion, put a slash between the prices.
- For a market price, type
$MKTor$Market Priceas the price. - For options or add-ons, type
+on a new line below the price. - If a section has an odd number of dishes, add
<br/>at the bottom of that section to even out the columns.
Here is a dinner menu with one section, typed that way:
Dinner
===
Served from 5pm
Starters
---
Crispy calamari
Lemon aioli, sea salt
$14
Oysters on the half shell
Mignonette and lemon. Contains shellfish.
$MKT
The block editor's Formatting Help tab, on a computer, shows Squarespace's own examples. Check your first section against it before you type the rest.
If you type more than one menu into the block, such as lunch and dinner, Squarespace turns them into navigation so guests can switch between them. For several long menus, the restaurant guide suggests giving each its own page with a Menu block and grouping those pages in a dropdown.
How to keep a Menu block current during service
When the kitchen runs out of something at 7:30, edit the page, delete that dish's lines or add "sold out" to its description, and save. When a price changes, you change one line of text.
Allergens go in the description as plain words, such as "Contains walnuts." A guest who wants to know about nuts can then check before they come in, and your staff can read the same line.
To paste a menu you already have in a document, use keyboard shortcuts. Squarespace's help says right-click paste doesn't work in Menu blocks, so use Ctrl+Shift+V on Windows or ⌘+Shift+V on a Mac. If a section or the layout breaks after pasting, check that each marker line has at least three equals signs or three hyphens.
What a Squarespace Menu block shows
The Menu block shows text: dish names, descriptions, prices, variants and add-ons, in the Centered or Multi-column style. Its fonts and colours come from your site styles, and Squarespace's restaurant guide describes these menus as blending with your site's design. The block's help page describes a text menu and doesn't cover photos or dietary filters inside it. A photo for every dish, or filters a guest can tap, come from an embedded menu, the third way below.
How to link a PDF menu on Squarespace
If your menu already exists as a designed PDF, you can link to it from text or a button. Squarespace's help on links names PDF menus as one of the files its File link option is for.
- Add a text block, or click into existing text, and type the words guests will tap, such as "See our dinner menu".
- Highlight the words, then click the link icon in the text toolbar.
- In the link editor, choose File, click the upload icon and pick your PDF. Each file can be up to 20 MB.
- Turn on Open link in new tab if you want the menu to open in its own tab.
A button block links to a file through the same link editor. When a guest taps the link, the PDF opens in their browser or downloads, depending on their browser and its settings (Squarespace).
Updating a PDF takes more steps. Each price change means editing the original, exporting a new PDF and uploading it. Squarespace assigns every file's address automatically, and the address can't be changed, so you point your link at the new file each time (Squarespace).
A date in the file name makes the right one easy to pick from the Recently uploaded list. For a fuller look at what a PDF does well and what a menu page adds, see PDF menu vs. online menu.
How to embed a menu in a Squarespace Code block
An embedded menu comes from a separate menu service. The service gives you a snippet of code, and you paste it into a Code block on your menu page. Squarespace's Code blocks help says JavaScript and iframes in a Code block need the Core, Plus or Advanced plan.
- Edit the page where your menu should go.
- Hover over a section, click Add block or +, then click Code.
- Click the pencil icon on the block to open the block editor.
- Paste the snippet into the text field.
- Set the Mode menu to HTML. In CSS or JavaScript mode, Squarespace shows the code as text.
- Leave Display Source off. That toggle displays code on the page as a snippet.
- Save the page.
Squarespace notes that custom code can change how a site looks or behaves, especially on phones. Its support team can't help you add custom code or troubleshoot it, so for help with a snippet, ask the service that gave it to you.
Why your embedded menu is hidden while you're logged in
Squarespace says that, as a security measure, code sometimes doesn't appear while you're logged in, even when visitors can see it. To see the embed while you're logged in, click Preview in Safe Mode (Squarespace). You can also open your site's address in a private or incognito window, which Squarespace's code injection help suggests for viewing a site with custom code.
If a Code block stops you editing the page, disable scripts in preview, then edit or remove the code. Squarespace says disabling scripts in preview doesn't change what visitors see.
Where MenuFramer fits on Squarespace
MenuFramer is one of these embedded menus. You keep your Squarespace site, paste one snippet into the Code block on your menu page, and guests get a photo per dish, search, and dietary and allergy filters. Both of our embeds need a plan that allows JavaScript and iframes, which on Squarespace means Core or higher. We haven't tested whether a Code block runs our script inside your page, so we make no claim about search on Squarespace: contact us and we'll check your setup, or read how to put MenuFramer on your website.
Which Squarespace plan you need for a restaurant menu
Squarespace's current website plans are Basic, Core, Plus and Advanced (Squarespace). For what each costs, see Squarespace's pricing page. This is what each plan allows for a menu, from Squarespace's help pages:
| What you want to add | Basic | Core | Plus | Advanced |
|---|---|---|---|---|
| Menu block | Yes | Yes | Yes | Yes |
| Code block with HTML and CSS | Yes | Yes | Yes | Yes |
| Code block with JavaScript or iframes | No | Yes | Yes | Yes |
| Code injection, site-wide and per page | No | Yes | Yes | Yes |
Some older billing plans have their own lists, so check your plan in Squarespace if you're on one. On Basic, you can use the Menu block or a PDF link. An embedded menu that uses JavaScript or an iframe needs Core or higher.
How to check your menu on your phone
Open your menu the way a guest would, on a phone. In the editor, Squarespace's device view gives a phone-sized preview: on version 7.1 sites, click the Mobile View icon in the top-right corner of the site preview frame.
Squarespace says device view gives a general idea and isn't exact on every phone or tablet. So open the published page on your own phone too. If you used a Code block, do that in a private window or while logged out, because code can be hidden while you're logged in.
On your phone, try these:
- Find a starter and its price without zooming in.
- Find every dish that contains nuts, the way a guest with an allergy would.
- Tap your PDF link, if you have one, and see whether it opens or downloads.
- Change one price, save, and reload the page to check the new price shows.
Frequently asked questions
Can I add photos to a Squarespace Menu block?
Squarespace's help page for the Menu block describes a text menu of names, descriptions, prices, variants and add-ons. It doesn't cover adding photos inside the block. If you want a photo beside every dish, that comes from an embedded menu service that supports photos, which needs the Core plan or higher if it uses JavaScript or an iframe.
Which Squarespace plan do I need for custom code?
Basic lets you use HTML and CSS in Code blocks. JavaScript and iframes in a Code block need the Core, Plus or Advanced plan, and so does code injection. Ask your menu service what its snippet contains if you're not sure which applies.
Why doesn't my code show when I'm logged in?
Squarespace sometimes hides code while you're logged in, as a security measure, even when visitors can see it. Click Preview in Safe Mode to see it, or open the page in a private browser window. If the code stops you editing, disable scripts in preview and fix or remove it.
Can Google read the Squarespace Menu block?
Squarespace says all the text in a Menu block is indexable by search engines. Indexable means the menu is eligible to appear in search, and nobody can promise where or when it shows. Our guide to restaurant menu SEO covers what Google documents about menus.
How do I update a PDF menu on Squarespace?
Edit the original file, export a new PDF and upload it through the link editor's File option. Squarespace assigns file addresses automatically and they can't be changed, so point your link or button at the new file. Then tap the link on your phone to check you see the new version.
Can I show lunch and dinner menus separately?
Yes. Type each as its own menu in the same Menu block, with === under each name, and Squarespace turns them into navigation guests can switch between. You can also put each menu on its own page with a Menu block and group those pages in a dropdown.
Sources
- Menu blocks, Squarespace Help Center, checked October 2026
- Building a restaurant site, Squarespace Help Center, checked October 2026
- Add custom code to a page with code blocks, Squarespace Help Center, checked October 2026
- Customize parts of your site with code injection, Squarespace Help Center, checked October 2026
- Choose the right Squarespace plan, Squarespace Help Center, checked October 2026
- Add links to your site, Squarespace Help Center, checked October 2026
- Creating text links, Squarespace Help Center, checked October 2026
- Upload, rename, and delete files on your site, Squarespace Help Center, checked October 2026
- Device view, Squarespace Help Center, checked October 2026
- Creating QR codes, Squarespace Help Center, checked October 2026
- Squarespace pricing, Squarespace, checked October 2026
