Open math-GH opened 1 year ago
I think the validator is broken: I use almost the same configuration for https://flus.fr/carnet/ and Twitter renders the cards correctly (while the validator also tells me it cannot render the preview).
Looks good to me at least :)
Now:
<meta name="twitter:site" content="@freshrss">
<meta name="twitter:card" content="summary">
You can see that in your screenshot not the summary card is shown. The Twitter summary card has a big image. See: https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/summary
I guess that the validator does not work: the summary needs more Twitter specific meta data. twitter:title
is mandatory. It does not take the Open Graph data :/
That should work:
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="FreshRSS">
<meta name="twitter:description" content="FreshRSS is a self-hosted RSS and Atom feed aggregator. It is lightweight, easy to work with, powerful, and customizable. ">
<meta name="twitter:site" content="@freshrss">
<meta name="twitter:image" content="https://freshrss.org/images/screenshot.webp" />
<meta name="twitter:image:alt" content="Screenshot of FreshRSS. It shows the normal view with a list of read articles." />
I am not so found of adding proprietary attributes such as <meta name="twitter:description" content="..." />
, especially when there are already some very fine (more) standard ones. Otherwise where to stop: why Twitter and not the many other platforms out there.
If needed, there are some fine ontologies (e.g. Dublin Core...) to supplement standard HTML attributes.
(On a side note, a few proprietary ones have made their way to the core of FreshRSS (such as <meta name="apple-mobile-web-app-capable" ...
) which I would rather delete again.)
I think there's a mistake in their documentation too :D They show the summary card with large image, see: https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/summary-card-with-large-image
You can see that it works when I set <meta name="twitter:card" content="summary_large_image">
here: https://twitter.com/flus_fr/status/1558363127787524096
I'm pretty sure Twitter reads OpenGraph tags and I don't like to have specific tags specific to Twitter for the same reasons as @Alkarex (he was faster than me ^^).
Even most of the OpenGraph ones are quite redundant, or at least would be if sites like Facebook would actually listen to standard meta tags. og:image is just about the only one missing.
Then let's remove the <meta>
tags for Twitter. It would be better to have no tags then having it not complete/correct
I think we can remove twitter:site
, but I'm pretty sure twitter:card
is required for Twitter to display the cards.
Edit: OpenGraph tags are officially supported by Twitter btw, see https://developer.twitter.com/en/docs/twitter-for-websites/cards/guides/getting-started "Twitter Cards and Open Graph"
The new website cannot rendered for Twitter: https://cards-dev.twitter.com/validator