# How to install the cookie banner on version Next.js 13 and above?
> For the complete site index, see [llms.txt](/llms.txt). Every page is also available as Markdown: replace the trailing slash with `.md` (`/pricing/` becomes `/pricing.md`), or send `Accept: text/markdown` to the page URL itself.
Step-by-step guide to installing the CookieYes cookie banner on Next.js 13 and above, including the app router and server components.
---
**Last updated:** May 20, 2026
**URL:** https://www.cookieyes.com/documentation/installation-of-cookieyes-on-version-next-js-13-and-above/
---
To install the cookie banner, you can follow either of the two ways to add the third-party script to your Next.js project:
1. Navigate to **app>layout.js** and add the following steps, or
2. Navigate to the **pages>_app.js** and add the following steps.
**Step 1: Import the next/script component.**
To load CookieYes in your Next.js application, add the following import statement:
```js
import Script from 'next/script';
```
**Step 2: Add CookieYes script code.**
To enable CookieYes on your website, add the following CookieYes script code:
```js
```
> **Note:**
> You need to replace ‘XXXXXXXX’ with your CookieYes website key.
>
You can copy your installation code from **Site Settings** from the top navigation panel of your CookieYes dashboard.
**Step 3: Add the strategy property beforeInteractive.**
To ensure the script loads and executes without delaying the rendering of the page, add the following strategy below the CookieYes script code.
```js
strategy="beforeInteractive"
```
After completing the above steps, the file should be like this:
> **Note:**
> CookieYes does not support the crossorigin attribute, as it may cause caching issues when used with the CookieYes script. If your website automatically adds this attribute when using the `Next.js `script component, we recommend using the standard `