Problem in the midle of the form

  • 23 February 2022
  • 20 replies
  • 284 views

I have embed the form to my wordpress site with the “Standard methode” and insert HTML Code. Its in every editor (WP Bakery, Elementor, Gutenberg etc. the same.

 

Start page is ok, when i klick on “Wir werden sehen” to type in the name, the page zooms extreme. (Look pictures) I think something is wrong with the script. Its only on mobile devices. How can i fix this problem?

 

WP is updated and all pugins too.

https://hope-and-care.de/bewerbung2

 

 

 

 


20 replies

Userlevel 5
Badge +4

Hi @JeG1980,

Could you please let me know what device, browser and Android OS version number you are using? This will help us resolve the issue.

Thanks

Joyce

Hello! :) 

 

i tried it on different phones. (Xiaomi redmi 9 pro, Samsung 10). The problem appears only in the Chrome browser for android.

I have a similar issue on Android and iPhone with Chrome on my embeded form.

 

see > https://remi-bonnaud.fr/ and cta “launch me”

 

No problem on Safari with an iPhone.

Userlevel 5
Badge +4

Thanks both! There’s a bug in our backlog to investigate the issue.

Thanks Jvh, any idea when the bug wlll be fixed ? :grin:

Userlevel 7
Badge +5

@jvh have you heard any updates for a fix on this? :grinning:

So far the problems continue. In each part of a form where you have to enter the name, email address or other written input, the display zooms. The user must therefore zoom out again to continue the input.Here again for information: The problem occurs on mobile devices with a Chrome browser.

 

We are unable to start a paid campaign on the internet due to this problem. We would then have an increased bounce rate, which then renders the Typeform form unusable.
Userlevel 5
Badge +4

Hey all, no significant progress on this yet. We’re struggling to recreate the issue on our own devices.

@JeG1980 and @Remi can you confirm that the devices you are testing on are up-to-date with the latest OS and Chrome app version?

Thanks

Hi jvh,

 

I confirm the devices are up to date with the latest OS (Android/iOS) and Chrome Version.

You can try the typeform emebed here on my wordpress : https://remi-bonnaud.fr/ & cta “lauch me” (WordPress 5.0.4 / PHP 5.4). I also tried on my colleagues’ phones, same issue.

 

All up to date on Android/Chrome and the WordPress page I think it is happen on some devices with a specific resolution. The segments with input fields are displayed in a popup and this popup exceeds the resolution of the page. The popup does not match the responsive design of the page.

I am also having the same issue. It consistently happens on mobile. Each of the devices where android phones, and the zooming bug happened regardless if they were using chrome or brave browsers. 

They were all up to date. 

Userlevel 5
Badge +4

Hi everyone, we’ve been having a surprisingly difficult time recreating the issue but we’ve finally found a device where we’re seeing the same issue so we’re hoping to be able to identify and resolve the issue next week :fingers_crossed:

Hi jvh,

 

Did you manage to find an solution for this issue? I am facing a similar one. It looks to me like the browser tries to zoom into an input field because it’s fontsize is smaller than 16px. It is explained in the update of this stack overflow post: https://stackoverflow.com/a/52071449

Do you have a possible release date for this fix?

Thanks in advance

Userlevel 5
Badge +4

Hey @petergoes - from what everyone in the team has looked at it’s definitely recommended for the font size to be 16px or larger. 

There’s a fix that’s been released that will hopefully resolve the issue for most people but I expect it won’t fix it everywhere. Chrome on Android has some bugs when it comes to iframes so that’s why the issue pops up when embedding Typeform.

Hey @jvh , thanks for the quick reply. Is there anything I can do to work around this issue?

Userlevel 5
Badge +4

@petergoes the only thing we’ve found seems to work quite consistently is adding the following meta tag to the head of your own website:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">

However, this disables the ability to manually zoom which isn’t best practice so it’s up to you if that’s something you want to use.

@jvh I have confirmed it to be working, however, I do hope you will find a better solution because this hurts our accessibility to an almost deal breaking point. I opted to modify the meta element only when the form is visible and to restore its value when the form has been submitted, but that is code I rather would not maintain.

If you do find a better solution, could you report that back in this thread?

thanks in advance

Userlevel 5
Badge +4

Of course @petergoes - we don’t like this solution either.

Hi @jvh , do you have some news about this bug?

 

Thanks

Of course @petergoes - we don’t like this solution either.

 

Userlevel 5
Badge +4

Hey @Faber91 - no updates yet on this unfortunately

Reply