Media & Design

Open Graph Tag Generator

Generate title, description and Open Graph tags for a page.

The image address is copied into the tag. It is not fetched.

Results appear here.

What the result means

The result is a block of tags for the head of an HTML page. A title element and a meta description cover the ordinary title and the short summary. Open Graph tags repeat the title, the description, the page URL, the image URL, and the type, which is either website or article. The Twitter card is summary_large_image, so clients that understand it will ask for a wide picture. Quotes, ampersands, and angle brackets in the values are escaped before they are placed in attributes, so a title cannot break the markup. The image field is only the address you typed. This page does not fetch it, measure it, or check that the file exists. Empty fields are still escaped and emitted. You choose what to keep on the live page.

Related tools

Advertisement

Questions

What is og:image?

og:image is the address of the picture a chat app or social site may show in a preview. This tool only writes that URL into the tag. It does not download the picture.

Where do I paste this?

Paste the snippet into the head element of the HTML page it describes. Remove an older title or description if the new tags would duplicate them.

Does this check that the image exists?

No. The image field is not fetched, measured, or opened. A broken address is still written into og:image.