Add support for og meta tags and better SEO discovery.#47
Conversation
| ['meta', { property: 'og:site_name', content: siteData.title }], | ||
| ['meta', { property: 'og:title', content: pageData.title }], | ||
| ['meta', { property: 'og:description', content: description }], | ||
| ['meta', { property: 'og:image', content: `https://wrensecurity.org${image}` }], |
There was a problem hiding this comment.
The hostname shoud be i a (config) variable.
There was a problem hiding this comment.
I added const variables (even for already existing links). The values are taken from env variables, if it's not specified in ENV variable a default value is used.
There was missing type for node in typescript so I was getting an IDE error for the process variable. This was already a problem in the repository in other part. So I added the node type to typescript.
| ], | ||
| transformHead({ description, pageData, siteData }) { | ||
| const image = pageData.frontmatter.image || '/wrensec-logo.png'; | ||
| const htmlPath = pageData.relativePath.replace(/\.md$/, '.html'); |
There was a problem hiding this comment.
TransformContext parameter of the transformHead have a page parameter that should respect the rewrites.
There was a problem hiding this comment.
The page is the same as the pageData.relativePath as we don't configure rewrites for this repository. And even if we did, it returns the path with .md at the end and doesn't do the convert to the actual deployed url. So we need to keep the transformation.
| ['meta', { property: 'og:description', content: description }], | ||
| ['meta', { property: 'og:image', content: `https://wrensecurity.org${image}` }], | ||
| ['meta', { name: 'twitter:card', content: 'summary_large_image' }], | ||
| ['meta', { name: 'twitter:site', content: '@WrenSecurity' }], |
There was a problem hiding this comment.
The twitter account belongs to a config as well.
There was a problem hiding this comment.
Added as configurable const via env variables.
2e7a86c to
3527186
Compare
3527186 to
34c1dad
Compare
This PR lays the groundwork for social sharing previews and search-engine discoverability.
og:*andtwitter:*meta tags. Most are static (og:type,og:site_name,twitter:card,twitter:site) or computed from the page's URL (og:url, canonical link).og:title/og:descriptionreuse each page's existingtitle/descriptionfrontmatter. No new fields were added and the values are falling back to the site-wide description when unset.og:imageis the one tag with a dedicated override: an optionalimagefrontmatter field, falling back to a placeholder logo. Only the home page'stitle/descriptionhave been updated so far; other pages still use generic existing tittles, description fallbacks.<link rel="canonical">per page, reusing the same URL logic asog:url.sitemap.xmlgeneration.robots.txtpointing to the new sitemap.<link rel="alternate">discovery tag for the existingfeed.rss, so feed readers can auto-detect it.