Make Calendy button total clickable

Design help Custom code
1

Hi,

Please check the example.
https://calendy.webflow.io/

Book a demo has a html embed to the Calendy widget.
Start here is a normal webflow button.

I would like the html embed from Calendy to function like the normal webflow button.
The styling is good. But now is the problem with the Calendy button is only clickable when hovering over the text. I would like that the whole button works clickable on hover.

Do I need to add css to the HTML embed?

This is my read only link.
https://preview.webflow.com/preview/calendy?utm_medium=preview_link&utm_source=dashboard&utm_content=calendy&preview=c01c0ea066658f990cd038ee5464dc76&mode=preview

Thanks for your help!

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

You need to add the class of your webflow button to the calendly code:

<link href="https://assets.calendly.com/assets/external/widget.css" rel="stylesheet">
<script src="https://assets.calendly.com/assets/external/widget.js" type="text/javascript"></script>
<a href="" class="YOUR-BUTTON-CLASS" onclick="Calendly.initPopupWidget({url: 'https://calendly.com/suivo-demo/booking'});return false;">Book a demo</a>
<!-- Calendly link widget end -->
3

Yes, it works! Thanks man!

1 Like
4

Iā€™m glad I was able to help