Quickstarts
Next.js
Load the Feddy widget with next/script from a client component in your root layout.
By the end of this page your site has a support launcher, and a message sent from it shows up in your Feddy inbox.
Prerequisites
- A Feddy project and its project ID from Settings → Install. Create a project if you have none.
- Nothing to install from npm. The widget is one script served from
core.feddy.app, loaded at runtime.
Add a client component
next/script needs a client component for its onLoad callback:
'use client'
import Script from 'next/script'
export function Support() {
return (
<Script
src="https://core.feddy.app/sdk/feddy.js"
strategy="afterInteractive"
onLoad={() => Feddy.init({ projectId: 'fd_XXXXXXXXXXXXXXXX' })}
/>
)
}The project ID ships in your bundle and is public by design. Commit it. Do not put it in a secrets file or an environment variable.
Render it from the root layout
import { Support } from './support'
export default function RootLayout({ children }) {
return (
<html>
<body>
{children}
<Support />
</body>
</html>
)
}The widget mounts once and survives client-side navigation. To open it from your own button instead of the floating launcher, pass launcher: false to init and call Feddy.open() from the button.
Verify
Open the page, click the control, and send a message. It appears in your Feddy inbox. Reply from the inbox; the reply shows up in the panel.
Next steps
- Identify users so replies can also reach them by email and you see who wrote in.
- Unread badge to drive your own badge from
onUnreadCountChanged. - Web SDK reference for every option and call.