Next.js Installation

Install Conferbot on Next.js

Follow this step-by-step guide to add a powerful AI chatbot to your Next.js website in minutes.

3 minutes
Easy
Copy & paste
1

Create your Conferbot account

Sign up for a free Conferbot account if you haven't already.Create account

Step 1: Create your Conferbot account
2

Build your chatbot

Choose from 100+ templates or build from scratch using our drag-and-drop builder.

Step 2: Build your chatbot
3

Customize your bot

Modify the conversation flow to match your business needs. Add your brand colors and personalize messages.

Step 3: Customize your bot
4

Configure widget settings

Go to Deploy > Widget and customize how your chatbot appears on your Next.js app.

Step 4: Configure widget settings
5

Generate the embed code

Click 'Generate Code' to get your unique embed snippet.

Step 5: Generate the embed code
Conferbot Widget Code
<script type="text/javascript">
  (function (d, s, id) {
    var js, el = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s);
    js.async = true;
    js.src = 'https://cdn.conferbot.com/dist/v1/widget.min.js';
    js.id = id;
    js.charset = 'UTF-8';
    el.parentNode.insertBefore(js, el);
    js.onload = function () {
      var w = window.ConferbotWidget("YOUR_BOT_ID");
    };
  })(document, 'script', 'conferbot-js');
</script>

Replace YOUR_BOT_ID with your actual bot ID from the dashboard

6

Add to your Next.js app

Install the code in your Next.js application using one of these methods:

6a

Open your _app.js or _document.js file in your Next.js project's pages directory

Step 6a: Open your _app.js or _document.js file in your Next.js project's pages directory
6b

For _app.js: Use the next/script component with strategy='afterInteractive' for optimal loading

6c

For _document.js: Add the script inside the <body> tag using next/script or dangerouslySetInnerHTML

6d

Save your changes and restart your development server to see the chatbot

You're all set!

Refresh your Next.js app and your chatbot should now be live. Start engaging with your visitors!

Other Platform Guides

Looking for a different platform? Check out our other installation guides.

Need Help with Next.js Installation?

Our support team can help you get your chatbot running on Next.js in no time.

منصة متعددة القنوات

شات بوت واحد،
كل القنوات

يعمل الشات بوت الخاص بك على واتساب وماسنجر وسلاك و6 منصات أخرى. أنشئ مرة واحدة، انشر في كل مكان.

View All Channels
Conferbot
متصل
مرحباً! كيف يمكنني مساعدتك اليوم؟
أحتاج معلومات عن الأسعار
Conferbot
نشط الآن
مرحباً! ماذا تبحث عنه؟
حجز عرض توضيحي
بالتأكيد! اختر موعداً:
#الدعم
Conferbot
تذكرة جديدة من سارة: "لا أستطيع الوصول للوحة التحكم"
تم الحل تلقائياً. تم إرسال رابط إعادة التعيين.