Company Widget
Example usage of Octolane AI for IP to company enrichment widget
Get Started
We will be building the company identify widget with custom message. We will be using Next.js (App Router) for this example with Tailwind css, Headless UI for smooth transitioning, and heroicons which is completely free. You can use any framework you like.
We will be need to implement just two typescript files. One is for the widget component and the other is for the API route which will basically call the Octolane API and return the magic results.
Widget Component
Letβs install the dependencies first, if there is missing something in your project:
NB. We are skipping the tailwind setup here. You can follow the tailwind setup
Create a file called CompanyIdentifyWidget.tsx
and add the following code:
Feel free to replace the used icon from heroicons
with your own icon. You can also replace the tailwindcss
classes with your own classes.
API Route
Create a file called /api/company-identify/route.ts
and add the following code:
You will be need to replace the <Replace-your-octolane-api-key>
with your own API key. You can get the API key from your dashboard.
Hope these two files will help you to customize your web traffic experience. If you have any questions, please feel free to reach out to us.
Talk directly to our co-founders by emailing one@octolane.com. We read every single email and reply to them personally.
Our pro customers have Slack connect with us and we help them with migrations and give more direct support.
You can also follow our team on Twitter for the latest updates: CoffeeWithOne or you can follow our company Twitter: octolane_ai.
Was this page helpful?