2b88467dd9
The [with-facebook-pixel](https://github.com/vercel/next.js/tree/canary/examples/with-facebook-pixel) example attempts to run the <Script /> loading the Facebook Pixel on every request. This results in a warning stating `[Meta Pixel] - Duplicate Pixel ID: xxx`. According to the Next.js docs, by using an [id on the inline script](https://nextjs.org/docs/basic-features/script#inline-scripts) Next is able to track and optimize the script. Since this is absent on the present example, the inline script is continuously loaded on every request. I've added an id to this inline script, and the warning from facebook is no longer present. ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have helpful link attached, see `contributing.md` ## Feature - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Documentation added - [ ] Telemetry added. In case of a feature if it's used or not. - [ ] Errors have helpful link attached, see `contributing.md` ## Documentation / Examples - [x] Make sure the linting passes by running `yarn lint` Co-authored-by: Balázs Orbán <18369201+balazsorban44@users.noreply.github.com>
27 lines
664 B
JavaScript
27 lines
664 B
JavaScript
import Link from 'next/link'
|
|
import * as fbq from '../lib/fpixel'
|
|
|
|
export default function Home() {
|
|
const handleClick = () => {
|
|
fbq.event('Purchase', { currency: 'USD', value: 10 })
|
|
}
|
|
|
|
return (
|
|
<div>
|
|
<h1>
|
|
Go to `pages/_app.js` to see how you can add Facebook Pixel to your app
|
|
</h1>
|
|
<p>Click the button below to send a purchase event to Pixel</p>
|
|
<button type="button" onClick={handleClick}>
|
|
Buy $10
|
|
</button>
|
|
<p>
|
|
Click the link below to navigate to another page.
|
|
<br />
|
|
<Link href="/navigation">
|
|
<a>Navigation page</a>
|
|
</Link>
|
|
</p>
|
|
</div>
|
|
)
|
|
}
|