Twitter Card Image

@saxamo

We’re sorry you’re having trouble with a Twitter image not being displayed while sharing the post. I imagine this can be frustrating for you. We’d like to look a closer look.

Checking the Open Graph ‘og:image` value on the page source?of the given page https://gumdropgoblins.com, we do see the image it has is https://gumdropgoblins.com/wp-content/uploads/twittergg.jpg which looks smaller than the recommended size.

The ideal image size and aspect ratio are 1200px X 675px and 16:9, respectively. The maximum file size is 5MB for photos and animated GIFs. As referenced here.

Could you please retry adjusting the image size and see if that works for you?

Thanks for the reply,

Please forgive me but that page clearly indicates that:

Summary cards: These cards display a thumbnail of the featured image, page title, author’s name, and brief description (up to 200 characters long). Images for summary cards should be 120px X 120px and not more than 1MB in file size.

I have tried images larger and they all get cut off. Can you please verify the information again and if you say so I will give that exact image size a try.

Thanks

@saxamo Thanks for your reply.

As for the image specifications you referenced, we expect that those are for images output using the twitter:image meta tag, and not applicable to the Open Graph og:image tag.

Can you please try specifying the twittergg.jpg image in the plugin as the Twitter image on the Social tab of the Yoast metabox for the page, and then try rechecking the page in the Twitter Card Validator and letting us know whether this resolves the issue for you?

To set the Twitter image, you would need to perform the following actions:
?

? ?Go to the Edit screen for the page/post
? ??Scroll down to the Yoast meta box
? ??Click on the Social tab
? ?In the ‘Twitter preview’ area, click on ‘Select image’
? ?Select the twittergg.jpg image and click ‘Select’
? ??Click ‘Update’

Can you please try the aforementioned suggestions and let us know whether this resolves your issue?

Thanks again,

I already had them done. This changes nothing unfortunately.

View post on imgur.com

I really do appreciate your help and will try to get back to testing for you ASAP. Thanks again.

I even changed the image to be the size you left for me in the first post.
<meta property=”og:image” content=”https://gumdropgoblins.com/wp-content/uploads/1200x675px.jpg&#8221; />
<meta property=”og:image:width” content=”1200″ />
<meta property=”og:image:height” content=”675″ />

still nothing.. sorry to say, that first line has that extra code but not in the actual page.. www.ads-software.com is just posting it that way..

• This reply was modified 3 years, 1 month ago by saxamo.
• This reply was modified 3 years, 1 month ago by saxamo.

Hi @saxamo

Upon checking your website, it looks like you’ve set the Twitter card type to ‘summary’. Could you please set the default card type to ‘summary with large image’ and then try to run it through the Twitter Card Validator tool again and see if it then picks up the expected preview?

You can learn more about it here – https://yoast.com/help/setting-up-twitter-cards-in-wordpress-seo/#activate

I have made those changes. I will wait a few hours to check to make sure nothing is being cached. Upon first check twitter card checker is once again spitting out all green in the logs but no image preview. You can check this for yourself. Ill check it again in a few hours. Thanks

@saxamo Thanks for your reply.

We rechecked the the URL in the Twitter Card Validator, however, the preview image is still not appearing for us as expected. We do however see the card type as having been successfully updated to be the Summary Large Image type.

We reviewed the source code and see the following being output for the page:

<meta property="og:image" content="https://gumdropgoblins.com/wp-content/uploads/1200x675px.jpg" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="675" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@GumdropGoblins" />

Whereas the og:image parameter is being output, it appears that this image is not being recognized by the Twitter Card Validator.

If you have specified an image in the Yoast SEO settings on the social tab for the Twitter image, the image you specified there should be being output as twitter:image.

If you have confirmed both WordPress, Yoast SEO, and all of your site’s other plugins and themes are up to date and the issue with the twitter:image meta tag not being output is still occurring, we would next recommend performing a conflict check.

A plugin or theme conflict can sometimes cause functionality problems, errors, or unexpected behavior from the plugin. If you are unfamiliar with checking for conflicts, we have a step by step guide on how to check for conflicts available here: How to check for plugin conflicts.

Yes, everything is up to date, every is auto enabled. Yes, the cards on the social are exactly as they should be and yes we changed the parameters to LARGE SUMMARY.

There are no conflicts at all.. None..

View post on imgur.com

(SIGH)

I remember the days where I would just code this up myself. Something is telling me to purchase the Sydney Pro theme and then just write up the code myself in the child theme header.php.

I really want YOAST to work. I have other websites that I want to use it on that actually make money and have a purpose. However, unless I can get this one silly thing to work and understand why it is such a problem.. well. this is really crazy.. do everything install everything, check everything, update everything, read the entire internet to find some evidence of where the problem is and still nothing.. Hmmmm.. Just me talking out loud.. I know together we can find the solution!

Thanks!

Thanks for following up with us on the Twitter image sharing issue. We understand that you have selected an image for both Facebook and Twitter while using the Twitter Large Summary Card but Yoast SEO isn’t outputting the twitter:image meta.

Even though Yoast SEO isn’t outputting the twitter:image meta on the frontpage of your website, Twitter shall still detect the image that’s being referenced on the og:image meta as the fallback but that’s not working either.

So, when looking deeper, we see the noindex robots meta on the front page of your website that might be causing the issue. The noindex robots meta prevents search engines crawl the relevant page and as well as social media bot like Facebook or Twitter respects the relevant meta as well. So, we recommend you please remove the relevant noindex robots meta from the front page of your website and validate the relevant page again using the Twitter Card Validator to see whether this resolves the issue for you.

We are referring the relevant meta here: <meta name='robots' content='noindex, nofollow' />

I made the change.. I am sure its going to take awhile to work. So.. I will come back in 24 hours and test it at that time and see if anything has changed. I will update this thread at that time. Thanks for your continued support ??

We have tested the front page of your website using the Twitter Card Validator and can confirm the image is appearing fine as expected.

You could now share the front page of your website on Twitter to verify this and hopefully, you’ll see the image with a large summary card as expected.

woohoo! Well now that you figured that out.. awesome!!! Thanks!!!

I would like to be using the summary card not full image. Can you tell me exactly what size I need that to be so that I can use the smaller card and not that huge testing image? I appreciate it!

well I tried again to do the summary card.. I scoured the web looking for sizes and found a few I finally opted for a 800×800 or 1:1 ratio. I picked summary yesterday at like 6pm and now it is 8am the next day and the twitter card preview is not working.. It is keeping my old settings from the first index I guess. The logs are green but show large card and the large image, not what I set it to yesterday and cleared the cache at the same ..

However,
WhatsApp and Slack seems to be doing the correct things.

View post on imgur.com

View post on imgur.com

I just don’t get it.. Trying to get this done has eaten up a lot of time for just stupid twitter card. However, something tells me we are close, so.. looking for a final resolution. Thanks again for all your help. Just starting to get tired after a week.

At this point, we’re out of clue as well. We can confirm that Yoast SEO is generating the correct social open graph meta tags that are responsible for showing the correct image when sharing the page on social media.

In addition, we can confirm the relevant page is showing the correct image when sharing on Facebook as well.

In this case, we are not sure what’s exactly going on at this moment. You may want to reach out to Twitter support for further assistance on this.