Wróć do bloga

Product

How to Add an AI Website Assistant to Your B2B Site

Embed an AI website assistant on your B2B site: load approved knowledge, configure lead capture, paste one script tag, and route Hot/Warm/Cool leads to Pipedrive.

·14 min czytania
engagelayer.io AI website assistant embedded on a B2B marketing site

Krótka odpowiedź

Add an AI website assistant to your B2B site by loading approved knowledge in engagelayer.io, configuring tone and lead capture, pasting one script tag with your public key, testing in preview, and routing Hot / Warm / Cool leads to Pipedrive, email, or a webhook. The assistant answers only from content you approve and captures leads when it cannot answer.

This guide is for marketing, revenue, and ops teams who want a grounded AI chatbot with a custom knowledge base on a B2B website without rebuilding the site or hiring a long integration project. You might run demand gen, own the website, or support sales with better inbound context. The goal is not a generic widget that guesses. It is an AI website assistant that stays inside approved company knowledge, qualifies visitors during the conversation, and sends structured leads to the tools your team already uses.

By the end, you will have approved content loaded in engagelayer.io, an assistant configured for tone and lead capture, the widget embedded on your site, a preview pass completed, and delivery wired to Pipedrive, email, or a webhook. Most teams can finish the core setup in one working session. Heavier content imports or CRM field mapping may add a second pass, but the embed itself is a single script tag.

What you need before you start

A short checklist saves rework later. Gather the assets and access listed below before you open the dashboard. You do not need a developer for the basic path, but someone who can edit your site header or tag manager should be available when you go live.

If your content is scattered across PDFs, old decks, and a wiki nobody trusts, block thirty minutes to decide what is safe to publish first. The assistant performs best when the first knowledge load is small, accurate, and clearly owned by one team.

  • An engagelayer.io workspace and your widget public key from the dashboard
  • Approved content to load first: FAQ entries, short text blocks, or a CSV of Q&A pairs you already use with sales
  • Optional: a list of site URLs for a website crawl (handled by a worker tier, not a manual copy-paste job)
  • A decision on lead routing: Pipedrive (native in MVP), a notification email, or a webhook to your stack
  • Edit access to your site CMS, theme footer, or Google Tag Manager container
  • One stakeholder who can sign off on tone, qualification questions, and what the bot should refuse to answer

Load approved knowledge first

Grounding comes before embedding. engagelayer.io retrieves from knowledge sources you approve, then composes answers with citations back to that material. If you skip this step and paste the widget first, visitors will see an empty or overly cautious assistant, and you will wrongly blame the channel instead of the content gap.

Start with the questions sales and support already answer every week. Pricing boundaries, implementation scope, security posture, integrations, and booking paths are typical first wins. You can expand later; you cannot undo a bad first impression caused by missing sources.

FAQ sources

FAQ entries are the fastest way to ship. Each item should be a clear question and a concise answer your team stands behind. Avoid marketing fluff inside answers; the model will repeat it verbatim under pressure. Group topics by theme (pricing, product, security, support) so you can retire or update slices without touching everything.

When a visitor asks something adjacent to an FAQ, retrieval still pulls the nearest approved entry. If nothing matches, the assistant should admit the gap and offer lead capture rather than inventing detail. That behavior is a feature, not a failure, on B2B sites where wrong answers cost pipeline trust.

Text blocks

Text sources cover narrative content that does not fit a strict Q&A shape: positioning paragraphs, plan comparisons described in prose, implementation timelines, or approved legal disclaimers. Keep blocks focused. One block per topic makes updates easier and reduces the chance that an old paragraph survives after messaging has moved on.

Paste from your single source of truth, not from a slide export with half sentences. Name the block so future you knows what it feeds. When product marketing updates copy on the website, schedule a matching pass in the knowledge base or answers will drift from the live site.

CSV imports

CSV import suits teams that already maintain question-and-answer spreadsheets for SDRs or support macros. Use consistent column headers as documented in the dashboard, one row per pair, and strip duplicate rows before upload. A clean CSV beats a large messy one every time.

After import, spot-check ten rows that matter commercially: pricing, contract terms, data residency, and competitor comparisons if you allow them at all. CSV speed is worthless if the tenth row still says last year's packaging.

engagelayer.io dashboard knowledge sources feeding the website AI widget
Approved FAQ, text, and CSV sources flow into retrieval before the widget speaks on your site.

Website crawl and binary documents follow a different path. Public URL crawls run through a worker tier so you do not manually paste every page. PDFs and similar binaries are often handled during onboarding because extraction quality depends on layout. Plan self-serve FAQ, text, and CSV for day one, then add crawl or binary with help if you need them.

