Nextjs LinkedIn Insight Tag

LinkedIn Insight Tag for Next.js

This package takes advantage of the Next.js Script tag. Therefore, it requires Next.js >= 11.0.0.

Installation

``
npm install --save nextjs-linkedin-insight-tag
`

or

`
yarn add nextjs-linkedin-insight-tag
`

Setup

Declare you LinkedIn partner Id in your .env file:

`

.env

NEXT_PUBLIC_LINKEDIN_PARTNER_ID=1234
`

Or declare this variable as a Vercel environment variable or a Netlify environment variable.

$3

Add the LinkedInInsightTag component to your pages/_app.jsx or pages/_app.tsx file:

`js
// pages/_app.jsx or pages/_app.tsx
import { LinkedInInsightTag } from 'nextjs-linkedin-insight-tag'

const App = ({ Component, pageProps }) => {
return (
<>



);
};

export default App;
`

$3

Add the LinkedInInsightTag component to your global layout (probably src/app/layout.tsx), just before the closing body tag:

`js
export default function RootLayout({
children,
}: {
children: React.ReactNode
}) {
return (


{children}



)
}
`

Track events

If you have defined conversions in your LinkedIn Ad campaign, you need to track events:



Use linkedInTrack when an action takes place:

`js
// pages/some-page.jsx or pages/some-page.tsx

import { linkedInTrack } from 'nextjs-linkedin-insight-tag'

onClick={() => {
const conversionId = 1234;
linkedInTrack(conversionId);
// Actually do something...
}}
>
Click me!

`

Or you may prefer to use lintrk directly:

`js
// pages/some-page.jsx or pages/some-page.tsx

import { lintrk } from 'nextjs-linkedin-insight-tag'

onClick={() => {
const conversionId = 1234;
lintrk('track', { conversion_id: conversionId });
// Actually do something...
}}
>
Click me!

``

License

MIT