Robust social media cards previews // rmrk2 left

[yangwao]

I believe we've faced numerous outages on social media cards and it's time to squash and focus on working version as it's perfect occasion to fix things on this page when we will be releasing new collection

• https://github.com/kodadot/nft-gallery/issues?q=is%3Aopen+is%3Aissue+label%3Asocials-seo

Social media cards are powerful way to drive great conversions, raise CTR to our platform and convince people to click. If we are showing more insightful information it's more tempting to come over. I would like to see being done just about release collection to go together with this release.

I sense most of stuff already being done, yet it's need to be improvised somewhere in code?

• https://github.com/kodadot/workers/tree/main/ssr-opengraph-beta
• https://github.com/kodadot/workers/tree/main/prerender-opengraph

Test

• https://canary.kodadot.xyz/bsx/gallery/1865909717-12
• https://canary.kodadot.xyz/rmrk/gallery/8720634-66fae573cab828190c-KNRY-KANARY_110-0000000000000110
• https://kodadot.xyz/rmrk/u/FHgDt77G83iHsD9qvHcjCjfN5pWag3LsqHDzGnCgJdsmgSW?page=1
• https://www.opengraph.xyz/url/https%3A%2F%2Fcanary.kodadot.xyz%2Frmrk%2Fgallery%2F8720634-66fae573cab828190c-KNRY-KANARY_110-0000000000000110

Tasks

• Use new domain for social cards  #5549
• Collection: check seo on redesigned page #5494 (collection related)
• avoid markdown in collection in og:description

working at socials

• Telegram https://t.me/webpagebot
• Twitter - test in client while writing tweet
• Discord
• Facebook
• Linkedin

rendering for pages

• gallery item
• collection
• profile

protocols

• snek
• bsx
• rmrkV1
• rmrkV2 - ssr-opengraph - rmrk2 workers#44

Ref

• New social media cards design for collection #5426
• og:image doesn't render on Twitter?  #4058
• Tune showing collection picture and description on social  #900
• Remove markdown when parsing og:description for collection #889
• SEO: card UI update #3038
• https://github.com/AndreyGrin/og-image/
• Social media cards v2 #2849 (comment) (worked while)
• Open Graph social cards doesn't work  #2136 (comment) (debug advice)
• og:image doesn't render on Twitter?  #4058
• Share activity graph of collection on social  workers#241

[preschian]

Test

• canary.kodadot.xyz/bsx/gallery/1865909717-12
• canary.kodadot.xyz/rmrk/gallery/8720634-66fae573cab828190c-KNRY-KANARY_110-0000000000000110

currently won't work on canary.kodadot.xyz because this subdomain serves our pages with netlify. we can check on server: section

will work on canary-cf.kodadot.xyz. because this subdomain served on cf-pages

we have 2 options to solve that:

1. create and deploy netlify-edge. something like ssr-opengraph on workers, but for netlify-edge. ref: https://www.netlify.com/products/edge/
2. pointing canary.kodadot.xyz to cf-pages

which one is suitable for us?

edit: seem like number 2 easier? wdyt? less script to manage for opengraph?

[yangwao]

so, just swap record I guess?
Like canary.kodadotxyz & beta.kodadot.xyz will be pointing on CF builds?
I think sure can do it if that's thing that would help.

@preschian like this?
✅ canary.kodadot.xyz should be pointing to cf-pages now

[preschian]

@preschian like this?
✅ canary.kodadot.xyz should be pointing to cf-pages now

correct 👍

now, this link should be working https://www.opengraph.xyz/url/https%3A%2F%2Fcanary.kodadot.xyz%2Frmrk%2Fgallery%2F8720634-66fae573cab828190c-KNRY-KANARY_110-0000000000000110

[yangwao]

that was it? 😅

https://www.opengraph.xyz/url/https%3A%2F%2Fcanary.kodadot.xyz%2Frmrk%2Fgallery%2F17417694-C4F63647002B182C0E-VVG-STARRY_NIGHT-0000000000000001

@preschian can we also update domains where needed to "cache" some requests? 😇

• Use new domain for social cards  #5549

[yangwao]

Maybe @JustLuuuu can lurk if she can notice where it doesn't work for her?

[yangwao]

Seems this one doesn't work, but I see item well so..

• https://canary.kodadot.xyz/rmrk2/gallery/11949389-76a95bd990f7215812-Z3OIA-CRYPTOMOUSE_LILU_030-00000016
• https://www.opengraph.xyz/url/https%3A%2F%2Fcanary.kodadot.xyz%2Frmrk2%2Fgallery%2F11949389-76a95bd990f7215812-Z3OIA-CRYPTOMOUSE_LILU_030-00000016

[yangwao]

It's possible doesn't work for rmrk2?
Is this one related?

• ssr-opengraph - rmrk2 workers#44

[yangwao]

Twitter seems works well

[yangwao]

Seems when there is in the url of collection ?page=1 doesn't fetch well?

https://canary.kodadot.xyz/bsx/collection/2106275273?page=1

https://canary.kodadot.xyz/bsx/collection/2106275273 but w/o works

[preschian]

Seems this one doesn't work, but I see item well so..

• canary.kodadot.xyz/rmrk2/gallery/11949389-76a95bd990f7215812-Z3OIA-CRYPTOMOUSE_LILU_030-00000016
• opengraph.xyz/url/https%3A%2F%2Fcanary.kodadot.xyz%2Frmrk2%2Fgallery%2F11949389-76a95bd990f7215812-Z3OIA-CRYPTOMOUSE_LILU_030-00000016

right now, I can't open canary at all. is there any changes maybe?

• main.nft-gallery-5ci.pages.dev

edit: it works now

It's possible doesn't work for rmrk2? Is this one related?

• ssr-opengraph - rmrk2 workers#44

yes, related to that one

[JustLuuuu]

As I mentioned. They are not working in the chat on Twitter - if you share a specific NFT or profile. If you share the collection in chat that one is working.

Sharing profiles does not work in your feed too.

[preschian]

They are not working in the chat on Twitter

not sure what the root cause for this, on it

Sharing profiles does not work in your feed too.

I just redeploy it again, could you check again?

[preschian]

They are not working in the chat on Twitter

somehow it works for me

user profile	collection	item

dear @/elonmusk, don't broke twitter yet :(

[JustLuuuu]

dear @/elonmusk, don't broke twitter yet :(

okay works for me too now with NFTs and collections. not with profiles, but I guess that bearable :D

[yangwao]

Anything we can help on this? or it's working then and should be same working on production I guess?

[yangwao]

Partially RMRK2 works

• feat: opengraph for ksm on beta workers#70
• How to get resources for ksm (rmrk2) schema uniquery#25

https://www.opengraph.xyz/url/https%3A%2F%2Fcanary.kodadot.xyz%2Fksm%2Fcollection%2F0E76E3AC15B4C1FA1E-TAROT

[yangwao]

Loads here

• https://www.opengraph.xyz/url/https%3A%2F%2Fcanary.kodadot.xyz%2Fksm%2Fgallery%2F14268065-24d6d7cd9a97d46d3e-SUB-CL-1-SILVER-00001603

• Doesnt load on telegram

• 

Strange 👀

[yangwao]

I think if we close loading on Telegram this is good to go, maybe worth test other messengers like

• WhatsApp
• Facebook Messenger
• Signal
• Viber
• iMessages
• Instagram DMs
• Slack

[preschian]

• Doesnt load on telegram

not sure why it doesn't load on telegram 🤔 hhmm