Configure the assistant tone and lead capture

Tone settings shape how the assistant greets visitors, how direct it is, and how quickly it moves toward qualification. B2B buyers tolerate warmth, but they punish vagueness. Write instructions as you would brief a sharp SDR: helpful, plain language, no fake urgency.

Lead capture rules define what happens when intent rises or when knowledge runs out. engagelayer.io classifies visitors into Hot, Warm, and Cool based on signals you configure, such as asking for pricing, naming a timeline, or requesting a demo. Cool does not mean junk; it means nurture instead of an instant sales ping.

Decide which fields you need. Email and company name might be enough for Warm; Hot might warrant phone or team size. Every extra field lowers completion. Pair fields with a clear value line so visitors know why they are sharing data.

Set boundaries explicitly: topics the assistant must not speculate on, competitors it should not trash-talk, and offers it cannot make without human approval. Those guardrails keep the assistant inside approved knowledge and protect brand risk on a public site.

Embed the widget

Embedding is one async script tag. The widget loads from the engagelayer.io CDN and reads your public key to pull the right workspace configuration. You do not host models on your origin, and you do not open new backend routes on your site for chat to work.

Copy the snippet from the dashboard so the key matches your environment. Replace the placeholder only with your real public key. Optional attributes adjust placement and language without another deploy cycle.

Optional attributes include data-position with values bottom-right or bottom-left, and data-language to hint locale for the widget chrome. Use them when brand guidelines require the launcher on a specific corner or when you run a non-default language site.

WordPress and common CMS setups

On WordPress, paste the snippet in a site-wide footer injection point, a header script plugin, or your child theme footer template depending on what your security policy allows. Prefer one global include so the assistant appears on landing pages and blog posts consistently. Avoid adding the script only on the homepage unless you intentionally want partial coverage.

If you use a caching or optimization plugin, exclude the widget script from aggressive minification or deferred loading rules that break execution order. Purge cache after save, then load an incognito window to confirm the launcher appears.

Google Tag Manager

In Google Tag Manager, create a Custom HTML tag with the embed snippet, set the trigger to All Pages (or a subset if you pilot on selected paths), and publish the container version. GTM is useful when marketing owns deployment and engineering prefers not to touch the repo for a marketing experiment.

Name the tag clearly and document the public key owner. When keys rotate, update the tag and publish again; stale keys produce a silent widget failure that is easy to misdiagnose as ad blocking.

Plain HTML and static sites

For static or hand-rolled sites, place the script before the closing body tag on every template that should offer chat. If you maintain layouts with includes, put the snippet in the shared layout once. For single-page apps, ensure the script stays across client navigations if your framework replaces the document body.

After deploy, view source on a live URL and search for cdn.engagelayer.io to confirm production HTML actually contains the tag. Local builds sometimes differ from what marketing pastes into the CMS.

Test in preview before go-live

Preview mode lets you role-play visitors without exposing half-baked answers to the market. Open preview from the dashboard and run a structured script: ask ten real questions your last ten inbound leads asked, including two edge cases where you expect the assistant to admit uncertainty.

Check citations on factual answers. If a reply sounds right but cites nothing, trace which source should have fired and fix retrieval before launch. Also test qualification paths: a pricing question should escalate capture fields appropriately without sounding like an interrogation.

Invite one salesperson to break it politely. They will try competitor traps and pricing hacks you forgot. Better now than on a live demo with a prospect watching.

When preview passes, embed on production and repeat three smoke questions in an incognito window. Preview and production should match; if they diverge, you usually deployed the wrong key or an old container version in GTM.

Connect Pipedrive, email, or webhook

Delivery turns conversations into pipeline. In MVP, Pipedrive is the native CRM path: connect the account, then push qualified leads from the dashboard (manual push today; do not promise fully automatic enqueue until your workspace confirms it). Map Hot, Warm, and Cool outcomes to stages or labels your team already respects. Email notifications suit small teams that want an inbox ping with transcript context. Webhooks fit ops teams that want to fan out to internal systems.

HubSpot and Salesforce are not native connectors in MVP. If your CRM is one of those, plan email or webhook routing until a direct connector exists, and avoid promising reps a native sync you cannot ship yet.

Include transcript snippets or qualification summaries in the payload so reps open CRM records with context instead of guessing what the visitor wanted. Test each route with a forced Hot and a forced Cool conversation in preview so you see real field values, not placeholders.

