Typeform is a unique online form creator that allows you to create an interactive form, while Elementor is a great page builder plugin with an intuitive visual editor. Combining the two is a great idea to increase user engagement on your website. You can create content like quizzes or an interactive survey with Typeform. Unfortunately, Elementor has no default feature that allows you to integrate it Typeform. You can use Essential Addons to integrate Elementor with your Typeform account.
The new version of this add-on (version 4.0) comes with a Typeform widget that allows you to add your existing Typeform forms to an Elementor-powered page or template. Essential Addons itself is a freemium Elementor add-on. You can use the free version of Essential Addons to add your form since the Typeform widget is available on the free version. Before being able to use the Typeform widget, you need to integrate Elementor with your Typeform account first using a personal token.
Integrating Elementor with Typeform
Before getting started, make sure you have installed and activated Essential Addons on your WordPress site. You can download the free version of Essential Addons on the official plugin directory of WordPress. If you are new to Elementor, you can read the beginners’ guide we have written to learn how to use Elementor.
First off, login to Typeform with your account. Click the arrow icon next to your username and click Settings.
Click Personal tokens on the left sidebar (on the Profile section) and click Generate a new token button on the right sidebar.
Give your token a name and click the Generate token button. Copy the generated token.
Login to your WordPress dashboard and go to Essential Addons -> Essential Addons to open the Essential Addons settings page.
On the Essential Addons settings page, go to the Elements tab. Scroll down to the Form Styler Elements section to find the Type form widget. Click the Settings link and paste the personal token you have just copied.
Click the SAVE SETTINGS button on the bottom to save the new change.
Adding a Typeform Form
Once Typeform is successfully integrated with Elementor, you can now add an existing form on your Typeform account. To do so, simply create a new page, post, or template and edit it with Elementor. Of course, you can also edit an existing page, post, or template. Drag the Typeform widget to the canvas area. Select a form you want to add from the dropdown menu on the Typeform block under the Content tab.
To style up your form, you can open the Style tab. You can change the color of form container, form width, height, opacity, and margin.
Publish/edit your page once you are done styling it up.
