Fix twitter card image path #609
Conversation
v2/src/components/seo.js
Outdated
| @@ -73,7 +72,7 @@ function SEO({ description, lang, meta, title, twitter_image }) { | |||
| }, | |||
| { | |||
| name: `twitter:image`, | |||
| content: metatwitterImage, | |||
| content: "https://www.bitcoincash.org/images/" + metatwitterImage, | |||
There was a problem hiding this comment.
Do not bake the domain in the code
There was a problem hiding this comment.
For sure. What about if we define it in the gatsby config meta data and bring it in like that?
There was a problem hiding this comment.
OK so it seems like there is no good way to do this. Then I guess we can go with this.
Can you set the images/ as part of metatwitterImage rather than prebaked?
|
You'd have to ask twitter, but its stated in this thread https://twittercommunity.com/t/card-error-unable-to-render-or-no-image-read-this-first/62736 third from last bullet |
There was a problem hiding this comment.
So, I've loaded the site from the branch in your repo. I can't see anything different in either chrome or firefox.
It remains unclear what problem this is solving if any, and, in any case, the solution needs to adjust to the source from which the content is served.
v2/gatsby-config.js
Outdated
| @@ -2,6 +2,7 @@ module.exports = { | |||
| siteMetadata: { | |||
| title: "Bitcoincash.org", | |||
| author: "Bitcoincash.org", | |||
| siteURL: "https://www.bitcoincash.org/", | |||
There was a problem hiding this comment.
I don't see how putting the absolute url somewhere else solves anything.
|
So this problem is as of now this twitter card image is not working with twitter. You can test it out here https://cards-dev.twitter.com/validator According to their docs the image needs an absolute path to work So need to define the absolute path. I agree having it adjust to the serving source is ideal. Will see if I can make that happen |
|
hmm may be stuck with it. Seems gatsbys own docs recomend defining the domain since gatsby cant really see it |
|
Alright, but then it mean that passing the twitter image as argument is not going to work, so we got to remove that option. |
v2/src/components/seo.js
Outdated
| @@ -73,7 +72,7 @@ function SEO({ description, lang, meta, title, twitter_image }) { | |||
| }, | |||
| { | |||
| name: `twitter:image`, | |||
| content: metatwitterImage, | |||
| content: "https://www.bitcoincash.org/images/" + metatwitterImage, | |||
There was a problem hiding this comment.
OK so it seems like there is no good way to do this. Then I guess we can go with this.
Can you set the images/ as part of metatwitterImage rather than prebaked?
|
Okay made that edit. Was that other comment still relevant? It looks to me we can still use the argument. Will just need to pass a string of the image path wanted. Seems to work in testing |
* add image to static, redefine path * absolute path fix * put url back in seo * move images/ to metatwitterImage
I realized twitter card image needs an absolute path to work. So used the static folder and referenced the url directly.