Add meta for tv pages

This commit is contained in:
Sam Carlton 2021-01-25 13:16:21 -06:00
parent 3a2326baa9
commit 2342c01b7e
4 changed files with 67 additions and 12 deletions

View file

@ -1,9 +1,13 @@
import fs from 'fs'
import replace_css_url from 'replace-css-url'
import dotenv from 'dotenv'
import { InlineCodeManager } from '@11ty/eleventy-assets'
import nuxtConfig from './nuxt.config'
// Setup dotenv
dotenv.config()
function getAssetFilePath(componentName) {
return `./${componentName}`

View file

@ -46,13 +46,41 @@ const defaultLinkTags = Object.fromEntries(config.head.link.map( mapLinkTag ))
class DefaultLayout {
generateMetaTags = ( pageMeta = [] ) => {
generateMetaTags = function ( renderData ) {
const {
title = null,
description = null,
meta: pageMeta = []
} = renderData
// console.log('renderData', Object.keys(renderData))
const meta = {
...defaultMeta,
...Object.fromEntries(pageMeta.map(mapMetaTag))
'property-twitter:url': `<meta property="twitter:url" content="${process.env.URL}${this.page.url}">`,
...Object.fromEntries( pageMeta.map(mapMetaTag) )
}
// console.log('renderData.description', renderData.description)
// if set
// get description from data
if ( description ) {
// Set meta description
meta['name-description'] = `<meta hid="description" name="description" content="${ description }">`
// Set twitter description
meta['property-twitter:description'] = `<meta hid="twitter:description" property="twitter:description" content="${ description }">`
}
// if set
// get title from data
if ( title ) {
// Set twitter title
meta['property-twitter:title'] = `<meta hid="twitter:title" property="twitter:title" content="${ title }">`
}
return Object.values(meta).join('')
}
@ -67,10 +95,13 @@ class DefaultLayout {
}
render({
content,
title = null,
}) {
render( data ) {
const {
content,
title = null,
description = null
} = data
// Setup inline tailwind
this.usingComponent( 'static/tailwind.css' )
@ -83,7 +114,7 @@ class DefaultLayout {
<head>
<title>${ title || this.getNuxt().head.title }</title>
${ this.generateMetaTags() }
${ this.generateMetaTags( data ) }
${ this.generateLinkTags() }

View file

@ -48,6 +48,7 @@ export default {
lang: 'en',
},
title: 'Does it ARM',
description: pkg.description,
meta: [
{ charset: 'utf-8' },
{

View file

@ -1,11 +1,30 @@
import dotenv from 'dotenv'
import config from '../nuxt.config'
import VideoCard from '../components-eleventy/video/card.js'
// Setup dotenv
dotenv.config()
export const makeTitle = function ( video ) {
return `${ video.name } - ${ config.head.title }`
}
export const makeDescription = function ( video ) {
if ( video.payload.featuredApps.length === 0 ) return 'Apple Silicon performance and support videos'
const featuredAppsString = video.payload.featuredApps.slice(0, 5).map(app => app.name).join(', ')
// console.log('video.payload.featuredApps', video.payload.featuredApps)
return `Apple Silicon performance and support videos for ${ featuredAppsString }`
}
class TV {
// or `async data() {`
// or `get data() {`
data() {
data () {
return {
layout: 'default.11ty.js',
@ -18,11 +37,11 @@ class TV {
eleventyComputed: {
title: ({ video }) => {
// console.log('data', data)
return `${ video.name } - ${ config.head.title }`
return makeTitle( video )
},
description: ({ video }) => {
return makeDescription( video )
},
// footerInlineScripts: () => [
// 'node_modules/lazysizes/lazysizes.min.js'
// ]
},
permalink: ({ video }) => {