Use _document for shared <head> content #56

oliverjam · 2021-11-05T09:54:04Z

Lines 10 to 21 in 9faafaa

    
           <Head> 
        
             <title>Thank You 💕</title> 
        
             <meta name="description" content="" /> 
        
             <link rel="icon" href="/favicon.ico" /> 
        
             <link rel="preconnect" href="https://fonts.googleapis.com" /> 
        
             <link rel="preconnect" href="https://fonts.gstatic.com" /> 
        
             <link 
        
               href="https://fonts.googleapis.com/css2?family=Zen+Kurenaido&display=swap" 
        
               rel="stylesheet" 
        
             /> 
        
           </Head>

You're repeating yourself quite a bit on each page to ensure they all have the right fonts, favicon etc in the <head>. Next lets you customise the "surrounding HTML" (i.e. the bit outside of the main React app) by creating a pages/_document.js(just like your pages/_app.js).

You can put the stuff that's shared across all pages in here, and reserve <Head> usage for things unique to each page (like the title)

https://nextjs.org/docs/advanced-features/custom-document

The text was updated successfully, but these errors were encountered:

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Use _document for shared <head> content #56

Use _document for shared <head> content #56

oliverjam commented Nov 5, 2021 •

edited

Loading

Use _document for shared <head> content #56

Use _document for shared <head> content #56

Comments

oliverjam commented Nov 5, 2021 • edited Loading

oliverjam commented Nov 5, 2021 •

edited

Loading