#1

Description of issue:

Hi, we’re experiencing an issue where an image is not showing up in a Twitter share. We have all the required meta tags in place as specified in the Card documentation.

Also, Facebook’s share debugger seems to load the image just fine. The share image is hosted on Cloudinary.

URL affected (must be public):

https://areena.yle.fi/1-50996116

Image URL: https://images.cdn.yle.fi/image/upload/f_jpg,c_fill,w_1920,h_1080,q_auto/v1650574864/13-1-50996116-1649838023751

Troubleshooting steps attempted [note that we will not prioritise posts unless there is evidence of following the troubleshooting guides]:

I went through all of the troubleshooting steps mentioned in the link above, and the issue remains unsolved. Please see my findings below:

  • Card Validator indicates that the card’s metadata can be fetched successfully:
    INFO:  Page fetched successfully
INFO:  23 metatags were found
INFO:  twitter:card = summary_large_image tag found
INFO:  Card loaded successfully
  • When the page source is viewed, the right metadata tags are in place
  • The page contains twitter:card meta tag specifying a valid card type (summary_large_image)
  • Executing curl -v -A Twitterbot https://areena.yle.fi/1-50996116 in command line returns the correct meta tags. Server also returns a HTTP 200 response code and a valid Content-Type header (text/html; charset=utf-8).
  • Metadata is not added with JavaScript
  • Site and the image is fully accessible for Twitterbot/1.0 user-agent. There is no robots.txt in the site root, and the robots.txt on the image host is all commented out.
  • We are not using Wordpress (or other CMS/blogging platform) plugin
  • We are putting a specific URL into the Validator, and that URL is presented above.
  • We are using a supported Card type summary_large_image. There is no typo.
  • Image conforms to all the requirements. It’s 16:9 JPEG image, 1920 pixels wide and 1080 pixels tall, weighs about 0.12 megabytes. It has correct headers (content-type: image/jpeg). The image is referenced to with an absolute URL (with protocol piece as well).
  • We’re not seeing any validator error messages.
  • We’re using fully qualified DNS domain names.
1 Like
#2

This is really weird. Thanks for doing all the checks here.

The only thing I can currently think of is that the URL format is “unusual” with the comma-separated parameters in it. I don’t see other obvious reasons for this not to be working.

#3

Thank you for checking in, Andy. We have been using these Cloudinary transformation URLs containing commas for many years, and we’ve yet to come across with any issues.

Would it be possible for you to run some checks on your end? Do you happen to have any logging in place, that could help in figuring this out? If you need anything from me, just ask away. I hope we could sort this out as soon as possible.

#4

I was successfully able to get both the page and the image but I don’t have visibility to logs that would show why the image is not showing up. Have you used the transformation URLs for cards in the past? In that case, I’m happy to accept that is not the problem - it was just something that I spotted and thought could be a possible cause.

Does this happen to multiple pages, or only for this one page and image?

#5

We have used the transformation URLs successfully for cards in the past. See for example our service’s main page https://areena.yle.fi/tv has image with transformation URL and it appears correctly in the Card Validator. In fact, all of our service’s images (including Open Graph images in question) use commas in the image URLs, without any noticed issues before this.

This seems to happen to most of the pages on our service now (see https://areena.yle.fi/tv/ohjelmat/uutiset-ja-ajankohtaiset and https://areena.yle.fi/1-50944350 for example). Previously, they have all worked. On the other hand, many similar pages still have card images just as I would expect them to have (for example https://areena.yle.fi/tv/ohjelmat/elokuvat).

#6

@andypiper, is there any progress on this one? Twitter functions as a major channel for our content producers and users to share our audio and video content to their followers. We’re receiving a large amount of reports of missing card images, and the issue seems to concern almost all pages on our site.

Is this thread the best way to track this issue, or is there an another way to create an issue somewhere to track it?

#7

There’s no formal support for the web cards features / issue tracker; this forum is a way to ask questions about the feature.

I don’t have any specific update here. I just checked https://areena.yle.fi/tv/ohjelmat/uutiset-ja-ajankohtaiset and it Tweets with a large summary card with image; but https://areena.yle.fi/1-50944350 does not seem to show an image.

In the first case, I see twitter:image set to https://images.cdn.yle.fi/image/upload/d_yle-areena.jpg,f_auto,fl_lossy,q_auto:eco/v0/13-57-1645008210077.jpg. In the second case, I do not see twitter:image in the page, but I do see og:image (which should work if the image is the correct dimensions). I wonder whether some cache somewhere along the line has got “stuck”. Cards usually get refreshed every 7 days on our side.

1 Like
#8

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.