Review metadata exposed by Godot pages (OG tags?) about godot-website

[akien-mga]

Thanks for those info @fleskesvor. I went quick and dirty and added Twitter Card metadata in the header of blog posts (a1ab588). Someone more experienced than me should have a look at harmonizing how we handle the different kinds of pages and make sure that we expose relevant metadata everywhere.

[akien-mga]

It seems to have gotten worse (since the update?): https://developers.facebook.com/tools/debug/sharing/?q=https%3A%2F%2Fgodotengine.org%2Farticle%2Fgodot-3-renderer-design-explained

Provided og:image URL, https://godotengine.orghttps://godotengine.org/storage/app/uploads/public/59c/821/f4a/59c821f4a5e6c895938383.jpg was not a valid URL.

[pcvonz]

I addressed the og:image issue. Problem was on this line. I suppose that the update to the blog plugin or website made it so that {{ post.featured_images[0].path }} provides the full url.

[akien-mga]

It would be really nice to get this fixed ASAP, our blog posts are shared more and more and Twitter and it looks terrible that metadata is not available:

[fleskesvor]

There's a lot of different "standards" used to enrich sites with meta content, but here's a list of some it might be worth looking into:

• https://developer.twitter.com/en/docs/tweets/optimize-with-cards/overview/summary
• http://fivefilters.org/
• site maps: https://support.google.com/webmasters/answer/183668?hl=en

Site maps have been around for ages, and is the easiest way to control which links search engines display.

There's also a "new" standard which has tons of options for marking up content like company information, content categories, movies, recipes, etc., but at the moment, I don't remember what it's called.

[fleskesvor]

I was thinking of RDFa. This page has a list of some alternate formats: https://developers.google.com/custom-search/docs/structured_data

http://schema.org/ has a huge vocabulary for structured data, but that's probably not of interest for this purpose.

[fleskesvor]

It looks like Twitter supports the open graph protocol as well, which should have much broader support: http://ogp.me/

Twitter also has a test tool, which can be used to check if your cards look the way you want them to: https://cards-dev.twitter.com/validator

There's an example of mixing their own meta tags with the open graph protocol at the bottom of this page: https://developer.twitter.com/en/docs/tweets/optimize-with-cards/guides/getting-started#opengraph

[brainsick]

I think I can help. I don't have any first hand experience with October CMS but I've watched the blog tutorial and understand the basics. I've perused the repository here and have a basic lay of the land.

To understand the markup required to correctly populate the OGP tags, I need to understand/see how the blog posts themselves are created/marked up. To that end, is it possible to get a read-only account in the CMS system where the blog posts are being created?

Alternatively, I don't see the posts themselves in the repository, so I'm guessing they're sitting on disk on the server or in an operational database. Is it possible to get a copy of the directory/contents for say the Beta 2 article?

Maybe screenshots of all the screens/files you created/attached in the CMS to create the article? It would help to see your side of the workflow.

Nevermind, clearly the basics are working as is evidenced here.

    <meta property="og:image" content="https://godotengine.org/storage/app/uploads/public/5a3/c39/918/5a3c399188781933894734.jpg" />
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:site" content="@godotengine" />
    <meta name="twitter:title" content="Dev snapshot: Godot 3.0 beta 2" />
    <meta name="twitter:description" content="After three weeks of testing of the 3.0 beta 1 snapshot, we&#039;re now ready for a new beta release fixing many of the reported issues and then some! It also includes a surprise lightmapper from Juan, and many usability enhancements provided by our numerous contributors. The final 3.0 release is now very close, so stay tuned for more news and the release candidate!" />
    <meta name="twitter:image" content="https://godotengine.org/storage/app/uploads/public/5a3/c39/918/5a3c399188781933894734.jpg" />

The link does currently look good in Twitter.

This is the same link in Riot.

Same link in Discord.

I don't have Facebook, so can't compare there, but will assume that your screenshots are still accurate and that nothing's changed.

[akien-mga]

Fixed by #16.

[brainsick]

It's probably bad form to comment on a closed issue, but I just wanted to follow up and say thanks to @fleskesvor for the links and initial research. They saved me some time. :)

[fleskesvor]

@brainsick No, problem. 🙂 I've worked with SEO people before, so I had a good idea what to look for. Glad you were able to implement this properly.