dynamically updating open graph tags for social media previews

n-ce / ytify

Opus Audio Streaming Web App for YouTube. Stop watching, Listen & Save Data.

https://ytify.netlify.app

GNU General Public License v3.0

145 stars 48 forks source link

dynamically updating open graph tags for social media previews #94

Closed n-ce closed 1 month ago

n-ce commented 1 year ago

Relevant Links

OGP - https://ogp.me/
Implementation - https://stackoverflow.com/questions/19778620/provide-an-image-for-whatsapp-link-sharing

Update Strategy

Reference relevant og tags in lib/DOM.
Updating them in setMetadata() => https://github.com/n-ce/ytify/blob/3418c4f64f17b9c56b0dcd2b99cbdb38146b30f6/Scripts/lib/functions.js#L84-L111

n-ce commented 1 year ago

Turns out It was silly of me to do this. I totally didn't realize that social media previews only read the html and dont run any scripts. So if we really want to implement, we will have to convert the site to a server rendered page instead which is out of the scope of this project. On the bright side I did get to know & fix the default og-image issue as well as find a way to dom reference meta name tag without using getElementById on this endeavour.

n-ce commented 2 months ago

Re-opening this, as it is solvable via edge functions. Has been already implemented by #187