Is there a way to reduce/remove the padding around the form when using the Cards Layout?

  • EffieMcNair
    Asked on April 13, 2018 at 10:09 AM

    Hi There,

    Just wondering if there is a way to reduce or remove the background around the form. I would like to use the form itself without all the padding around if possible.

    1523628269jotforms Screenshot 10

  • Victoria_K
    Replied on April 13, 2018 at 12:00 PM

    Could you please provide us the page URL, where your form is embedded so we could take a closer look into this? 

    We will wait for your response. 

    Thank you.

  • EffieMcNair
    Replied on April 13, 2018 at 6:23 PM

    Hi There,

    I need to embed it in a few places throughout the website with different sizes/shapes. Here is an example: https://www.solarpowerpanels.net.au/solar-quote/ I don't want all this space from the top and around (I need to enter more text in there and it takes too much of the page.

    Also In some pages I want to be able to embed only the card without the background at all, as there is no room. To solve it I was using Popups...like HERE (in the top right corner "Your Solar Estimator"): but it would be much more attractive if I could just embed the card itself instead the popup.

    Thank you! Effie

  • Support_Management Jotform Support
    Replied on April 14, 2018 at 3:53 AM

    Hi Effie - I'm afraid the Cards Layout will always adapt with the container where it sits. Meaning, the padding can be minimized if you will place/embed the form within a relatively smaller container. It's mobile responsive so it will automatically resize itself, depending on the size of its container.

    Since you mentioned, specifically, that you don't want any backgrounds at all, will you be open to alternatives? The Cards Layout has a new embed feature called a FLOATING FEEDBACK BUTTON.

    Is there a way to reduce/remove the padding around the form when using the Cards Layout? Image 1 Screenshot 30

    Instead of using a link that opens the form as a popup, why not try this approach? This is how it should look like once embedded:

    Is there a way to reduce/remove the padding around the form when using the Cards Layout? Image 2 Screenshot 41

    It doesn't take up much space, less intrusive, and only displays the form itself without any background.

  • EffieMcNair
    Replied on April 14, 2018 at 4:50 AM

    Thanks for that - I like the idea with the floating feedback button - but unfortunately, it doesn't work for me...something is looking wrong. Only the 'welcome card' is looking great but this is where it ends!...

    this is the form that I tried https://form.jotform.com/80368192005857 (you can see the problem in Jotform's preview...before even taking it to the website)

    1523695614jotforms Screenshot 10

  • Victoria_K
    Replied on April 14, 2018 at 7:34 AM

    Unfortunately, when using the Image Theme, the Floating Feedback Button will always show part of your form background as the background for Next and Previous buttons. If the Floating Feedback Button option is acceptable, I suggest to change the background:

    1523704916screenshotsnvp8 Screenshot 10

    You can switch to Color Theme as well, since the background is not needed anymore:

    1523705448screenshotp3pcy Screenshot 21

    If you decide to leave the embedded form as it is now, it's Inline Embedding Settings will help you to resize the frame without re-embedding:

    1523705665Screenshot 2 Screenshot 32

    Hope this helps. 

  • EffieMcNair
    Replied on April 14, 2018 at 7:57 AM

    Thanks you Victoria - you have given me a lot of info and things to try! I'm sure now that I can do it one way or another! 

    Thanks again!

    Effie