The Card validator is displaying my summary card correctly, however, when I actually try to share it buy clicking the "twitter-share-button" it does not display a twitter card, it only shows a regular tweet.
This what the validator says:
Your site is whitelisted for summary_large_image card
INFO: Page fetched successfully INFO: 18 metatags were found INFO: twitter:card = summary_large_image tag found INFO: Card loaded successfully
These are the tags I'm using:
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@username">
<meta name="twitter:creator" content="@username">
<meta name="twitter:title" content="Some Title">
<meta name="twitter:description" content="Some description.">
<meta name="twitter:image" content="http://example.com/images/dog.jpg">
This is the html:
<a class="twitter-share-button"
href="https://twitter.com/intent/tweet?text=Testing Testing Testing">
Tweet</a>
For anyone strugling with tyhe same issue, I'm responding to my own question.
Here's what I found out:
1. First off, keep in mind that the card only shows in the final posted Tweet - not in the Tweet composer window. However, in my case, it wasn't showing in the final posted tweet either.
2. You have to include the link to the page you want to share after the text parameter. Additionally you need to encode its URL value. So, instead of text=http://example.com use text=http%3A%2F%2Fexample.com. If you go to http://www.w3schools.com/tags/ref_urlencode.asp you can make this encoding convertion automaticaly.
3. I've been told that sometimes there is a delay as twitter's crawler caches your site, which would explain why the card doesn't show in the final posted tweet in your fist attempts to share it. In my case it took 48 hours, after which, clicking the share button will post the card immediately.
Hope this my be helpful to someone else...