Move html head content to Next's _document

This commit is contained in:
Austin Chen 2021-12-08 23:39:20 -08:00 committed by jahooma
parent 5ffeb6ca87
commit e6afb2493c
2 changed files with 72 additions and 45 deletions

71
web/pages/_document.tsx Normal file
View File

@ -0,0 +1,71 @@
import { Html, Head, Main, NextScript } from 'next/document'
export default function Document() {
return (
<Html>
<Head>
<title>Mantic Markets</title>
<meta
property="og:title"
name="twitter:title"
content="Mantic Markets"
/>
<meta
name="description"
content="Decentralized user-created prediction markets on Solana"
/>
<meta
property="og:description"
name="twitter:description"
content="Decentralized user-created prediction markets on Solana"
/>
<meta property="og:url" content="https://mantic.markets" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@manticmarkets" />
<meta
property="og:image"
name="twitter:image"
content="https://mantic.markets/logo-cover.png"
/>
<link rel="icon" href="/favicon.ico" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link
rel="preconnect"
href="https://fonts.gstatic.com"
crossOrigin="true"
/>
<link
href="https://fonts.googleapis.com/css2?family=Major+Mono+Display&display=swap"
rel="stylesheet"
/>
<link
href="https://fonts.googleapis.com/css2?family=Inter&display=optional"
rel="stylesheet"
/>
<script
async
src="https://www.googletagmanager.com/gtag/js?id=G-SSFK1Q138D"
/>
<script
dangerouslySetInnerHTML={{
__html: `
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-SSFK1Q138D');
`,
}}
/>
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
)
}

View File

@ -1,55 +1,11 @@
import React from 'react' import React from 'react'
import type { NextPage } from 'next' import type { NextPage } from 'next'
import Head from 'next/head'
import { Hero } from '../components/hero' import { Hero } from '../components/hero'
const Home: NextPage = () => { const Home: NextPage = () => {
return ( return <Hero />
<div>
<Head>
<title>Mantic Markets</title>
<meta property="og:title" name="twitter:title" content="Mantic Markets" />
<meta name="description" content="Decentralized user-created prediction markets on Solana" />
<meta property="og:description" name="twitter:description" content="Decentralized user-created prediction markets on Solana" />
<meta property="og:url" content="https://mantic.markets" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@manticmarkets" />
<meta property="og:image" name="twitter:image" content="https://mantic.markets/logo-cover.png" />
<link rel="icon" href="/favicon.ico" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link
rel="preconnect"
href="https://fonts.gstatic.com"
crossOrigin="true"
/>
<link
href="https://fonts.googleapis.com/css2?family=Major+Mono+Display&display=swap"
rel="stylesheet"
/>
<script
async
src="https://www.googletagmanager.com/gtag/js?id=G-SSFK1Q138D"
/>
<script
dangerouslySetInnerHTML={{
__html: `
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-SSFK1Q138D');
`,
}}
/>
</Head>
<Hero />
</div>
)
} }
export default Home export default Home