JotForm User Guide / Card Forms /

Using the Inline Embed Features in Card forms

Using the Inline Embed Features in Card forms

After embedding your form to a webpage, do you ever feel that it needs some design adjustments? If your answer is yes, you can easily do that by utilizing the inline embed features of the Card Forms. 

In order to use our new Inline Embed features, you need to make sure that:

1: Your form was built using the Card Forms layout.

2: Your form is embedded using the script method.

The default embed option in our form builder is the script method. Check this guide for more information:  Adding a Form to a Web Page

After embedding your card form to a website, you will see a blue PENCIL icon at the top of your form. Click on it to open the inline embed settings. Please note that only you (as the form owner) can see that icon.

 There you will see a variety of embed options. 

There are two tabs in the inline embed settings. 

DESIGN and OPTIONS. If we go step by step for what is included in the DESIGN tab.

  1. FORM TITLE OPTIONS: To change the size of the title.
  2. FORM BACKGROUND COLOR: You can choose from pre-added colors, or choose a new color for the background. To choose a new color, click the white square at the bottom right.
  3. CARD COLOR OPTIONS: The color of the form bar and the border can be changed from here

OVERVIEW BUTTON COLOR OPTIONS: You can customize the colors of your form's overview button.

In the OPTIONS tab, choose the visibility of the design elements of your form.

If you mark the option "Show only Card and hide all other elements" the other options in the image above will be automatically unticked, and the form will only display the card. You can set the visibility of these items according to your needs.

Note: Do not forget to click on Save after you make a change in the inline settings.

Also, there is a SMART EMBED OPTION which is also only available for Card Forms layout. You can enable it to make the design of the form match the design of the website where this is embedded. For more information about the Smart Embed feature, you can check the guide : How to Enable the Smart Embed Feature in JotForm Cards?

Do you have suggestions regarding to this feature? Do not hesitate to click on the Help us to Improve button to send us your feedback.

Also if you have questions, you can always reach us through our support forum or by dropping a comment below!

Send Comment

2 Comments...

  • vicleeg

    I used the pencil option to change the height of the form and must have changed it too much Now I only see the very tip of the form and no pencil to correct the height. How can I fix this. Is there a reset option that doesn't require the pencil to show?

  • GLtenn2019

    Hello, I am trying to embed a form to my site using the embed script. I am not getting the options described above. Is there another step that I need to do in oder to get this to work?