When troubleshooting the featured image in your social preview, consider how social previews work, what the ideal featured image dimensions are, and how different social networks can affect the appearance of your featured image.
How social previews work
A social preview is built on meta tags in the <head> section of your page HTML. These tags are part of the Open Graph protocol, which enables any web page to become a rich object in a social graph. These tags tell social media sites like Facebook, LinkedIn, and Twitter what to focus on when creating a preview of your shared link. The basic meta tags are:
- og:title: the title of your content.
- og:type: the type of your content, such as a video or a web page.
- og:image: the URL of the image to represent your content.
- og:url: the unique URL of your content that will be used as its permanent ID.
These tags are automatically set for blog posts: the title, meta description, and the featured image. For landing pages and website pages, the featured image must be set manually.
What should I do if my featured image isn't displaying correctly?
If your featured image is not displaying correctly in your social preview (e.g., the image is cut off or the ratio is incorrect), you may need to edit the image so it has the right dimensions for the social network you're posting to.
What are some social network issues that can affect my featured image?
Apart from using the correct meta tags and having the right image dimensions, there are several social network-specific issues that may affect your featured image:
- Facebook: use the Facebook Sharing Debugger to surface any warnings or errors with your meta tags, or to scrape the content URL again so it generates the most current Facebook link preview.
- Twitter: use the Twitter Card Validator to surface any warnings or errors with your meta tags, or to scrape the content URL again so it generates the most current Twitter card preview.
- LinkedIn: use the LinkedIn Card Inspector to surface any warnings or errors with your meta tags, or to scrape the content URL again so it generates the most current LinkedIn card preview.