Embedding for the best phone user experience... | Community
Skip to main content
Answered

Embedding for the best phone user experience...


Any Suggestions on which format to use to have a simple and seamless user experience on the phone. The type form is really the only thing that needs to be displayed when the user is completing the survey on the phone. I currently have the form in a Lightbox... I’ve used the standard version, but it shows both the page scroll bar and the form scroll bar which is confusing my users and causing them to be frustrated. Any help here would be appreciated...

Best answer by Liz

Hi @Casey Since the embedded typeform is within an iframe (that needs to scroll), there’s no way to actually remove the scrollbar. There are a few options if you’d like to remove the scrollbar: 

  1. You could use some CSS to hide the scrollbar by creating a wrapper to go over the scrollbar. Though, it’s important to note the scrolling functionality will still work, but the bar will be hidden from view. 
  2. Expand the height of the form to prevent scrolling. When the form has a smaller height, the scroll bar appears. You can do this by searching for the “height” in the embed code and increasing the pixels. 

Would either of these help? :) 

View original

11 replies

vickioneill
Forum|alt.badge.img+5
  • Tastemaker
  • 320 replies
  • March 2, 2021

Hi @Casey ,

Are you using a link to Typeform for the survey or are you embedding the code in your website (or lead pages, etc.)?


  • Author
  • Explorer
  • 3 replies
  • March 2, 2021

Hi Vicki...thanks for the reply. I’m embedding the code into a Wix website.


vickioneill
Forum|alt.badge.img+5
  • Tastemaker
  • 320 replies
  • March 2, 2021

I use Wix as well, @Casey. My quiz shows up on mobile with scroll bars which is not ideal.

I couldn’t figure out how to fix it but this is a great community where someone like @Liz or @Mariana might be able to assist? 


  • Author
  • Explorer
  • 3 replies
  • March 2, 2021

Thank you. I’ll reach out. Should I send them a note individually?


Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • 14840 replies
  • Answer
  • March 2, 2021

Hi @Casey Since the embedded typeform is within an iframe (that needs to scroll), there’s no way to actually remove the scrollbar. There are a few options if you’d like to remove the scrollbar: 

  1. You could use some CSS to hide the scrollbar by creating a wrapper to go over the scrollbar. Though, it’s important to note the scrolling functionality will still work, but the bar will be hidden from view. 
  2. Expand the height of the form to prevent scrolling. When the form has a smaller height, the scroll bar appears. You can do this by searching for the “height” in the embed code and increasing the pixels. 

Would either of these help? :) 


vickioneill
Forum|alt.badge.img+5
  • Tastemaker
  • 320 replies
  • March 2, 2021

Thanks, @Liz ! The second one is very helpful to me. Going to try that one. 

Thanks for asking the question, @Casey !!


  • Author
  • Explorer
  • 3 replies
  • March 2, 2021

Thank you @Liz and @vickioneill for everything. Gonna try number 2 for sure...


  • Navigating the Land
  • 2 replies
  • December 21, 2022

Hi, I have an embedded typeform in my site but for some questions the height is bigger and then a scrollbar inside of the iframe with the typeform appears. My question is - is there a way to hide this scrollbar and what is it?

 

 


Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • 14840 replies
  • December 21, 2022

Hi @petya65 I added your post here where we have the answer. 


  • Navigating the Land
  • 2 replies
  • December 21, 2022
Liz wrote:

Hi @petya65 I added your post here where we have the answer. 

I checked this answer earlier @Liz but it is not what I am asking about. I am asking if there is a way to hide the scrollbar inside the iframe, not the one added by my website.

As you see this scrollbar is added to a dom element inside/ part of the iframe. How can I remove it?


Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • 14840 replies
  • December 22, 2022

Hi @petya65 the solution above would still be relevant to this, but @mathio might have some other options they can share. 


Reply