How to use?
Add the following meta tag to <head> section of your HTML page and replace highlighted tokens:
<meta property="og:image" content="https://og.hugosum.com/v0/png?title={title}&author={author}&photo={photo}&url={url}&theme={theme}" />
FAQ
What is OpenGraph?
OpenGraph is a protocol that allows web pages to become rich objects in a social graph. It is used by social media platforms to display links with rich content.
How do I generate OpenGraph meta tags?
You can use the OpenGraph Image Generator to create and preview OpenGraph meta tags. Fill out the form with your desired values and copy the generated meta tag into your HTML.
What image formats are supported?
The supported image formats are JPEG, PNG, WEBP, and SVG.
What is the maximum image size?
The maximum image size is 5MB.
Why are OpenGraph meta tags important?
OpenGraph meta tags are important because they control how your content is displayed on social media platforms. Properly configured tags can increase engagement and click-through rates.
Can I use OpenGraph meta tags for X/Twitter?
Yes, X supports OpenGraph meta tags. However, X also has its own set of meta tags called Twitter Cards. It's a good practice to include both OpenGraph and Twitter Card tags for optimal compatibility.