Squarespace: Embedded form

  • Profile Image
    williamsfitness
    Asked on March 25, 2018 at 11:28 AM

    Hello, I have tried everything I know to get my forms to show up correctly on my website. Fields will not show, the form "space" is way too long, it doesn't look the same way on my website as it does when I create it... I'm just having difficulty. I really like the forms and have been using them for a while, but I'm really having a lot of difficulty getting them to behave properly. 


    Thanks so much. 

  • Profile Image
    Mike
    Answered on March 25, 2018 at 01:34 PM

    Thank you for contacting us.

    Please provide us with a link to the web page with your embedded form, so we will be able to take a look and advise.

  • Profile Image
    williamsfitness
    Answered on March 26, 2018 at 02:31 PM

    My website is not live... It's a redesign. I have multiple embedded forms and some work, some don't. I'm using Squarespace and have tried multiple ways to embed.

    One of the forms... I have a transparent background and frame, but I can still see the outline. Not sure why. Sometimes the submit will show and other times it won't. Should I enable scrolling? 

    1522088756Screen Shot 2018-03-26 at 1.25

     

    Another shorter form... If I add an image to the header it is all messed up on my site. :( 

    1522088903Screen Shot 2018-03-26 at 1.27

    Which code is the best? I do adjust the height and make it super long enough. When I use the form link to embed - the box is HUGE and there is no way to readjust. It seems like the box should be the size of the form. This is using one of the embed codes and the box is still very large.

    1522089033Screen Shot 2018-03-26 at 1.30

    Of course the preview goes away, but that is the box and is the size it is on my website. Makes it difficult to do much beneath it. 

    Thank you!

  • Profile Image
    aubreybourke
    Answered on March 26, 2018 at 03:33 PM

    You should try using this guide:

    Adding-a-form-to-Squarespace


  • Profile Image
    williamsfitness
    Answered on March 26, 2018 at 03:36 PM

    Thank you, but that's exactly what I am doing... all day, every day. Did you read all that I wrote in my reply??? Anything else ya got? All that I provided, and nothing but reference to a guide? 

  • Profile Image
    aubreybourke
    Answered on March 26, 2018 at 04:57 PM

    You can try the iFrame method. That usually solves most problems with embedding. 

    Getting-the-Form-iFrame-Code

    If that doesn't work you can try removing everything between (and including) the <script> and </script> tags.

    If that doesn't work you can now attempt adjusting the height value in the <iframe> section. If its too small increase the height, save and load the page again. Repeat this step until the height is correct.

  • Profile Image
    williamsfitness
    Answered on March 26, 2018 at 09:40 PM

    Thanks for this help... I will give the iframe code another shot. I hadn't tried removing anything between those two tags. Anything on why the box itself is much bigger than the form? Is that just the way it is? 

  • Profile Image
    ashwin_d
    Answered on March 27, 2018 at 03:35 AM

    That could be because of the height of the iFrame embed code. Please note that when you add a iFrame embed code, it has height attribute in the style code of iframe. It also has script code as well which adjust the height of the iFrame dynamically. 

    If the issue persist, we would like to see the issue in your webpage to be help you resolve it. I would suggest you to please share the webpage URL where you have embedded form and we will take a look.

    We will wait for your response.

  • Profile Image
    williamsfitness
    Answered on March 28, 2018 at 02:19 PM

    It seems to work on my website on the desktop version. You can try this direct link to my site and there are many forms throughout. It is not live yet, but this should take you to the main page. https://www.lisamillicentwilliams.com/welcome/    

    This is a screen shot from one of my forms while checking the mobile application. To change the form dynamically, would I use the suggestion above? Thanks!

    removing everything between (and including) the <script> and </script> tags.


    1522260668Screen Shot 2018-03-28 at 1.10

  • Profile Image
    aubreybourke
    Answered on March 28, 2018 at 02:26 PM

    You can try adding height to your iframe code. Just add 100px to what is already there. So if its 500px, change it to 600px.

    Save and load the page again. If it needs more height add another 100px. Continue like this until the form is the correct size.