Embedding a Google Form into Shopify page

Store Design
1

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

2

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;
    }
3

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.