• Help Center
  • How to add Contact Form widget to WebFlow website

How to add Contact Form widget to WebFlow website

Share
Nowadays one can’t imagine a website, which wouldn’t give you an opportunity to submit your feedback. Various response forms, message or feedback forms and other tools, which help keep in touch with your audience are essential. Shape any of this yourself without any coding!

Simple Contact Form for your WebFlow site

If you need a comprehensive and functional contact form to receive maximum responses from your clients and boost performance of your site, then our widget is the ultimate option for you. Learn more about the widget.

Our main features:

  • Premium design;
  • Responsive template;
  • Captcha protection included;
  • Popup and onpage options;
  • Two-minute installation.

Keep in touch with your visitors 24/7, receiving their feedback on requested email and get more leads for your business!

Points of adding the widget

Installation of our widget is ultimately easy and intuitive; it will take you not more than three minutes. Follow all steps described below to create your widget.

Step 1. Generate your personal plugin

Shaping of the plugin

Follow the link (Live Editor) to create a plugin. Pick out the design and presentation type to shape the plugin that will fit your website in the best way. Or learn more on Contact Form main page.

Pick the plan

After your plugin is ready, select your subscription plan. We offer free and paid plans to suit any needs.

Get the code of the plugin

The last step in setting up Elfsight app is to obtain the plugin html code.

Step 2.1: Add a full size contact form to a page

Pin your form to one of the pages.

Enter you WebFlow account

Sign in at WebFlow, to start editing the site.

Choose the website

On the dashboard, choose the site, where the plugin will be installed.

Add HTML element to the page

Find the right place for the plugin and drag the HTML element from the right-hand menu.

Insert plugin code

In the appeared window of HTML element editor, insert Contact Form script, received on Elfsight Apps and save the changes.

Publish the changes in the website

After all the steps are taken, press «Publish» button in the upper menu, to apply the changes to the website.

Installation is complete!

Enter the page to see your new contact form.

Step 2.2: Add a popup contact form to follow visitor’s scroll

Popup form can be added to each and all pages of your website.

Enter the dashboard

Sign in and go to the setting of the required page.

Start code editing

Out of tabs on the upper panel, choose «Custom code».

Add the form

In «Footer code» field, insert the code, which you received on Elfsight Apps website. Save and publish the changes.

Done! You have successfully installed the plugin

Go you your website to check the work of the form. *Sometimes you need to clear the cache to see the updated version of the site.

Customizing the widget with Elfsight account

After the widget is ready, you can also adjust it the way you like. To do so, visit Elfsight apps website and start Live Editor. You are free to correct texts, change templates, or choose the most suitable display variant. All changes made in the Live Editor will be introduced on your resource immediately.

To see other effective widgets developed by Elfsight and set up them, go to your account.

Check unique Contact From free!

Free live editor for fast creation of widgets.

Still got questions?

If you need any further assistance, contact our very helpful Support Center and we'll be happy to answer any questions. Just expect a response during our working hours (from 10 a.m. to 7 p.m. CET, Monday through Friday).