Add3.com

beginners-guide-twitter-cards-cover

We’ve implemented Twitter cards for Add3 and a couple of clients and wanted to share some results and give you a full tutorial on how to implement Twitter cards for your own site. They’re pretty cool and it’s really easy to do!

 

What Are Twitter Cards?

Twitter cards are a way to attach more rich media to Tweets that link to your content. In other words – you can add pictures or other functionality to Tweets that link to your content.

For example – this is the standard way that Tweets look when they link to content.

1---Twitter-Standard-Expanded-Tweet

But by taking a few simple steps and adding some code to your pages, Tweets to your content can look like this Summary Card

2---Twitter-Summary-Card

Pretty sick, right?

Or check out the even more sicker “Summary Card with Large Image”

3--Twitter-Summary-Card-with-Large-Image

Examples of Twitter card types

Below are a couple examples of the more interesting Twitter card types. There are actually several types of Twitter Cards you can implement, based on the type of content your site has. These are all screen shots from desktop, but these cards all work on mobile as well. For a full breakdown of card types – see the Twitter dev site: https://dev.twitter.com/docs/cards

Product Card

4--Twitter-Product-Card

Player Card

For video/audio media

5---Twitter-Player-Card

Social integration FTW!

The reason I’m blogging about Twitter cards today is because as SEO’s, I feel like we get all crazy about content strategy and on-site optimization and how to get links that we miss the obvious and easy “common sense” stuff. The – “hey, let’s make the most out of the work we’re already doing” stuff.

I can’t tell you how many sites that I’ve worked on that will add social sharing buttons to their content or blog, and don’t ever actually look at what happens when the share button gets clicked. I’m not going to out anyone here – but go ahead & go to one of your own blog posts and click on a “share this post” link… does it actually make sense?

If you are so lucky as to get someone to actually click on the “Tweet” or “Share” buttons on your page because they like your content, you should make sure that you’re using the opportunity to your full advantage. Otherwise – your opportunity could be squandered because your content looks like hell when it gets shared on Twitter, Facebook, LinkedIn, Google+, etc.

Twitter Cards FTW!

Benefits of Twitter Cards

We implemented Twitter Cards for Add3.com a little less than a month ago. The results have been fairly encouraging so far. I’ve also implemented Twitter cards for a few client sites recently and we’re seeing a lot of the same thing.

6---Twitter-Add3

Figure 1: We’ve been getting more visits to our site from Twitter since implementing Twitter cards… so far.

7---Twitter-interactions-with-Add3

Figure 2: Interactions with our Twitter account have increased since implementing Twitter cards as well.

8---Twitter-card-type-performance

Figure 3: We’ve tested the regular “Summary Card” vs. a “Summary Card with Large Image”. The large images get more RT’s.

How to implement twitter cards

The process for implementing Twitter cards is actually quite easy.

  1. You have to pick a card type
  2. Then add some code to your site
  3. Then you have to validate your code
  4. Then you have to request approval of your cards with Twitter

Twitter spells it all out here: https://dev.twitter.com/cards

The difficulty really only lies in whether it’s easy for you to add code to your site.

In our case – Add3.com is built on WordPress, and the Yoast SEO plugin has Twitter card functionality built right into it. All I had to do was check a box in Yoast and then validate the code with Twitter.

9---Yoast-Plugin-Twitter-Cards

The Yoast SEO plugin only supports “Summary Cards” and “Summary Cards with Large Images”. Luckily for us – these are the only cards that make sense for our site so I’ve implemented both. There are several plugins for implementing different types of Twitter cards for your WordPress site if the summary cards don’t make the most sense for you.

One of my client sites is built on Magento, and their developer found a plugin that made implementing the product card type really easy as well. In other situations you may have to work with your developer to add the Twitter Card code to your site.

So – time for comments. Have you implemented Twitter cards for your site? Have you seen any impact?









Ben Lloyd

About Ben Lloyd

Ben Lloyd serves as Principal at Add3 and manages the agency’s Portland office.  Ben got his start in SEM way back in 1999 – when there was like, 15 search engines and Google was barely a thing. Prior to Add3, Ben had founded Amplify Interactive in 2003 (which was acquired by Add3 in 2013), and hasn’t looked back since. Ben likes lots of stuff like golf, pinball, food(ie), booze/beer/wine – in that order, etc. Mostly – he likes doing that stuff with his friends. Ben is also co-founder of SEMpdx. Connect with Ben on LinkedIn

Comments & Replies