Mobile Issue with Embedded Calendly: Stuck Scrolling

Design help Custom code
1

Hi,

I have embedded Calendly on my website and it is working fine on desktop, however, on mobiles, whenever I try to scroll over Calendly, it gets stuck.

The page only scrolls up or down if I tap on the area outside the Calendly block. Please refer to this screen recording to understand the issue better: Screen Recording 2024-02-10...

Can anybody please help me here?

Thanks in advance!

Here is my site Read-Only: Webflow - Create Your Matrix

2

Calendly are aware of the problem, specifically on iPhones, but did not have a solution when we called. Driving traffic to our websites is expensive, and missing leads over technical issues like this is a shame. We change the HTML embedded from Block to Flex and increased the iFrame size from 700px to 1350px and that did the trick for us. See here: https://www.ppc.me/contact Calendly doesn’t have a clue how to fix it, disappointing to say the least.

3

Yeah, not possible bc of cross-origin policy. You don’t have control over the Calendly widget bc it’s served from calendly servers. This is one of the reason why I shifted to Cal.com

There are only 2 options I see:

  1. Just set a fixed height for the div block that holds your calendly widget.
  2. Integrate calendly though API.