EU-hosted processing is available for teams with data residency preferences; treat that as a deployment choice aligned to your policy, not a substitute for cleaning PII out of knowledge sources you should never load in the first place.

Common mistakes

Embedding before knowledge is the most common miss. Teams paste the script, see a weak first answer, and declare chat useless. The widget was fine; the retrieval layer had nothing trustworthy to say. Fix the sources, then re-test. Symptoms include generic apologies and lead capture on every other message.

Loading unapproved content creates a slower failure. Marketing uploads a draft FAQ with TBD pricing, the assistant quotes it confidently, and sales inherits angry follow-ups. Assign an owner for each source type and date-stamp reviews. If content is not safe for a public reply, keep it out until it is.

Over-qualifying too early kills completion rates. Asking for phone, company size, and budget before answering a basic product question feels like a form wearing a chat skin. Let the assistant answer grounded questions first, then escalate fields when intent signals appear.

Deploying the wrong public key or a stale GTM container version produces a blank launcher or a widget tied to another workspace. Always verify the key in view source after publish. Name GTM versions so rollback is obvious when someone pastes a test key into production.

Treating Hot/Warm/Cool as vanity labels wastes routing. If everything lands in one inbox, reps stop trusting scores. Align definitions with sales in a fifteen-minute working session and wire different paths or SLAs per band. Illustrative pilot programs sometimes move a meaningful share of inbound to booked meetings when routing matches intent, but your mix will differ; measure your own funnel instead of expecting a guarantee.

Launch checklist

Use this sequence for a controlled go-live. Skipping a step is how production surprises happen on Friday afternoon.

  • Confirm FAQ, text, and CSV sources are approved, dated, and owned by a named teammate
  • Run ten preview conversations including two intentional unknowns; verify citations on factual replies
  • Paste the embed snippet with the production public key on all intended templates or GTM triggers
  • Set data-position and data-language if your site layout or locale requires them
  • Smoke-test live in incognito: launcher visible, three real questions answered or captured cleanly
  • Verify Pipedrive, email, or webhook delivery for at least one Hot and one Cool test lead
  • Brief sales on Hot/Warm/Cool definitions and where transcripts appear
  • Schedule a seven-day review to patch knowledge gaps surfaced by real conversations

When the checklist is green, announce internally before you promote externally. Reps should know chat is live, what qualifies as Hot, and where records land. Visitors get a better experience when the humans behind the CRM expect the assistant to exist.

If you want a grounded AI chatbot with a custom knowledge base on your B2B site without a custom build, start at engagelayer.io, load what you already trust, and embed the widget when preview answers look like something your team would send manually. Next, read knowledge base chatbots for B2B and conversational lead qualification.

FAQ

How do I add an AI chatbot to my website with engagelayer.io?
Create a workspace, load approved FAQ, text, or CSV knowledge, configure tone and lead capture, then paste the async widget script with your public key before the closing body tag or via your tag manager. Test in preview, connect Pipedrive, email, or a webhook, and run a short live smoke test. Most teams complete the first pass in one session.
What is the exact embed code for the website AI widget?
Use this snippet: <script async src="https://cdn.engagelayer.io/widget.js" data-public-key="YOUR_PUBLIC_KEY"></script>. Replace YOUR_PUBLIC_KEY with the key from your dashboard. Optional attributes include data-position (bottom-right or bottom-left) and data-language for widget locale.
Can the AI chatbot use our custom knowledge base only?
Yes. engagelayer.io answers from approved sources you load: FAQ, text, CSV, and optionally website crawl via a worker tier. It should cite retrieved material and admit when nothing matches, then offer lead capture instead of inventing facts. That grounding is the core difference from generic chat widgets.
Which CRM integrations are supported today?
Pipedrive is the MVP CRM path: connect it, then push leads from the dashboard (manual push in current MVP). Email notifications and webhooks are always available for other stacks. HubSpot and Salesforce are not native in MVP; route through email or a webhook until a direct connector ships.
Do I need developers to embed the AI website assistant?
Often no. Marketing or ops can paste one script tag in a CMS footer, a header injection plugin, or Google Tag Manager. Developers help when your site policy blocks third-party scripts or when you need crawl or binary onboarding for larger document sets.
How does lead qualification work during chat?
You configure signals that map visitors to Hot, Warm, or Cool based on questions they ask and fields they complete. Hot leads can route to fast sales follow-up; Warm and Cool can nurture with different SLAs. Delivery goes to Pipedrive, email, or a webhook with transcript context so reps know what was discussed.

Powiązane artykuły