Image displayed when sharing links from biouno.org

[kinow]

Follow-up from #27

@imoutsatsos, should we have one image used for all links, or should we specify one per page? Google/YouTube/Twitter/FaceBook/etc try to get one image from the link shared.

But it also looks for Open Graph tags. They are special tags used in the HTML code to tell the other sites which information we have (it's some vocabulary from semantic web, you probably use something similar for metadata).

We can test it with a tool like this one: https://opengraphcheck.com/

Here's a post from NIWA: https://opengraphcheck.com/result.php?url=https%3A%2F%2Fniwa.co.nz%2Fnews%2Finternational-climate-experts-gather-in-wellington

And here's our main page: https://opengraphcheck.com/result.php?url=http%3A%2F%2Fbiouno.org%2F

So we have a few options:

• Add an image to landing page, with the open graph tags.
• When a post has an image, we have to remember to copy the example HTML with Open Graph annotations (or we can look for a Jekyll plugin that does that)
• Add a general image for Open Graph. But that way I don't believe we would be able to overwrite it. So it would be always the same image.

WDYT?

[kinow]

@imoutsatsos the new version of the theme has something we can try and see if that works in the next post: https://mmistakes.github.io/minimal-mistakes/docs/layouts/#open-graph--twitter-card-images