How to add a quote request cart to a Squarespace store

The install guide for Stak Quote Cart. Around fifteen minutes, most of it spent in Squarespace rather than here.

All install guides

Before you start

Your site must be on a plan that allows custom code — Business, or one of the Commerce plans. Squarespace blocks code injection on Personal and Basic, so nothing of this kind can run there. Check under Settings, then Billing, if you’re not sure.

Your items must be Squarespace products. Quote Cart runs on Squarespace 7.1 Commerce — your shop pages and your product pages. It does not run on blog collections, gallery collections, events, or Squarespace 7.0. If your items are blog entries rather than products, Stak Shortlist is the one that fits.

It is not a checkout. Quote Cart does not take payment, calculate tax or shipping, or write orders into Squarespace Commerce. It collects what someone wants and sends it to you as an enquiry.

You’ll paste two blocks of code into two different places. They are not interchangeable, and swapping them is the most common install problem — the symptom is that nothing happens at all.

Block	Where it goes
Block 1	Code Injection, Footer box. Runs site-wide.
Block 2	A Code Block on your quote page.

Each block says which one it is in its first three lines.

The customiser needs one product address, and it works the rest out from there. Unlike a blog collection, every Squarespace product page sits under /p/, so there is no path for you to assemble.

1. In the address bar, type your domain followed by your shop page’s slug, e.g. yoursite.com/shop
2. Click into any one product
3. Copy the whole address from the bar

It will look something like yoursite.com/shop/p/blue-widget. Anything containing /config/ is the Squarespace editor, not your site. The customiser will reject it and tell you so.

Open the customiser link from your purchase email.

Where it runs. Paste the product address from step 1 into the first field. Paste the whole thing — the part that matters is extracted for you. A grey line underneath confirms what it resolved to.

Two more paths on the same panel:

• Your quote page — the page that will hold your form. /quote unless you change it. You make this page in step 4.
• “Browse the shop” links to — optional. Shown on the quote page when someone arrives with nothing saved.

How it behaves. Three decisions, and they are the ones worth thinking about:

• Beside Add to Cart, or instead of it. Beside keeps your store selling normally and offers a quote as a second path, for the customers who need a price first. Instead hides Add to Cart entirely, for catalogues where nothing has a fixed price. It is a setting, not a rebuild — you can change your mind.
• Prices in the quote, or items only. Line prices and an estimated total travel with the enquiry, or they don’t. If your list prices are not your quoted prices, leave them out.
• If they save without choosing an option. The default refuses the save and highlights the options. The alternative accepts it and marks the line “Options to be confirmed”. Refusing is recommended — a quote full of unspecified sizes is work for you, not for them.

Look. Pick an icon, a colour, which corner the save button sits in on your shop grid, and which side the quote panel opens from.

The enquiry form. The field label here must match a field you’ll add in step 5, exactly. The default is Quote request.

Wording. Optional. Every word of the interface can be changed or translated here.

Download your file when you’re done. You have 30 days to come back and adjust anything while you’re getting set up.

1. Website → Pages
2. Scroll past every page in the list to the bottom
3. Website Tools → Code Injection
4. Find the Footer box. Not Header
5. In your downloaded file, find BLOCK 1 and copy from the <!-- beneath it down to the final </script>
6. Paste into the Footer box and save

1. Add a new page at the path you set in the customiser — /quote unless you changed it
2. Leave it out of your navigation. People arrive from the quote panel, not from the menu
3. Add a Code Block, above everything else on the page
4. Copy BLOCK 2 from your file and paste it in

The block will look like nothing much in the editor. That’s expected — it fills itself in on the live site.

1. Add a Form Block directly underneath the Code Block, on the same page
2. Add whatever fields you want — name, email, company, delivery date
3. Add one more field, a Text Area, labelled exactly Quote request (or whatever you set in the customiser)
4. Point the form wherever your enquiries already go

That field is what Quote Cart writes into — product names, chosen options, quantities, line prices and links, as plain text. It fills when the page loads and locks so visitors can’t edit it. Everything else about the form, and where it sends, stays yours.

Open one of your product pages on your live site, not in the editor preview. Code injection behaves differently inside the editor and may not run at all.

• A save button beside Add to Cart, matching its font, size and shape
• A save button in the corner of each card on your shop grid
• Choosing a size or colour changes the price, and the save button follows that choice
• A counter appearing once you’ve saved something
• The counter opening a panel with your saved products, their options and quantities
• Your quote page listing them, with the form field filled in

If nothing happens

Open your live site, press F12 (or Cmd-Option-I on a Mac), click Console, paste this and press Enter:

document.documentElement.outerHTML.indexOf('STAK_QUOTECART_CONFIG')

It returns -1

Block 1 isn’t on the page. Either it didn’t save, it went in the Header box instead of Footer, it went into a single page’s settings rather than the site-wide panel, or the plain-text header from the file got pasted in with it.

It returns a number, but no button appears

Block 1 is running but doesn’t think it’s on a product page. Paste this:

StakCommerce.debug()

It prints what the plugin can see on the page it is on. The two lines to read are isProductPage, which should be true on a product page, and addToCartFound, which should also be true. On a shop grid, gridCards should be the number of products you can see.

The save button appears but the price is wrong

If a product is priced per option, its page shows a starting price until an option is chosen — from $115.60 rather than a figure. Quote Cart carries that through as a starting price and labels it as one. Choose an option and the price should resolve.

The save button works but the form field stays empty

The label doesn’t match. Paste this and compare it word for word against the label on your form field:

window.STAK_QUOTECART_CONFIG.formFieldLabel

Capitals and apostrophes count. The (required) marker Squarespace adds does not.

Both plugins are installed and the counters overlap

They shouldn’t — Quote Cart measures Shortlist’s counter at runtime and stacks above it, then drops back down if that one hides. If they are sitting on top of each other, check that both are set to open from the same side, and send me a screenshot.

Things worth knowing

Quotes live in the visitor’s browser. No account, no login, nothing stored on your site or ours. The same person on a different device is a different visitor, unless they use the share link.

Nothing phones home. There’s no licence key and no check against our servers. The code runs entirely on your site.

Your cart still works. Unless you chose to hide Add to Cart, Squarespace Commerce carries on exactly as before. Quote Cart sits beside it and touches nothing else.

Compatibility. Updates for Squarespace changes are included for twelve months from purchase, then they’re a paid update. Bugs in what we shipped are fixed free, whenever they turn up. Your version keeps working either way.