I tried adding the code from several articles but it didn’t work. i.e.: from the article at https://developer.calendly.com/release-notes it says:
“To automatically resize the standard html embed code, data-resize="true"
will need to be added as an attribute:
<div class="calendly-inline-widget"
data-url="http://calendly.com/YOUR-LINK"
data-resize="true"
style="min-width:320px;height:700px;">
</div>
However, the code of my calendly does NOT match this. There is not a ‘style’ section in the code, and so I tried inserting data-resize=”true” after my data-url part and before my <script type= part. That did nothing to the calendar but instead just showed the text I’d added as text below the calendar. I also tried inserting it after the <script type= part, but that also just displayed data-resize=”true” as text below my calendar.
Here is my code (with some details obscurred for privacy):
<!-- Calendly inline widget begin -->
<div class="calendly-inline-widget" data-url="https://calendly.com/myname-zqan/my-url" style="min-width:320px;height:700px;"></div>
<script type="text/javascript" src="https://assets.calendly.com/assets/external/widget.js" async></script>
<!-- Calendly inline widget end →
Can anyone please help me figure out where I am supposed to insert the automatic resize code or if there is a more suitable solution for getting my calendly calendar to automatically resize itself to fit the screen of the user so they do not have to scroll with a side bar to see the entire calendar?
Thanks!