- Published on
Meta Tags With HtmlWebpackPlugin
Add meta tags for social media with `HtmlWebpackPlugin`.
This article explains how to add social media tags to your webpack project.
Social media meta tags are <meta> tags in the <head> of your web page that control how URLs are displayed when shared on social media.
If you are using webpack you can use the meta option from the HtmlWebpackPlugin to add the social meta meta tags to your web page:
// webpack.config.js
// ...
new HtmlWebpackPlugin({
meta: {
'description': { name: 'description', content: '...' },
'keyword': { name: 'keywords', content: '...' },
'og:title': { property: 'og:title', content: '...' },
'og:description': { property: 'og:description', content: '...' },
'og:type': { property: 'og:type', content: 'website' },
'og:url': { property: 'og:url', content: '...' },
'og:image': { property: 'og:image', content: '...' },
'twitter:card': { name: 'twitter:card', content: 'summary_large_image' },
'twitter:title': { name: 'twitter:title', content: '...' },
'twitter:description': { name: 'twitter:description', content: '...' },
'twitter:image': { name: 'twitter:image', content: '...' }
}
})
// ...