Webflow is a fantastic tool to create websites in no time. In fact, we have been using it for years to design, develop and host our Timekit.io page.
This is a guide for how we created https://www.timekit.io/book-demo
1. Open your designer
This assumes that you already have an account and have created a page. If this is not the case swing over to Webflow's help center: https://help.webflow.com
2. Add Embed Element
On the page that you want to use Timekit, find the element called 'embed' in your 'add elements' panel:
3. Copy your Timekit script
In your Timekit dashboard find the project you wish to show on your Webflow page and navigate to the 'share' tab. Copy the script.
4. Paste into your Webflow Embed Element
Double-click the element you've added to your site and paste in the script from Timekit.
5. Publish your site
You won't be able to see the Timekit widget before you go live. Fortunately, putting sites live in Webflow is literally just a click of a button.
BONUS: CSS tips
Give the <div> element of your 'embed element' a max widget of 650px and auto left + right margins to ensure that the widget is floating nicely in the middle in an appropriate size.
The -120px top margin and -30px bottom margin is to make the widget stick a little outside the background we are using on the page.