A package for dynamic generate og image for blog/posts based in templates simples and customs, support all platforms JavaScript & TypeScript.
Start
npm install open-graph-dynamic
#or with yarn
yarn add open-graph-dynamic- create data with for post content, exemple:
import { openGraphInputType, openGraphOutputType } from 'open-graph-dynamic';
const data: openGraphInputType = {
title:
'Automatically Generate OG Images From Post Content Automatically Generate OG Images From Post Content Automatically Generate OG Images From Post Content',
tags: ['#next', '#react', '#microfronds'],
timestamp: 'November 11, 2022',
url: 'yazaldefilimone.dev',
user: {
name: `Yazalde Filimone`,
username: `@yazaldefilimone`,
image: 'https://github.com/yazaldefilimonepinto.png',
},
};
// pass data of function openGraph
let ogImage: openGraphOutputType;
(async function () {
ogImage = await openGraph(data);
})();- Exemple In ReactJs:
function SEO(props) {
//...
return (
//...
{ogImage && <meta property="og:url" content={ogImage.source} />}
//...
)
}Result:
