Embedding a Google Form into Shopify page

Embedding a Google Form into Shopify page

quiztrail
Explorer
61 0 17

Hi,

 

I have embedded a Google Form into my Shopify page, but it adds an extra scroll bar to the page when it is on a smaller mobile screen. How do I make my form so it is the whole length on both Desktop and Mobile - without the secondary scroll bar?

 

https://www.quiztrail.co.uk/pages/favourite-place-prize-draw

 

 

 

Replies 2 (2)

CodingFifty
Shopify Partner
613 97 116

Hi @quiztrail,


Go to Online Store, then Theme, and select Edit Code.
Search for base.css/theme.css/style.css/main.css/custom.css file Add the provided code at the end of the file.

 #shopify-section-template--24360276787576__main {
      --section-padding-top: 28px;
      --section-padding-bottom: 28px;
    }

    .responsive-iframe-container {
      position: relative;
      padding-bottom: 100%; /* Adjust for form's height */
      height: 0;
      overflow: hidden;
      max-width: 100%;
    }

    .responsive-iframe-container iframe {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      border: none;
    }
Coding Fifty || Shopify Partner
For any custom section queries, please visit: Fiverr Profile
Found my response useful? Like it and mark as Accepted Solution!
For additional discussions, reach out via: Email ID: codingfifty@gmail.com
quiztrail
Explorer
61 0 17

Hi CodingFifty,

 

Unfortunately the second scroll bar is still showing even though I have added this code. Do you know why it isn't working for me?

 

Thank you.