Trouble with twitter showing the image of a link

Hey @kilgore-trout

We understand that you’re having trouble with having the image appear in the social previews for Twitter. Would it be possible for you to provide us with a URL of where this issue occurs so we can test this out on our end?

You can also refer to this article for more information – https://yoast.com/help/twitter-sharing-not-working/

Also, did you try setting the option for Twitter cards from ‘summary’ to ‘summary with large image’? That might also be one potential cause as to why you aren’t seeing the image. You can check the settings under your WP admin dashboard > SEO (sidebar) > Social > Twitter tab.

Thanks for your response Michael. I did find the Twitter validator page and have been experimenting with it. Looking back at what I have found, I think it is safe to say that Yoast is doing their part perfectly. Yoast correctly posts the meta tags with the correct urls.

I have been in touch with twitter support and things started working shortly after I contacted them,(lol) but not totally. Sometimes the image shows up. Sometimes it shows up but is delayed by up to a couple of hours. And sometimes it just doesn’t appear. Twitter had no explanation but said I needed to just wait for it to show up. Great idea, right?

So at this point I see it likely as an internal twitter problem and nothing to do with wordpress or Yoast. Does that seem like a reasonable assumption?

Thanks Michael.

tom

Hey @kilgore-trout

Well, if you are seeing the correct Open Graph and Twitter tags in the page source (generated by the Yoast SEO plugin) and when running the URL through Twitter’s Card Validator Tool and are getting the expected preview, but it’s only when you try to actually share on Twitter that you don’t get the expected preview, it might definitely be the case.

With that being said, could you provide us with an example URL of one of your recent posts or pages so we can try and investigate this a bit on our end?

Thanks for your willingness to help figure this out. Here’s an example. This Facebook post https://www.facebook.com/tomrgolden/posts/5285300634837160 uses the wrong image. Compare it to the twitter post that used the correct image. https://twitter.com/trgolden/status/1509971942635450379?s=20&t=vkm-90a_lIpcg6aVbBp_8w

When I say “correct image” I mean the one that is selected in the wordpress post yoast social section. The basketball image is selected in both the twitter and the facebook sections but it only shows up in the twitter post. The odd thing is that even though the wordpress page shows that the basketball image is selected for the facebook post the actual meta tag shows

<meta property=”og:image” content=”https://menaregood.com/wp-content/uploads/2022/02/bus.png&#8221; />

And that is the link to the bus image. So Facebook is correctly choosing the iamge but somehow yoast is not putting the correct link into the meta tags. And yes, I have removed and replaced the image in the Yoast social section multiple times but it has no impact.

Any easy fix for this?

Thanks for any help.

Tom

https://menaregood.com/wp-content/uploads/2022/04/Screen-Shot-2022-04-01-at-3.41.29-PM.png

Hi @kilgore-trout

Thanks for providing all of this information!

We do have an open issue in our GitHub repository to extend support for .webp images as they do seem to be working for Twitter tags, but not for the open graph tags. We don’t have an ETA as to when it’ll be addressed, but it is on our radar and has been logged.

This is likely why the og:image tag is using the fallback of the bus image instead of the basketball image. Could you try using an image in another format such as .jpg or .png and see if it updates the og:image tag and so that you can get the expected social preview when sharing on Facebook?

Thank you very much for pointing out that the image format was .webp I hadn’t even noticed. I am glad to say that when I resaved it as .png that yoast used the correct image meta tag and twitter showed the image as expected.

Needless to say I won’t be using webp images in the near future. Thank you!

Can you recommend a video that goes over the basics of best preactices for setting up yoast?

Many thanks, Tom

Hey Tom,

We have a configuration workout in the plugin itself (SEO > Workouts), as well as a configuration guide on our site, and we also have a free course in Yoast Academy where we take you through the plugin and its features here: https://academy.yoast.com/courses/yoast-seo-for-wordpress-block-editor/

I marked this thread as resolved due to a lack of activity by the original poster. The original poster is always welcome to re-open this topic.

If you are not the original poster but have a similar issue, please read this post before opening a new request.