the-tip-top-frontend/app/layout.tsx
soufiane 4dcc091b53 feat: add GTM + improve mobile hero section
- Added Google Tag Manager (GTM-WN8H6RTC) script and noscript
- Added padding-top on mobile hero to avoid header overlap
- Reduced subtitle text size on mobile for better readability
- Added Inscription/Connexion buttons on mobile for non-authenticated users

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-12-05 13:30:26 +01:00

116 lines
3.6 KiB
TypeScript

import type { Metadata } from "next";
import Script from "next/script";
import "./globals.css";
import { Toaster } from "react-hot-toast";
import LayoutClient from "./layout-client";
import { Providers } from "./providers";
// Google Analytics 4
const GA_TRACKING_ID = "G-E272LVVQRD";
// Google Tag Manager
const GTM_ID = "GTM-WN8H6RTC";
export const metadata: Metadata = {
metadataBase: new URL(process.env.NEXT_PUBLIC_FRONTEND_URL || 'https://dsp5-archi-o24a-15m-g3.fr'),
title: "Thé Tip Top - Jeu Concours",
description: "Participez au grand jeu-concours Thé Tip Top et gagnez des lots exceptionnels ! 100% de tickets gagnants.",
keywords: "thé, concours, jeu, tip top, nice, gain, lot, infuseur, coffret",
authors: [{ name: "Thé Tip Top" }],
icons: {
icon: [
{ url: '/favicon.svg', type: 'image/svg+xml' },
{ url: '/icon.svg', type: 'image/svg+xml' },
{ url: '/logos/logo.svg', type: 'image/svg+xml' },
],
shortcut: '/favicon.svg',
apple: '/logos/logo.svg',
},
openGraph: {
title: "Thé Tip Top - Jeu Concours",
description: "Participez au grand jeu-concours et gagnez des lots exceptionnels !",
type: "website",
locale: "fr_FR",
images: [
{
url: '/logos/logo.svg',
width: 1200,
height: 630,
alt: 'Thé Tip Top Logo',
},
],
},
};
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
<html lang="fr">
<head>
{/* Google Tag Manager */}
<Script id="google-tag-manager" strategy="afterInteractive">
{`
(function(w,d,s,l,i){
w[l]=w[l]||[];
w[l].push({'gtm.start': new Date().getTime(), event:'gtm.js'});
var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),
dl = l!='dataLayer'?'&l='+l:'';
j.async=true;
j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;
f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','${GTM_ID}');
`}
</Script>
{/* Google Analytics 4 */}
<Script
src={`https://www.googletagmanager.com/gtag/js?id=${GA_TRACKING_ID}`}
strategy="afterInteractive"
/>
<Script id="google-analytics" strategy="afterInteractive">
{`
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', '${GA_TRACKING_ID}');
`}
</Script>
</head>
<body className="min-h-screen flex flex-col bg-gray-50">
{/* Google Tag Manager (noscript) */}
<noscript>
<iframe
src={`https://www.googletagmanager.com/ns.html?id=${GTM_ID}`}
height="0"
width="0"
style={{ display: 'none', visibility: 'hidden' }}
/>
</noscript>
<Providers>
<LayoutClient>{children}</LayoutClient>
</Providers>
<Toaster
position="top-right"
toastOptions={{
duration: 4000,
style: {
background: '#fff',
color: '#333',
},
success: {
iconTheme: {
primary: '#10B981',
secondary: '#fff',
},
},
error: {
iconTheme: {
primary: '#EF4444',
secondary: '#fff',
},
},
}}
/>
</body>
</html>
);
}