0

Here is the meta tags i have in my react app but still in twitter share i cant see any image. i use react-share library.

<meta property="og:url"        content="https://test.com" />
<meta property="og:type"       content="article" />
<meta property="og:description"content="Coding tales" />
<meta property="og:image"      content="%PUBLIC_URL%/Test.png" />

<meta name="twitter:title" content="Test Blog">
<meta name="twitter:description" content="Coding tales">
<meta name="twitter:image" content="%PUBLIC_URL%/Test.png">
<meta name="twitter:card" content="summary">
<title>Test Blog</title>

In the validator of twitter i get :

INFO: Page fetched successfully

INFO: 12 metatags were found

INFO: twitter:card = summary tag found

INFO: Card loaded successfully

Halil
  • 121
  • 7
  • 1
    Try adding imageprop for the meta tags https://stackoverflow.com/questions/25100917/showing-thumbnail-for-link-in-whatsapp-ogimage-meta-tag-doesnt-work – jarivak Sep 02 '20 at 13:12
  • I did add the whole url to the content of the image and worked this way, but not sure why it worked for the other platforms like facebook, whatsup and linkedin but for the twitter i had to add the whole url. – Halil Sep 02 '20 at 14:34
  • Does this answer your question? [Relative image paths for Twitter cards in blogdown](https://stackoverflow.com/questions/45915720/relative-image-paths-for-twitter-cards-in-blogdown) – JustCarty May 26 '21 at 16:34

1 Answers1

1

You need an absolute path for og:image or twitter:image - like https://....

Relative paths aren't supported by Twitter... I don't think is documented but this is how it works in fact.

Maciej Kankowski
  • 21
  • 6