Twitter Card Meta Tags: “twitter:site” vs “twitter:site:id”
As part of a Social Media optimization initiative, we are implementing support for Twitter Cards. Similar to Pinterest’s Rich Pins, if you already have Open Graph meta tags implemented on your site getting up and running with Twitter Cards is super easy. You only need to add 2 additional tags:
1. <meta name=”twitter:card” content=”CARD_TYPE”> // where CARD_TYPE is the card display format you wish to use. The image above is the “Summary Card with Large Image” but there are 7 types in total
AND
2. <meta name=”twitter:site” content=”@HANDLE“> // @HANDLE = the twitter handle for your site
OR
2. <meta name=”twitter:site:id” content=”XXXXXX“> // XXXXXX = the Twitter User ID for your site. Not sure? Try: http://gettwitterid.com/
Note that the Twitter Cards Markup Tag Reference does not make it totally clear that this is an either/or situation. To confirm, I temporarily added a version of each to a test page and ran them through the Twitter Card Validator to make sure I received the same results. I recommend using the Twitter Site ID, it is going to be more robust since you can change your Twitter Handle at anytime and the Site ID value will remain constant.
And that’s it! Once you’ve got your tags in place run a URL through the Validator to confirm all is well and then go ahead and “Request Approval”. While the confirmation message says to “Expect a few weeks for turn-around time” I received my confirmation emails almost instantaneously.