X (formerly Twitter) Card Image Render Issue

Publishing help SEO
1

Hi everyone,

I’m facing a frustrating issue with how OG images render when sharing client’s site on X (formerly Twitter).

image

The Problems:

  • Some pages render the OG image correctly, while others don’t render it at all.
  • In some cases, an outdated OG image shows up even after updates.
  • URLs with a trailing slash (/) sometimes break the image rendering.
  • I’ve tried manually adding <meta> tags for Twitter cards on a few pages to test, but it sometimes causes conflicts or doesn’t resolve the issue.

I’ve cleared caches, used Twitter’s Card Validator, and even re-fetched the URLs—but the issue is inconsistent and confusing.

Has anyone experienced something similar? Any tips or fixes that worked for you?

Thanks in advance!

image
image589×473 47.9 KB

image
image590×470 52.8 KB

2

Hi there,

To ensure your Open Graph images work correctly on X (formerly Twitter), here are the key requirements and steps:

For image formats, use uncompressed JPG or PNG files, as X doesn’t support AVIF or WebP formats for Open Graph images. To optimize your implementation, add image dimension meta tags in your Site settings > Custom code tab > Head code section:

<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">

You can verify your Open Graph implementation using X’s Card Validator at cards-dev.twitter.com/validator. While the validator no longer shows previews directly, you can test the appearance by creating a draft tweet with your link.

Remember to publish your site after making any Open Graph image updates for the changes to take effect.

Hopefully this helps! If you still need assistance, please reply here so somebody from the community can help.

3

Hi, thank you for the response. I have tried the provided solution but it is not working still.

Some pages still shows the outdated images

4

Make sure your image is complient with the platforms ( X in this case ) you’re targeting.
That means aspect ratio, dimensions, minimim size, maximum size, maximum file size, and image type. All of those are constraints you must match, and you have to research the current requirements.

That’s a cache issue, check your platforms to see if they have tools to clear the cache.
Facebook’s is here- Sharing Debugger - Meta for Developers
It’s used by a lot of other services so always good to re-fetch any updates you make.

If your new image is not compliant, it might hold on to the old one because it has nothing else to use.

A trailing / generally indicates a directory rather than a file, which would be incorrect for Webflow’s asset hosting.