Page MenuHomePhabricator

Twitter cards don't work for any projects besides Wikidata
Closed, ResolvedPublic2 Estimated Story Points

Description

Currently sharing on Facebook, Whatsapp and other social networks displays a nice image, however on Twitter nothing happens as we haven't opted in to support their service.

Twitter uses og tags but requires the following tag to show we've opted in. Shall we add it?

<meta name="twitter:card" content="summary_large_image">

Update: A mini- reverse-engineering experiment shows that Twitter can parse cards on a page from pure og meta tags, we don't need to add a twitter:card. Also, og:description summaries are optional and will be implemented in separate task T213505, so we can deploy an interim set of tags even before the description is ready.

Related Objects

Event Timeline

There are a very large number of changes, so older changes are hidden. Show Older Changes

I've confirmed that Wikipedia URLs still don't expand to a [corporation redacted] card on this major service. It still looks like,

Sifting through all the helpful discussions above, I was able to update the minimal change needed to enable [corp]cards:

<meta property="og:type" content="summary"/>
<meta property="og:title" content="Holdin on to Black Metal"/>

The result is better than half-bad, in my opinion it's an incremental step forward and we should take the leap:


I like the idea of putting this in TextExtracts, and it even makes sense in case we also decide to do T213505: RfC: OpenGraph descriptions in wiki pages. I'm uploading a work-in-progress patch for the minimal change…

There may be some interference with Wikidata, please see the commit summary.

Change 574024 had a related patch set uploaded (by Awight; owner: Awight):
[mediawiki/extensions/TextExtracts@master] [WIP] Minimal metadata to enable OpenGraph cards

https://gerrit.wikimedia.org/r/574024

OpenGraph turns out to be pretty trashy, even as far as its controlling corporate company goes. Here's a short criticism. After digging into this, now I'd prefer if Twitter could just read our <title> and <meta description= rather than spamming the Internet with duplicate data, eh? But let's go ahead with the minor code workaround, and undeploy again once Corporation upgrades their scrapers. The benefit is that we get cards immediately, and probably take 3rd-party MediaWiki installs into the future along with us.

Change 574029 had a related patch set uploaded (by Awight; owner: Awight):
[mediawiki/extensions/Wikibase@master] Use quasi-open metadata key rather than branded one

https://gerrit.wikimedia.org/r/574029

Change 574029 merged by jenkins-bot:
[mediawiki/extensions/Wikibase@master] Use quasi-open metadata key rather than branded one

https://gerrit.wikimedia.org/r/574029

Change 574024 abandoned by Awight:
[WIP] Minimal metadata to enable OpenGraph cards

Reason:
Doesn't belong in TextExtracts, per reviews.

https://gerrit.wikimedia.org/r/574024

Change 574980 had a related patch set uploaded (by Awight; owner: Awight):
[mediawiki/core@master] [WIP] Minimal metadata to enable OpenGraph cards

https://gerrit.wikimedia.org/r/574980

awight renamed this task from Sharing on Twitter doesn't use the Cards format. to Twitter cards don't work for any projects besides Wikidata.Apr 6 2020, 1:43 PM
awight updated the task description. (Show Details)
kchapman added a subscriber: kchapman.

tagging Platform Engineering, I believe this also is an issue in Whats App

Clarakosi added a subscriber: Clarakosi.

Looks like there is a WIP patch. @awight are you still working on this?

BTW I'm still happy to volunteer myself as a reviewer for any changes that address this.

@kchapman as someone who works with WhatsApp messaging professionally, I can state that WhatsApp requires Open Graph Protocol for link preview generation.

Change 664963 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/core@master] Add og:title to page

https://gerrit.wikimedia.org/r/664963

Change 664967 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/PageImages@master] Revert "Revert "Add twitter meta tag for image""

https://gerrit.wikimedia.org/r/664967

Change 664967 abandoned by Jdlrobson:
[mediawiki/extensions/PageImages@master] Revert "Revert "Add twitter meta tag for image""

Reason:
Folded into https://gerrit.wikimedia.org/r/c/mediawiki/core/ /664963 - better to centralize all this.

https://gerrit.wikimedia.org/r/664967

Change 664963 merged by jenkins-bot:
[mediawiki/core@master] Add to configuration to allow addition of certain tags to page

https://gerrit.wikimedia.org/r/664963

Next step. Enabling it on beta. Later on Wikipedia.

Change 666720 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[operations/mediawiki-config@master] Enable og tags on labs wikis for testing

https://gerrit.wikimedia.org/r/666720

Change 666720 merged by jenkins-bot:
[operations/mediawiki-config@master] Enable og tags on labs wikis for testing

https://gerrit.wikimedia.org/r/666720

With og:type and og:title, it works:

Should we deploy this on wikipedia next week?

I need to run these by Olga and Alex first. There are some subtle differences between the configs I just enabled. I can deploy to production once that's done.

yes, og:title and og:type are required (my change on de.wikipedia had no effect)

twitter:card is optional but has the following effect which may be desirable from a product perspective:

Okay so if we enable either of the two above the following happens:

  1. Twitter renders /something/
  2. Some smaller platforms (only Slack currently known one) will no longer show a description when shared
platformbeforeoption 1option 2notes
twitter
landscape card with option 2. Clear improvement either way.
fb
no changeno changeno change
whatsapp
no changeno changeWhatsapp doesn't support picture with a size greater than 300KB. [1]
slack
see option 1no description
wechatno thumbnailno changeno change

[1]

twitter:card is optional but has the following effect which may be desirable from a product perspective:

