Sign in

Embed a Google form into Publii page without shrinking the form

  • This topic has 1 reply, 2 voices, and was last updated 3 years ago by .
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #3826
    Avatar photogarys

    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 đŸ˜‰

Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.