Meta tags & SSR #1942
Unanswered
tylerpaige
asked this question in
Help
Meta tags & SSR
#1942
Replies: 1 comment
-
@tylerpaige Did you find any solution to this? |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Hi everyone,
I would like to set some meta tags to improve how my site looks when shared on social media (e.g.
og:image
,twitter:image
, etc). But I think my limited understanding of React Server Components is preventing me from fully implementing a solution.I understand that Hydrogen has a
head
component, which usesreact-helmet
behind the scenes. So far, I have something that appears to be working.When I go to this route and look around the rendered DOM, there is indeed a
<meta property="og:image" />
like I expect. But it doesn't appear that this tag is present in the server-rendered markup. Tools like OpenGraph.xyz or Twitter's card validator cannot find anyog:
tags at all.For this reason, it seems to me that React Helmet is rendering the meta tags on the client side. For some things, like the
<title>
this is probably fine. By contrast, though, theseog:
meta tags need to be accessible to a js-less agent. But I can't for the life me figure out how to make that happen!In general, I find it a bit confusing to know which content is actually rendered as html and sent over the wire. Looking at my page's
view-source:
, it seems like practically everything is client-side rendered. Maybe I have my app structured incorrectly...If any one from the community can lend me some ideas, I would be much appreciative! Thank you!
Beta Was this translation helpful? Give feedback.
All reactions