Mobile Chat Widget shows up in wrong place on iPhone

[miekwave (miek)]

Installed facebook chat widget: Messenger Platform - Documentation - Meta for Developers
Chat Plugin - Messenger Platform - Documentation - Meta for Developers

On Mobile iPhone devices sometimes the chat widget shows up on bottom as intended, and sometimes at TOP of page as NOT intended: see screenshot below. Unable to ident

site:

100% Pure Eats | Vegan Food | ATXFOODCO.

(open on iPhone)
(

designer preview:
https://preview.webflow.com/preview/atxfoodco-4-5?utm_medium=preview_link&utm_source=dashboard&utm_content=atxfoodco-4-5&preview=6edb7762f5894ea8028c4a393ae180e9&mode=preview

how do you always get it to show up on bottom as intended?

It should look like this:

[webdev (Jeff Selser)]

Mod edit: topic changed to custom code.

It would be helpful to define what the chat widget is.

[miekwave (miek)]

Hi @webdev

The widget is Facebook chat widget native. Found in the opening body tag on most pages:

I have SDK and followed all instructions to a T.
Load Facebook SDK for JavaScript Ref Messenger Platform - Documentation - Meta for Developers
Chat Plugin - Messenger Platform - Documentation - Meta for Developers

This works as intended on Desktop Browsers and Android browsers but on iPhone 8 Plus and iPhone X, the chat notification is appearing on top (seemingly randomly)!

Preload mesage on top = bad

Preloaded message bottom = good

Thanks for looking into this!

[miekwave (miek)]

no bueno?
I have adjusted timer to be 999 seconds in meantime until a solution is resolved. Thanks for looking at this.