<!– Scaile Lead-Form Embed — drop into a WordPress Custom HTML block –> 

<div id=”scaile-form-container” 

     data-label=”general”   <!– change to the label you need –> 

     data-lang=”EN”>        <!– change to the language you need –> 

</div> 

 

<script> 

(function () { 

    // — Configuration pulled from the container’s data-attributes — 

    var container = document.getElementById(‘scaile-form-container’); 

    var label = container.getAttribute(‘data-label’) || ‘general’; 

    var lang  = container.getAttribute(‘data-lang’)  || ‘EN’; 

 

    // — Build the “port” (sub-domain) value the original component used — 

    var hostname       = window.location.hostname.replace(/^www\./, ”); 

    var port           = hostname.split(‘.’)[0]; 

 

    // — Compose the iframe URL exactly as before — 

    var url = ‘https://forms.scaile.it/’ 

            + ‘?label=’ + encodeURIComponent(label) 

            + ‘&lang=’  + encodeURIComponent(lang) 

            + ‘&port=’  + encodeURIComponent(port); 

 

    // — Create & inject the iframe — 

    var iframe = document.createElement(‘iframe’); 

    iframe.id   = ’embeddedWebApp’; 

    iframe.src  = url; 

    iframe.style.width  = ‘100%’; 

    iframe.style.height = ‘400px’;  // initial height (will auto-update) 

    iframe.style.border = ‘none’; 

    container.appendChild(iframe); 

 

    // — Listen for height updates sent from the embedded form — 

    function receiveMessage (e) { 

        if (e.data && e.data.type === ‘heightUpdate’) { 

            iframe.style.height = e.data.height + ‘px’; 

        } 

    } 

    window.addEventListener(‘message’, receiveMessage, false); 

 

    // — Once the iframe loads, ask it to report its height — 

    iframe.onload = function () { 

        iframe.contentWindow.postMessage({ type: ‘requestHeight’ }, ‘*’); 

    }; 

})(); 

</script>