I understand the usefulness but please no vendor specific tags in Wikipedia.

I understand the usefulness but please no vendor specific tags in Wikipedia.

Why would we want to avoid vendor-specific tags (or rather new vendor-specific tags since we already use <link rel="apple-touch-icon">) if the vendor is popular enough?

Exactly because it is popular, I would argue. Not only does it give a dominating platform an additional advantage – a platform that's already more powerful than pretty much all competitors. It also acts as a signal: look, Wikipedia specifically supports Twitter (and Apple), but nothing else.

For me it's a matter of principle. I don't want to send a message that Wikipedia bows to corporations/governments/etc. specially for something that has an alternative (OpenGraph)

Can we experiment more with og:type? Has anyone else done the reverse-engineering to find how these map to twitter:card?

It would be nice to test this for Commons, if possible, please - is there a beta Commons that this could be set up on? (Also, maybe deploy on Commons to test, before deploying to Wikipedia?)

Can we experiment more with og:type? Has anyone else done the reverse-engineering to find how these map to twitter:card?

I've been talking to the "expert" and my understanding is the Twitter card is only used for the image thumbnail type https://twitter.com/vjo/status/1362339509619339265 @awight feel free to join the conversation if you are on Twitter, otherwise I can relay any questions on your behalf.

It would be nice to test this for Commons, if possible, please - is there a beta Commons that this could be set up on? (Also, maybe deploy on Commons to test, before deploying to Wikipedia?)

I plan to enable that on all wikis next week.

We can iterate from there, perhaps having project-specific configurations if necessary.

For me it's a matter of principle. I don't want to send a message that Wikipedia bows to corporations/governments/etc. specially for something that has an alternative (OpenGraph)

It seems like we are leaning towards the design without twitter:card anyway...

Change 667007 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[operations/mediawiki-config@master] Enable og tags on non-wikidata wikis

https://gerrit.wikimedia.org/r/667007

I plan to enable that on all wikis next week.

@Jdlrobson Hallo! Please could you/someone suggest how to describe this for a Tech News entry? I imagine something like:

"Links to Wikimedia pages from some external social media sites such as Twitter, will display more content such as larger images and clearer links. This is due to a small change to our meta-data. Further improvements to show page-content excerpts, will come later. [link to this task]"

Tweaks for clarity/accuracy appreciated. I'll add it to the draft on Friday.

I'd also suggest adding a slightly more detailed summary into this Task's description, so that it's easy for everyone to see at a glance what has purposefully changed (without having to read/skim this whole thread). Perhaps copying the "before/after" matrix (just with whichever Option is being used) from T157145#6858470 above.
Thanks!

@Quiddity my plan was to create a new User-notice after I've done it so can you please hold off on adding that to the draft?

Sounds good. Just let us know. Ideally by moving current task into the "Announce in next Tech/News" column on that workboard. Thanks!

ovasileva set the point value for this task to 2.Mar 1 2021, 6:29 PM

some smaller messaging platforms

platformbeforeafternotes
Signal
no change
iMessage (iOS)
no change
Discord
no change

Change 667007 merged by jenkins-bot:
[operations/mediawiki-config@master] Enable og tags on non-wikidata wikis

https://gerrit.wikimedia.org/r/667007

Mentioned in SAL (#wikimedia-operations) [2021-03-02T00:43:25Z] <urbanecm@deploy1002> Synchronized wmf-config/InitialiseSettings.php: 6cc8521310d6e952fc7d0b23579021b650828764: Enable og tags on non-wikidata wikis (T157145) (duration: 00m 56s)

Change 574980 abandoned by Awight:
[mediawiki/core@master] [WIP] Minimal metadata to enable OpenGraph cards

Reason:
An alternative has been merged :-D

https://gerrit.wikimedia.org/r/574980

og:title seems to receive HTML in current version:
https://en.wikipedia.org/wiki/User:Chlod
<meta property="og:title" content="&lt;span style=&quot;position:fixed;top:-1000vh;&quot;&gt;User:&lt;/span&gt;&lt;span style=&quot;font-family:&amp;#39;Roboto&amp;#39;,&amp;#39;Arial&amp;#39;,sans-serif;font-weight:300; color:black;&quot;&gt;Chlod&lt;/span&gt;"/>

It’s not a big concern for articles, but considering that <title> itself has no HTML in it (while still displaying results of applying DISPLAYTITLE), this should be possible to fix.

Change 669971 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/core@master] Use getHTMLTitle instead of getDisplayTitle

https://gerrit.wikimedia.org/r/669971

Change 669971 merged by jenkins-bot:
[mediawiki/core@master] Use getHTMLTitle instead of getDisplayTitle

https://gerrit.wikimedia.org/r/669971

alexhollender closed this task as Resolved.EditedWed, May 5, 8:13 PM

the current state of things for posterity:

twitter
facebook
telegram
whatsapp
signal
slack
discord
google fi
google chat
wechat

(@Jdlrobson any thoughts on WhatsApp as a follow-up task?)

I just want to say, great work all! This is a big deal...

Per T157145#6858470 Whatsapp works provided the thumbnail is below 300kb. Try https://en.wikipedia.org/wiki/Journey_to_the_West:_Conquering_the_Demons for example. We'd need to coordinate with Platform Engineering to see if we can address that. Have opened T282065.

@Jdlrobson one final addition to the audit: WeChat (which according to this chart is quite popular: https://www.statista.com/statistics/258749/most-popular-global-mobile-messenger-apps/). Any ideas on that one?

Wechat doesn't do previews for any link as far as I'm aware (I use it quite actively with my partner's family).