How to Use Open Graph Preview for Social-Sharing Metadata

Purpose and suitable use

Open Graph Preview prepares social-sharing metadata markup from the information you enter. It is useful when you want to organise the details that may accompany a page shared on social platforms, such as its title, summary, image reference, page address, site name, content type, and locale. The result reflects the text supplied in the form rather than information inferred from a page. Because the fields are optional, you can start with a title and add supporting details as your preparation develops. This makes the tool suitable for checking which metadata entries are created by a particular set of values before you use the resulting markup elsewhere. It also gives you a simple way to compare a sparse set of details with a fuller set without treating omitted fields as errors. The important starting distinction is that optional inputs may be left blank, while a blank title leads to a successful result with no metadata entries.

Steps for preparing the markup

1. Enter the page title you want represented, making sure it contains text if you want metadata entries. A title is the condition that separates a populated result from the empty-title outcome.
2. Add the description that should accompany the title. With a title present, title and description metadata are generated; this remains true even when the description field itself is empty.
3. Enter an image reference, page address, and site name when you want those values represented. Each corresponding metadata entry depends on its matching field containing a value, so adding one does not automatically add the others.
4. Provide a content type and locale if you want settings other than the defaults. For a titled input, leaving those settings blank produces website for the type and en_US for the locale.
5. Run the operation and read the generated markup. Check that the entries correspond to the values you chose, including the optional fields you populated.
6. Pay attention to characters that have a special meaning in HTML. Supplied metadata values are HTML-escaped before they are placed in the markup, so interpret the displayed encoded form as part of the generated output rather than as an accidental change to your entry.
7. If you are comparing versions, change one group of inputs at a time and review the new structure after each run. This makes it easier to associate an added or omitted entry with the field that caused the change.

Reading populated and empty results

A populated result for a titled input should contain title and description metadata, as well as type and locale metadata. The image, page-address, and site-name entries should be read conditionally: each appears when its own value was supplied, not merely because another optional field was completed. When type and locale were omitted, their output values should be website and en_US, respectively. An empty title has a different meaning from a failed operation. The operation succeeds on that path but returns no metadata entries, so first check the title before treating an empty result as unexpected. The demonstrated empty-title and populated-title paths report success. Use the generated markup as a representation of the information entered into the form. It does not promise a particular display on a specific social platform, because presentation can depend on that platform’s own handling. If the structure is not what you intended, revise the relevant text value or setting and run the operation again rather than assuming that an omitted optional entry indicates a problem with the other fields.

Worked example

A travel editor is preparing social-sharing metadata for a weekend guide and wants its title, summary, image reference, and page address represented in the generated markup.

Enter the title Weekend Guide, the description Ideas for a short city break, the image reference for the guide cover, and the page address for the weekend guide, then review the generated markup.

The result reports success and contains title and description metadata, plus image and page-address entries because those values were supplied. Type and locale entries use the values entered for them.

Limitations

• The output is metadata markup based on the text values you provide, not a guarantee of how a particular social platform will display a shared page.

Common errors

• An optional entry is missing: Its matching field is empty. Enter the intended value in the image, page-address, or site-name field, then run the operation again.

FAQ

What happens if I leave the title empty?

If the title is empty, the operation succeeds and returns no metadata entries. Entering a title changes the result to the populated path, where title and description metadata are included.

Are image, page-address, and site-name fields required?

No. The image, page-address, and site-name fields are optional. Their entries appear when their corresponding values are supplied, while an empty matching field leaves that entry out.

What defaults are used for type and locale?

For a titled input, omitted settings use website as the content type and en_US as the locale. Enter different values when those defaults do not describe the markup you are preparing.