CODEWITHSUNDEEP
twittermeta-tagstwitter-card
seandaniel
seandaniel

Reputation: 151

Twitter:image meta tag not showing image for its Twitter card

<meta name="twitter:card" content="summary">
<meta property="twitter:title" content="Website's title">
<meta property="twitter:description" content="Lorem ipsum dol sor em convectur">
<meta property="twitter:image" content="styles/assetsOptimized/ourStory/StoreFront.jpeg">
<meta property="twitter:url" content="https://website.com/">

Twitter card validation shows as follows: enter image description here

Everything shows in the card except the image.

I have tried:

<meta property="twitter:image" content="https://styles/assetsOptimized/ourStory/StoreFront.jpeg">

These are the Open Graph Meta tags that work for Facebook, placed above the twitter tags(referencing the 11 meta tags found in the twitter validation - viewport, http-equiv:

<meta property="og:title" content="Website's title">
<meta property="og:description" content="Lorem ipsum dol sor em convectur">
<meta property="og:image" content="styles/assetsOptimized/ourStory/ourStoryStoreFront.jpeg">
<meta property="og:url" content="https://website.com/">

Upvotes: 4

Views: 11528

Answers (3)

Ziyad Al Qahtani
Ziyad Al Qahtani

Reputation: 11

An associated picture URL won't function with Twitter Cards on Twitter. The site's full-qualified domain name must be included.

you can either create a static file link to host the image and then use it or you can easly use https://imgbb.com/ to host them

<meta property="twitter:image" content="https://i.ibb.co/StoreFront.jpeg">

And you can always test it out before deploying it using metatags, you can find the link over here https://www.techjournal.ai/metatags, and also make sure to check out other social media platforms as well

Best of luck

Upvotes: 0

Karina D.
Karina D.

Reputation: 166

I see the issue is solved but just FYI: An additional issue here is probably the fact twitter's meta tags do not use the property attribute but the name attribute, as shown in their documentation here.

So your code would look like:

  
<meta name="twitter:image" content="https://styles/assetsOptimized/ourStory/StoreFront.jpeg">

Upvotes: 6

anon
anon

Reputation:

a relative URL to the image will not work on Twitter with Twitter Cards. You need to include the fully-qualified domain for the site:

<meta property="twitter:image" content="https://website.com/styles/assetsOptimized/ourStory/StoreFront.jpeg">

Upvotes: 5

Related Questions