![]() I have prepared some JavaScript code that solves the problem. That post contains some great sample code for making your forms look good. Note: The animation of the Pardot form above is using a form from a post by Alex Avendano at EBQ, on customizing the design of Pardot forms. What we want is for the form’s iFrame to grow vertically so that all the content shows up. ![]() This GIF shows an iFrame bar appear after the embedded form’s content gets taller Note what happens when the form is submitted with missing information: several error messages appear and add a distracting scrollbar at the right side. When that happens, an unattractive scrollbar gets added next to the content – and the content no longer looks like it is a natural part of the parent webpage.īelow is an example of a Pardot marketing form that’s been embedded using an iFrame. Also, their height can change unexpectedly. The problem with iFrames is that you don’t always know their full height. Normally, I would put code like this onto the page so the form appears in an iFrame: The problemĪs a Marketing Operations professional, I often need to put marketing forms onto webpages. ![]() The code works for cross-domain iFrames and does not use any libraries like jQuery. iFrame height will adjust based on the height of the content in them. This page contains freely-usable code for responsive iFrames. Do you need to ensure your iframe’s height is always set to 100% of the height of the content you are embedding? If so, keep on reading. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |