example/src/app/layout.tsx

import type { Metadata } from "next";
import localFont from "next/font/local";
import "./globals.css";
import { GlobalSeoScript } from "globalseo-next";

const geistSans = localFont({
  src: "./fonts/GeistVF.woff",
  variable: "--font-geist-sans",
  weight: "100 900",
});
const geistMono = localFont({
  src: "./fonts/GeistMonoVF.woff",
  variable: "--font-geist-mono",
  weight: "100 900",
});

export const metadata: Metadata = {
  title: "Create Next App",
  description: "Generated by create next app",
};

function GlobalSeoWithSubdomain() {
  return (
    <GlobalSeoScript
      apiKey="YOUR_API_KEY"
      originalLanguage="en"
      allowedLanguages="en, es"
      excludeClasses="class1, class2"
      excludeIds="id1, id2"
      translationMode="subdomain"
      customLinks={{
        'https://www.example.com/file_en.pdf': {
          de: 'https://www.example.com/file_de.pdf',
          fr: 'https://www.example.com/file_fr.pdf',
          es: 'https://www.example.com/file_es.pdf',
        },
        'https://www.example.com/file_en.doc': {
          de: 'https://www.example.com/file_de.doc',
          fr: 'https://www.example.com/file_fr.doc',
          es: 'https://www.example.com/file_es.doc',
        },
      }}
    />
  )
}

function GlobalSeoClientSideOnly() {
  return (
    <GlobalSeoScript
      apiKey="YOUR_API_KEY"
      originalLanguage="en"
      allowedLanguages="en, es"
      excludeClasses="class1, class2"
      excludeIds="id1, id2"
      useBrowserLanguage="true"
      translationMode='client_side_only'
    />
  )
}

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  return (
    <html lang="en">
      <body
        className={`${geistSans.variable} ${geistMono.variable} antialiased`}
      >
        {children}

        {/* Add one, either with or without subdomain, don't add both! */}
        <GlobalSeoWithSubdomain />
        <GlobalSeoClientSideOnly />
      </body>
    </html>
  );
}