Added og:image tags and meta tags for twitter card #8
Conversation
| @@ -55,6 +55,17 @@ class Template extends React.Component { | |||
| property="og:description" | |||
| content="/spacebot - A Slack Bot that helps you learn and explore space. Learn about astronomy, NASA, mars rovers, and more." | |||
| /> | |||
| <meta property="og:image" content="https://raw.githubusercontent.com/mikelax/spacebot-site/master/src/assets/images/website-icon.png" /> | |||
There was a problem hiding this comment.
@sonimadhuri thanks for working on this, we will have to make a few additional change to get the correct URL to use for this tag and the corresponding twitter:image url.
We don't want to link to the github URL, but rather the generated URL should be an absolute URL based on the slashspacebot.com domain.
- Add a
siteUrlattribute to thesiteMetadataattribute in the gatsby-config.js file. The value should be:https://slashspacebot.com - git mv the file
website-icon.png to the static folder. Update the value for theiconattribute in gatsby-config.js to be:static/website-icon.png` - In layout.js, you can use graphql static query, tutorial here to get the
siteUrlvalue with/website-icon.png. The resulting value for these should be:https://slashspacebot.com/website-icon.png
There was a problem hiding this comment.
Hey @mikelax I'm on this, But I am pretty new to graphql
There was a problem hiding this comment.
Ok cool. Let me know if you have any questions or if you want me to push a little sample for the graphql query, etc.
|
Hey @sonimadhuri let me know if you need any help with this or want me to make the last few changes needed. thanks |
|
@mikelax Yeah it would be great if you can go ahead with changing the last bits. |
No description provided.