Shopify Embed Instructions

Embed the Sumi Soaker Water Supply Calculator on any Shopify page using an HTML block.

Publish the Calculator

First, publish this calculator using the Publish button in the Manus dashboard. Once published, you'll receive a public URL (e.g., your-name.manus.space). Replace YOUR-MANUS-DOMAIN in the embed code with your actual domain.

Add a Custom HTML Block in Shopify

In your Shopify admin, go to Online Store → Pages
Create a new page (e.g., "Water Supply Calculator") or open an existing one
In the page editor, click Show HTML (the <> button)
Paste the embed code below into the HTML editor
Save and preview the page

Copy the Embed Code

<!-- Sumi Soaker Water Supply Calculator -->
<div id="sumi-water-calculator" style="width:100%;min-height:600px;"></div>
<script>
  (function() {
    var iframe = document.createElement('iframe');
    iframe.src = 'https://YOUR-MANUS-DOMAIN.manus.space/';
    iframe.style.width = '100%';
    iframe.style.border = 'none';
    iframe.style.minHeight = '700px';
    iframe.setAttribute('scrolling', 'no');
    iframe.setAttribute('title', 'Sumi Soaker Water Supply Calculator');
    iframe.setAttribute('loading', 'lazy');
    // Auto-resize iframe to content height
    window.addEventListener('message', function(e) {
      if (e.data && e.data.type === 'sumi-calc-height') {
        iframe.style.height = e.data.height + 'px';
      }
    });
    document.getElementById('sumi-water-calculator').appendChild(iframe);
  })();
</script>

Link from Product Pages

For maximum impact, add a link to this calculator from:

The Sumi Soaker collection page
Individual product pages for the Garden Hose Connector and Mainline Connector
All tubing SKU pages (R-Wide, Mark II)
The System Planner results page ("Not sure if your water supply can handle this?")

Optional: Pre-fill from System Planner

You can pre-fill the calculator with values from the System Planner by appending URL parameters. This creates a seamless handoff between the two tools.

https://YOUR-MANUS-DOMAIN.manus.space/?product=rwide&length=100&beds=4

product — rwide or markii

length — bed length in feet

beds — number of simultaneous beds