Twitter have launched new functionality that will make everyone’s Twitter stream just a little bit more engaging. Taking a leaf out of Google Plus, Twitter has now expanded its “Cards” functionality to allow for iPhone, iPad and Android apps to stand out in streams with their own look and feel.
The way it works is to include meta data in one of your webpages where you talk about your Mobile app, say on your website. In that page’s meta data you add the following meta and customize it with your apps details and links to the Apple and Google stores.
To make use of Twitter Cards you first need to validate your domain with Twitter and complete the Cards sign-up process on Twitter Developers.
To enable this new feature, copy and paste this code into your <head> </head> and then customize it to suit your app. You can remove any tags that aren’t relevant. If you don’t have an iPad app remove those lines.
<meta name=”twitter:card” content=”app”>
<meta name=”twitter:description” content=”Connect with our charity on your smartphone.”>
<meta name=”twitter:app:id:iphone” content=”306934135″>
<meta name=”twitter:app:url:iphone” content=”example://action/5149e249222f9e600a7540ef”>
<meta name=”twitter:app:id:ipad” content=”45672334″>
<meta name=”twitter:app:url:ipad” content=”example://action/5149e249222f9e600a7540ef”>
<meta name=”twitter:app:url:googleplay” content=”example://action/5149e249222f9e600a7540ef”>
<meta name=”twitter:app:id:googleplay” content=”com.example.app”>
Let’s break down each Twitter Card tag and see how it works
<meta name=”twitter:card” content=”app”>
This tag tells Twitter that the meta data below is to be used for an APP Card, if you don’t set this correctly it won’t work.
<meta name=”twitter:description” content=”My app description”>
Here we are setting the app description that will be seen by Twitter users.
<meta name=”twitter:app:id:iphone” content=”306934135″>
This is your iPhone app on the iTunes store’s unique ID code
<meta name=”twitter:app:url:iphone” content=”://iphoneAppURL”>
The url of your iPhone app on the iTunes store.
<meta name=”twitter:app:id:ipad” content=”45672334″>
This is your iPad app on the iTunes store’s unique ID code
<meta name=”twitter:app:url:ipad” content=”://ipadAppURL”>
The url of your iPad app on the iTunes store.
<meta name=”twitter:app:id:googleplay” content=”com.example.app”>
Your Google Play app ID
<meta name=”twitter:app:url:googleplay” content=”://PlayAppURL”>
The URL to your app on the Google Play Store.
Once you have all of that information included, and your tags saved into your page, any time that link is shared on Twitter your App Card will be displayed instead of just a boring link and a page title.
It will be interesting to see if Apple and Google include this new meta on their respective stores, it’s bound to increase the visibility and virality of mobile apps if they do.
Let us know in the comments if you set-up your charity’s mobile apps with a Twitter Card.
