An example:
Not yet reproducible with any other instance of Discourse (I experimented with tweets for four other instances).
@staff please, maybe check both:
– do the URLs refer to the assets? Is each asset in a required format? And so on.
Thanks
If it helps: I do not recall seeing the black lumps around 2017-04-13. So maybe the issue arose from an admin preference that was set some time after that date.
I’ll put that on a github issue. Sadly there is no specific repo or so, but I assume It makes sense to have it as a task there: https://github.com/opensourcedesign/organization/issues/90
@staff please double-check that admin settings do not inappropriately refer to items in the opensourcedesign.net domain.
From Assets for the site design:
4.… get the path to the uploaded images …
5.Paste those image paths into basic settings …
Some of what’s under black rectangle (no image) in some tweets that refer to pages in the discourse.opensourcedesign.net domain · Issue #90 · opensourcedesign/organization · GitHub makes me suspect that some admin settings are not yet making proper use of assets in Assets for the site design.
Thanks
A sign of possible experimentation with a different logo (opensourcedesign-logo-inverted.png) but again, it’s not in an expected domain:
From a copy of the log (before I retired):
– again, there’s the opensourcedesign.net domain. From what I recall of site administration (I learnt some time around 2017-04-11), that’s not a proper approach.
Instead: need to make proper use of – and refer to assets within – Assets for the site design.
OK, I fixed that now.
I must say, that whole post-to-thread, copy URL approach is a bit counterintuitive…
Thanks 
I see some improvement already.
Has default_opengraph_image_url received attention?
We have http://iframely.com/debug?uri=https%3A%2F%2Fdiscourse.opensourcedesign.net%2Ft%2Finvision-invisionapp-com%2F189 for a topic that is linked from a tweet that was very recently sent by @pdurbin
@discourse please: might it help to use a smaller logo? Or is the problem more likely a rogue admin setting reference to the image in the opensourcedesign.net domain?
As far as I am concerned, I replaced the logo for twitter with the proper (aka discourse-uploaded) link to the image.
I checked the tweet and I think there’s a problem with that specific image:
If you examine Twitter source for that image
<img class="u-block" data-src=" https://pbs.twimg.com/card_img/868593239225503748/aBtlG5xA?format=png&name=600x314" alt="Photo published for InVision (invisionapp.com)" src=" https://pbs.twimg.com/card_img/868593239225503748/aBtlG5xA?format=png&name=600x314 ">
The actual image is a black rectangle:
https://pbs.twimg.com/card_img/868593239225503748/aBtlG5xA?format=png&name=600x314
Thanks @discourse the topic that’s referred from https://twitter.com/philipdurbin/status/868795340354400256 does have a YouTube video in the opening post, and I do recall reading of a case (not this forum) where the presence of a video in a Discourse topic caused a problem in a tweet, but I don’t think that’s the problem here.
https://twitter.com/opensrcdesign/status/864001489437642752 from two weeks ago refers to something other than an opening post by @pdurbin and this tweet appears OK, Twitter presents Philip’s avatar on Discourse.
Results of a few more test tweets a few minutes ago:
The likelihood of a black rectangle appearing when a tweet refers to a topic (not to a numbered post) in this forum suggests to me that there remains an issue, or combination of issues, with local admin settings.
In the related GitHub issue it was observed that something was extraordinarily large. Whilst that one thing may be no longer an issue, the first of the five screenshots above does suggest that a more appropriately sized image (not necessarily a logo, not necessarily square) should be applicable somewhere in the admin settings.
HTH
Cards Markup Tag Reference — Twitter Developers
Summary Card with Large Image — Twitter Developers
2015-07-31:
https://sproutsocial.com/insights/twitter-cards-guide/
2016-08-03:
The Definitive Guide to Twitter Cards | AdParlor
@jdittrich sorry for returning to this topic (after the detour to GirHub) but my gut told/tells me that some Discourse staff expertise may be required and it’s easier to address @discourse from here.
https://canada1.discourse-cdn.com/flex029/uploads/opensourcedesign/original/1X/cd87a99dc945baf84d336f187cc0e663c125ad1b.png
https://canada1.discourse-cdn.com/flex029/uploads/opensourcedesign/original/1X/34fcdabbb1fa57f185a38afd18f77512063f2f3b.png
@staff if you like, experiment with the first of those two URLs for one or both of the following:
default_opengraph_image_urltwitter_summary_large_image_urlhttps://github.com/opensourcedesign/opensourcedesign.github.io/blob/c039be7f78deecabbb9309e49546db923a896a88/images/opensourcedesign-logo-text-narrow.svg imported to GIMP:
If the second image (673 x 157) is used, I suspect that the ratio will cause a Twitter representation to be cropped.
Twitter-specified minimum dimensions of 300x157 for twitter:image
Not sure; apparently twitter doesn’t like this PNG. If you view source on
the target page, in the markup you will see:
<meta name="twitter:image" content=" https://canada1.discourse-cdn.com/flex029/uploads/opensourcedesign/original/1X/8cd739a58030a4afeb37abf872f5ffd3319bbc63.png" />
Opening the image
It is a 512x512 PNG with alpha transparency. It could be the size, or it
could be the alpha transparency that Twitter doesn’t like.
Thanks again.
Also remarkable: the first of yesterday’s five shots appears to be a cropped representation of an inverted logo; and earlier (2017-05-27),
Another cropped appearance of the inverted logo: https://twitter.com/opensrcdesign/status/868205626308087808
At any rate, one way to deal with this is to put an image in the first post
that you want to be used when people link to the topic. This also applies
to individual posts if someone deep links to an individual post, the first
image in the post is used.
I don’t disagree but still, my gut tells me that there might be an issue with an admin setting referring to something in the opensourcedesign.net domain.
With non-extended Firefox 53.0.2:
@staff, please consider the mixture of:
opensourcedesign.netSure, but let’s aim to resolve the underlying issue(s).
I changed the Twitter summary large image to https://raw.githubusercontent.com/opensourcedesign/opensourcedesign.github.io/master/images/opensourcedesign-logo-text-narrow-inverted.png – should look better now as a quick fix.
Please, is there a reason for not following Discourse’s standard instructions in Assets for the site design?
Nope, not yet, it’s still black rectangles galore.
Also:
@staff please try the first of the URLs suggested at Twitter: black rectangle, or cropping of different types of inverted logo, in some tweets that refer to pages in the discourse.opensourcedesign.net domain - #11 by grahamperrin above.
Amongst the test results:
I changed the twitter and the opengraph images to using the URL I copied from the images which I uploaded in the assets thread. If I got it right, this was the recommended way of doing it (? @grahamperrin)
Thanks, that sounds right but most of the previously affected tweets remain affected by blank rectangles.
Also now in some tweets we get a cropped version of a different oversized image:
Can you tell where, in admin settings, https://raw.githubusercontent.com/opensourcedesign/opensourcedesign.github.io/master/images/opensourcedesign-logo-text-narrow-inverted.png is specified?
That’s in the raw.githubusercontent.com domain.
Filtering or browsing the log may prove useful.
Today’s inverted logo (below) from a GitHub domain appears different from a previous inverted logo.
