Your quote form already works on its own page. Putting it on your website means pasting a short snippet where your site accepts HTML, and almost every site builder has a place for that. Below are the steps for the common ones. What the form shows and how requests reach you is set in Shr3Dt, as Add the quote form to your website explains.
Before you start
- In Shr3Dt, open Settings, then the Quote form tab. Under “Your public quote form” you'll find your form's address and the snippet, ready to copy, with your shop's own address in it instead of
your-shop. - Open the address in a browser and try the form once, so you know what visitors will see.
- Make a page for it on your site, for example “3D printing quote”, and put a link to it in your menu.
The snippet looks like this:
<iframe
id="shr3dt-quote-form"
src="https://shr3dt.com/your-shop/request-quote"
style="width: 100%; height: 500px; border: 0;"
title="Get a 3D print quote"
></iframe>
<script>
window.addEventListener("message", function (e) {
if (e.data && e.data.type === "shr3dt:resize") {
var f = document.getElementById("shr3dt-quote-form");
if (f && e.source === f.contentWindow) f.style.height = e.data.height + "px";
}
});
</script>The frame starts 500 px tall and the script grows it to fit the form as customers add parts, so there's never a scrollbar inside it. Paste it as it is: there are no keys to add and nothing to set up on our side, whatever your domain.
WordPress
Block editor
- Open the page and click the + where the form should go.
- Search for Custom HTML and add that block.
- Paste the snippet, click Preview to see the form, then Update or Publish.
In the classic editor, switch to the Text tab (not Visual) and paste it there.
Elementor, Divi and other page builders
- Elementor: drag the HTML widget onto the page and paste the snippet into its code box.
- Divi: add a Code module and paste the snippet.
- WPBakery: add a Raw HTML element.
- Beaver Builder: add an HTML module.
Wix
Wix shows embedded code inside a frame of its own, so the snippet can't resize it. Give the form its own address and a fixed height instead:
- In the editor, open Add Elements, then Embed Code, and choose Embed a site.
- Click the new element, choose Enter Website Address, paste your form's address (the
https://shr3dt.com/…/request-quoteone) and click Apply. - Stretch the element to the full width of the section and drag its bottom edge down to about 1600 px. The form scrolls inside it if a customer adds many parts.
- Check the mobile view too, and make the element tall there as well.
In Wix Studio the same element is under Add, then Embed & Social.
Squarespace
- Edit the page and click Add block (or the + in a section).
- Choose Code, paste the snippet, and leave the mode on HTML.
- Turn off Display Source if it's on, then save the page.
Squarespace runs scripts and frames in code blocks on its Core plan and above (Business and Commerce on older plans). On the Basic plan the block stays empty, so use a button instead.
Shopify
- In your Shopify admin go to Online Store, then Pages, and add a page, for example “3D printing quote”.
- Go to Online Store, then Themes, and click Customize. From the page menu at the top, open Pages and create a new template, for example “quote”.
- In that template click Add section, choose Custom Liquid, paste the snippet and click Save.
- Back on your page, under Theme template, choose the new template and save.
A template of its own keeps the form on this one page rather than on every page of your store.
Webflow
- Open the page in the Designer and press A (or the + button) to open the Add panel.
- Drag a Code Embed element where the form should go.
- Paste the snippet, click Save & Close, then publish the site.
The Designer may show a grey box: the form appears on the published site. Code Embed needs a paid site plan.
Joomla
- Go to Content, then Site Modules, click New and choose Custom.
- Click Toggle Editor so you see plain HTML, and paste the snippet.
- Pick a position on the page, assign the module to your quote page's menu item, and save.
If Joomla removes the frame on save, open System, then Global Configuration, then Text Filters, and set your own user group to No Filtering.
Google Sites
Like Wix, Google Sites keeps embeds in a frame of its own, so use the fixed-height version:
<iframe
src="https://shr3dt.com/your-shop/request-quote"
style="width: 100%; height: 1600px; border: 0;"
title="Get a 3D print quote"
></iframe>- Click Embed in the Insert panel, choose the Embed code tab, paste the code above with your own address, then Next and Insert.
- Drag the box's bottom edge down so the whole frame shows, then publish.
Your own HTML
If you or your developer write the site by hand, paste the snippet into the page's body where the form should appear. If your site sends a Content Security Policy, allow the frame with frame-src https://shr3dt.com.
Other builders
GoDaddy, Hostinger, Jimdo, Square Online and most others have an element called something like Embed, HTML, Code or Custom code. Paste the snippet into it. If the form shows with a scrollbar or cut off, the builder keeps embeds in a frame of its own: use the fixed-height version from the Google Sites steps and make the element tall.
Or link to the form with a button
Not every site takes embedded code, and you may simply prefer a button. Your form's address works as a page of its own, on phones too, so any button can open it: put the address in your builder's button or menu link. If you're writing HTML:
<a href="https://shr3dt.com/your-shop/request-quote"
style="display: inline-block; padding: 12px 22px; border-radius: 8px;
background: #6e3ead; color: #fff; font-weight: 600; text-decoration: none;">
Get a 3D print quote
</a>Check it works
- Open your page on a computer and on a phone. The whole form should show, with no inner scrollbar on the snippet version.
- Upload a test file and check the price appears.
- Send a request with your own email address. It arrives in Quotes marked “website”, your team gets an email, and so do you as the customer. Delete or reject the test request afterwards.
If something's wrong
- The frame is empty or says it refused to connect: check the address starts with
https://and has your shop's own part, exactly as Settings shows it. - The form is cut off or scrolls inside the frame: the script didn't run. Either the builder removed it (paste the snippet again where scripts are allowed) or it keeps embeds in its own frame (make the element taller).
- The block vanishes when you save: your plan or user role doesn't allow frames. Use the button instead.
- Two forms on one page: paste the snippet only once per page; it looks for the frame by its id.
Stuck with a builder not listed here? Send us a message with its name and we'll help.
