When you share a page or a post on social media, certain information -- called metadata -- is automatically pulled in as well, including a description and a thumbnail image. This image is known as an Open Graph (OG) image, a standard created by Facebook and adopted by other social media platforms.
Within Composer, there are several places where you can set and override the OG image: the domain level, the page level, and the element level.
Domain level
To set the default image that will appear whenever a page or post is shared from your website, go to the Domain Settings by clicking on the three-dot More Actions menu next to the domain you want to customize.
On the “SEO” tab, scroll down until you see the “Default Open Graph Image” setting. Browse in Resources or File Manager to find the image you want to use and select it. Keep in mind when you choose the image that this will be used for all pages, unless you set a different one to override it on the page level.
Page level
If you would like to use a different image when a particular page is shared, you can upload that image in the Page Settings.
Click on the gear icon in the bottom-right corner of the Composer menu, then click on the “SEO” tab. Ensure that the “Custom” checkbox under “Open Graph Image” is enabled, then browse for an image in Resources or File Manager.
If no custom image is set, the shared page will use the site’s Default Open Graph Image.
Element level
The page-level OG image will work for a normal page, but if you have a page that pulls dynamically from Posts, you may want to share a specific image with each post. In this case, go to the element settings for the Post element in Single format and select the “Override Page Title and SEO Metadata” checkbox underneath “Formatting.” This setting will use the thumbnail image for the post as the OG image instead of what is set at the page or domain level.
Note: If a URL has never been shared on social media before, the platform may not properly capture all of the relevant metadata, including the OG image.
In order to make absolutely certain that Facebook is pulling the proper metadata, you can use the Facebook Sharing Debugger. Twitter has a similar tool called the Card Validator.
Facebook has also put together a useful document about metadata best practices, covering things like image dimensions and other parameters to make content sharing as smooth as possible.
Comments
Please Sign in to leave a comment if you don't see the comment box below.