Ideta blog image

Webflow chatbot - Integrate Ideta's Chatbot into Webflow

What’s a Rich Text element?

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.

Static and dynamic content editing

A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!

How to customize formatting for each rich text

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.

Webflow is a powerful website builder, it's great for designers as it allows a deep level of personalization. But, how do you integrate outside app, let's say a chatbot, to your website flawlessly?

With Ideta, you can have a deep level of personalization for your chatbot too!

We let you change every aspects of your chatbot. You can change the logo, the bubble's colors, the background images, the pop-up sizes, the borders and more...! You can integrate your chatbot to your website, as a classical pop-up widget or make a landing page for it.

In the following tutorial, learn how to add Ideta’s chatbot to your website.

Before anything else

First of all, you have to build your chatbot. Ideta chatbot builder is easy to use, you don't need to code but you can still do complex stuff. You can learn how to make a chatbot in just a few days, without coding.

Step One: Publish your bot!


Integrate your chatbot in Webflow within a pop-up

A classic chatbot on your website

Step Two

Copy the script code from the Publish tab :

Step Three

Paste the script into your page custom code section, just before “</body>”, in Webflow!

To add your chatbot to all pages of your website, past this script into your project's settings' custom code part.


ezgif.com-gif-maker (4)
Don’t forget to publish your Webflow website!



In an Iframe


A chatbot landing page can capture more leads!

Step Two

Copy the bot's URL from the iframe tab of the Publish section :

Copy the URL for the iframe of your webflow chatbot.

Step Three

Add an embedded custom code to your page :

Copie de Webflow gif (4)
You can add an embedded custom code in the paid version of Webflow

Step Four

Style your iframe and past the bot’s URL as a source.

<iframe
style="width:100%;
     border:1px
                    #b7e3e4;"
                    src="YOUR BOT'S URL GOES HERE"
></iframe>
Copie de Webflow gif (5)
We made our iframe full width so it takes all the screen

Step Five

Set your block size to 100% VH or to any size you want.

Copie de Webflow gif (6)
Don’t forget to publish your website!

Here the recap video!

Why add a chatbot to Webflow?

As explained previously, Webflow and Ideta’s chatbots are great together. Ideta enables you to design your chatbot to your liking, and Webflow is a powerful website builder. So it is only natural that Ideta’s chatbot on webflow’s website is the best combinaison possible.

But, how useful can a chatbot be? Well, let’s see how a chatbot can benefit your business with 3 use cases.

Webflow chatbot enhance your customer support

When a website is growing rapidly, so are the questions for customer support team. A chatbot can answer thousands of clients at the same time., they will all receive an answer within the second.

Moreover, you can configure your bot to search through your CRM, your inventory or even other tools. Let’s say, you have an ecommerce webflow website, wouldn’t it be great if you chatbot could give information about your customers’ order?

This way, your support team won’t be clogged with question that don’t ask for real expertise. Well, your Ideta’s chatbot can be connected to your CRM and provide your customer with their orders’ tracking number. And this, 24/7!

So even if your customer’s have queries outside your support team’s working hours, they will still get an answer. This improve greatly your relationship with your clients and make them trust you more.

Chatbots can gather your leads’ informations

Chatbot are also a great lead generation tool. Indeed, this little pop-up can be quite eye-catching, especially when it matches your brand’s design.

You can configure your chatbot to ask for your lead’s informations, such as their name or email address and add the information to your CRM. In this way, your sales team can contact them back. Don’t worry, chatbots are RGPD safe!

Even more interesting, you can use your chatbot to give away ebooks or white paper! By giving incentive away to leads, it increases their engagement with your brand and drag them further down your sale funnel. Your chatbot can enable your leads to download what they want in exchange for their email for exemple.

Make your clients schedule appointments within the Webflow chatbot

Your chatbot can be connected to your Google Calendar, Hubspot Meeting Scheduler or Calendly (and more). In this way, your clients can schedule appointments within the chatbot directly. But why, you ask?

Well, let’s say you are a SaaS and your tool is kinda complicated to understand. You leads will ask few questions to the chatbot, and now they are truly interested and would like to schedule a demo.

Well, it is easier for your futur client and you will experience less dropout if your leads don’t have to click on a link to schedule their appointment. Your chatbot can ask for the time your lead is available or show your calendar directly in the chat and your lead can make their appointment.

The process is smooth, and user friendly. Moreover, once the appointment has been taken, your chatbot can send you a notification via email, via Slack or even via Teams to warn you about it. They can also send a reminder to your lead and to yourself when the meeting is about to start!


So you see, webflow chatbot can be a real asset to your business, from lead generation to customer fidelization. Moreover, with Ideta, you can make your chatbot truly match your brand’s design!

Best Articles

Written by
Ideta

Nous aidons les entreprises à construire leurs propres chatbots, voicebots ou callbots, en leur fournissant un logiciel puissant.

Linkedin
Try our chatbot builder for free!
COMPLETELY FREE FACEBOOK AUTO COMMENT & REPLY TOOL