Insert form from Form Builder into...

User 2088934 Photo


Registered User
4 posts

I am just getting started with CSS grid. I have a form that I have built in Form Designer, how do I add that onto a page in CSS grid?
User 244626 Photo


Registered User
811 posts

Here is the link to the instructions on how to embed the form into a HTML element and add the required script to the footer.
https://www.coffeecup.com/help/articles … -designer/

(Interesting tidbit that the instructions show RSD3 as the example being used which appears to be the same layout as CSS Grid)
Bootstrap 5 CSS Grid.
User 2706435 Photo


Ambassador
444 posts

I believe Coffeecup as said that Grid Builder will be a part of RSD 3.0.
User 244626 Photo


Registered User
811 posts

Mike Walton wrote:
I am just getting started with CSS grid. I have a form that I have built in Form Designer, how do I add that onto a page in CSS grid?


Just a additional clarification, the process is to build the form in both form designer and form builder and combine the features by uploading it according to the initial instructions. When you have the link to the form working, you can the add the link into a html element that will be in your CSS Grid project which is bascially a Iframe. Remember to add the script to the footer also in CSS Grid. You can then publish the project.


<style>
#form-iframe {
width: 1px;
min-width: 100%;
border:none;
background:transparent;
}
</style>
<iframe id="form-iframe" src="http://bertus-forms.coffeecup.com/" scrolling="no"></iframe>


Footer script


<script src="https://cdnjs.cloudflare.com/ajax/libs/iframe-resizer/3.5.16/iframeResizer.contentWindow.min.js"></script>
Bootstrap 5 CSS Grid.
User 244626 Photo


Registered User
811 posts

BIll G wrote:
I believe Coffeecup as said that Grid Builder will be a part of RSD 3.0.


And Form Designer has the Grid Layout option along with the Element States Selector Layout too...
Bootstrap 5 CSS Grid.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.