Download
We're evolving to serve you better! This current forum has transitioned to read-only mode. For new discussions, support, and engagement, we've moved to GitHub Discussions.

Embed a Google form into Publii page without shrinking the form

  • #3826
    Avatar photo[anonymous]

    Dear Community,

    after some research and playing I may need a hand here. I’ve been trying to embed a Google form to a Publii page using the Simple v2.2.3.0 theme. However the form gets shortened by Publii, even I set the height to 100%. Switching off the scrolling just simply prevents me from completing the form as I can’t see the end. As you can see I’m not really in Web deveopment but ideal would be to see the whole form as is (by expanding the page itself) and being able to scroll in Publii.

    The iframe code provided by Google is:

    <iframe src="https://docs.google.com/forms/d/e/1FAIpQLSdF6VaNl7TfkalOIwjLBRuetx61xBb-eovL49vxnAO_vbjJyA/viewform?embedded=true" width="640" height="1599" frameborder="0" marginheight="0" marginwidth="0">Loading…</iframe>

    I put together a TEST page to demonstrate it. You can also find this form under the Contact/Form menu.

    Has any of you done similar in the past? Any advice s highly appreciated. Thank you.

    G.

    P.s: OMG this Publii platform makes life pretty easy. It’s just awesome!

    #3829
    Avatar photo[anonymous]

    Hi,

    You will need to set the height of the Google form iframe in the custom CSS Publii option, and also add a custom class to its container (will prevent aplying style to all site iframes)

    Something like this should help you as starting point:

    .post__iframe.myCustomClass > iframe {    
        position: relative;    
    }
    
    .post__iframe.myCustomClass{ 
      height:1600px;
    }

    Also you may need to play a little with media queries, Iframe height will change depends on screen sizes.

    PS: sorry for my english 😉