Embed BATS lead form on your website

Instead of building your own lead form you can embed BATS lead form onto your website to collect leads and have the lead information submitted directly into your BATS account.

To do this you have to add an "Inline Frame" (iframe) on your web page that will display the embedded form.

Your website should always be served from a SSL connection (encrypted). This is a requirement for embedding the lead form.
There are 4 variables that must be passed to the lead form in the source URL:

ref - this variable is required and must contain the AuthCode for the lead source that is configured to receive these leads in BATS (in BATS go to Setup > Sources > click on the lead source that was set up to receive the leads and copy the Authorization Code to use for this variable)
buttoncolor - this variable is optional, if provided it must have a hex color code for the color of the "submit" button
buttonbgcolor - this variable is optional, if provided it must have a hex color code for the color of the text on the "submit" button
formbg - this variable is optional, if provided it must have a hex color code for the color of the background of the form

This iframe should be 500 px tall and 398 px wide.

Here is sample code for the iframe:

   
    
     
      <iframe id="frame-73" src="https://leadform.batscrm.com/?ref=abcd-efgh-ijkl&buttoncolor=fff&buttonbgcolor=009688&formbg=82b1ff" border="0" style="min-height: 500px; width: 318px;"></iframe>

Also add the following script before the closing "body" tag ( </body>) on the web page that is hosting the iframe:

    
     
      
       <script type="text/javascript"> receiveSize = function(e){ if(e.origin === "
       https://leadform.batscrm.com/
       " || e.origin === "
       https://leadform.batscrm.com/
       "){
       

      
      
        if(e.data.method == "adjust_height") { var newHeight = e.data.height + 2; document.getElementById("frame-73").style.height = newHeight + "px"; } } } window.addEventListener("message", receiveSize, false); </script>