CODEWITHSUNDEEP
twittermeta-tagsmetatwitter-card
user2889334
user2889334

Reputation: 141

Twitter card share button

I have issues with Twitter share button, I have this code as an input:

<meta name="twitter:card"        content="summary">
<meta name="twitter:site"        content="@citydesigning">
<meta name="twitter:title"       content="City Design">
<meta name="twitter:description" content="I recommend this epic City Design online course at https://stepic.org/city #stepiccity">
<meta name="twitter:creator"     content="citydesigning">
<meta name="twitter:image:src"   content="https://stepic.org/static/classic/city/images/sharepic.png">

and

<a class="twitter" 
   href="https://twitter.com/intent/tweet?url=https://stepic.org/city" 
   target="_blank"></a>

But it returns no results when sharing, only this text: "https://stepic.org/city" instead of all Twitter card information (like image and some text) when clicking "View summary" on Twitter's feed.

Can you help me, pleasee?

Upvotes: 12

Views: 26543

Answers (4)

Fatih Topcu
Fatih Topcu

Reputation: 132

  1. Validate your twitter card via https://cards-dev.twitter.com/validator

  2. HTML code is :

    <a href="http://www.twitter.com/intent/tweet?url=http://your-url&text=caption">tweet</a>

    You will only see caption text and url. but, when you share via click tweet button, you will see summary card, your profil page.

Upvotes: 7

Mudiaga Ejenavi
Mudiaga Ejenavi

Reputation: 1140

This is actually the expected behaviour. Twitter cards do not show up in the Tweet share dialog but when you click the tweet button in your share dialog, it will be displayed on twitter as a card. https://twittercommunity.com/t/card-validator-is-working-but-website-share-show-different-content/36092/2

Upvotes: 0

Dan Leveille
Dan Leveille

Reputation: 3210

Domains need to be approved before Twitter Cards will work. Use Twitter's validator and then click "request approval":

https://cards-dev.twitter.com/validator

Upvotes: 10

Dawn T Cherian
Dawn T Cherian

Reputation: 5416

In-order to display the image, replace:

<meta name="twitter:card" content="summary">

with:

<meta name="twitter:card" content="summary_large_image">

and also check whether the twitter crawler is able to access it properly by entering the url to https://cards-dev.twitter.com/validator

Upvotes: 1

Related Questions