0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2025-12-28 11:22:39 +00:00

add fn to change meta tags based on page

This commit is contained in:
Gazook89
2022-10-20 11:19:17 -05:00
parent 04eebae3ec
commit b237456420

View File

@@ -1,28 +1,59 @@
module.exports = async(name, title = '', props = {})=>{
const template = async function(name, title='', props = {}){
const HOMEBREWERY_PUBLIC_URL=props.config.publicUrl;
return `
<!DOCTYPE html>
<html>
<head>
<link href="//use.fontawesome.com/releases/v5.15.1/css/all.css" rel="stylesheet" />
<link href="//fonts.googleapis.com/css?family=Open+Sans:400,300,600,700" rel="stylesheet" type="text/css" />
<link href=${`/${name}/bundle.css`} rel='stylesheet' />
<link rel="icon" href="/assets/favicon.ico" type="image/x-icon" />
<meta property="og:title" content="${props.brew.shareId ? (props.brew.title || 'Homebrewery - Untitled Brew') : 'The Homebrewery'}">
<meta property="og:url" content="${HOMEBREWERY_PUBLIC_URL}/${props.brew?.shareId ? `share/${props.brew.shareId}` : ''}">
<meta property="og:image" content="${props.brew?.thumbnail || `${HOMEBREWERY_PUBLIC_URL}/thumbnail.png`}">
<meta property="og:description" content="${props.brew.shareId ? (props.brew.description || 'No description.') : 'Try out the Homebrewery!'}">
<meta property="og:site_name" content="The Homebrewery - Make your Homebrew content look legit!">
<meta property="og:type" content="article">
<meta name="twitter:card" content="summary_large_image">
<title>${title.length ? `${title} - The Homebrewery`: 'The Homebrewery - NaturalCrit'}</title>
</head>
<body>
<main id="reactRoot">${require(`../build/${name}/ssr.js`)(props)}</main>
<script src=${`/${name}/bundle.js`}></script>
<script>start_app(${JSON.stringify(props)})</script>
</body>
</html>
`;
const ogMeta = {
siteName : 'The Homebrewery - Make your Homebrew content look legit!',
title : 'The Homebrewery',
description : 'Homepage',
thumbnail : `${HOMEBREWERY_PUBLIC_URL}/thumbnail.png`,
type : 'website'
};
if(props.url.match(/\/share\/|\/edit\//)){
Object.assign(ogMeta, {
siteName : null,
title : props.brew.title || 'Homebrewery - Untitled Brew',
description : props.brew.description || 'No description.',
thumbnail : props.brew.thumbnail || null,
type : 'article'
});
} else if(props.url.match(/\/print\/|\/source\//)){
Object.assign(ogMeta, {
siteName : null,
title : `${props.brew.title} - ${props.url.match(/\/print\/|\/source\//)}` || 'Homebrewery - Untitled Brew',
description : props.brew.description || 'No description.',
thumbnail : props.brew.thumbnail || null,
type : 'article'
});
}
const ogTags = [];
Object.entries(ogMeta).forEach(([key, value])=>{
if(!value) return;
const tag = `<meta property="og:${key}" content="${value}">`;
ogTags.push(tag);
});
const ogMetaTags = ogTags.join('\n');
return `<!DOCTYPE html>
<html>
<head>
<link href="//use.fontawesome.com/releases/v5.15.1/css/all.css" rel="stylesheet" />
<link href="//fonts.googleapis.com/css?family=Open+Sans:400,300,600,700" rel="stylesheet" type="text/css" />
<link href=${`/${name}/bundle.css`} rel='stylesheet' />
<link rel="icon" href="/assets/favicon.ico" type="image/x-icon" />
${ogMetaTags}
<meta name="twitter:card" content="summary_large_image">
<title>${title.length ? `${title} - The Homebrewery`: 'The Homebrewery - NaturalCrit'}</title>
</head>
<body>
<main id="reactRoot">${require(`../build/${name}/ssr.js`)(props)}</main>
<script src=${`/${name}/bundle.js`}></script>
<script>start_app(${JSON.stringify(props)})</script>
</body>
</html>
`;
};
module.exports = template;