Figuring Out Twitter Card

So far, Twitter had been the best performing social media platform for Traveling Bytes. Up until last week, it was due to pure organic growth. Then, for better or worse, I fell victim to Twitter’s alluring email messages about promoted tweets, campaigns, Twitter cards, whole nine yards.

Twitter Cards do not require any monetary investment, so, what the heck, why not implement them.

Montevideo Offbeat
This elephant has nothing to do with Twitter Cards, but was used to test this functionality

This is how Twitter explains Twitter Cards:
With Twitter Cards, you can attach rich photos, videos and media experience to Tweets that drive traffic to your website. Simply add a few lines of HTML to your webpage, and users who Tweet links to your content will have a “Card” added to the Tweet that’s visible to all of their followers.

Furthermore, Twitter kindly provides instructions on CMS integration. Perfect! Traveling Bytes runs on WordPress, so I’ll just follow instructions.

Long story short, I followed all steps outlined in the CMS Integration Guide, but nothing happened. I suspect that there could be 2 possible reasons or even combination of both:

  1. Traveling Bytes uses BOTH Jetpack and Yoast SEO plugins
  2. Recently, WordPress had a major release (4.2) and Jetpack and Yoast SEO plugins had been updated.

In any case, after playing around a little bit, I successfully integrated Twitter Cards into Traveling Bytes. Here is how I did it.

At the time of integration, Traveling Bytes has been running on WordPress 4.2.1 with Jetpack 3.5.2 and Yoast SEO 2.1.1

1. In WordPress Admin navigate to Jetpack —> Settings —> Sharing —> click Connect  in Twitter section.

After successful connection, you should see something like this:

Jetpack Sharing: connecting to Twitter account

2. In WordPress Admin navigate to SEO —> Social —> Twitter —> check Add Twitter card meta data and choose Summary with large image for the default card type.

After saving changes you should see this:

Yoast SEO: configuring Twitter Cards

Voilà! From now on, all your posts have necessary meta tags for Twitter cards.

When properly configured, the right-hand Publish section of a New Post will have Publicize section.

Publicize portion of Publish UI

Click Edit link to customize the content of the tweet:

Customizing tweet

All new posts will have Twitter card functionality enabled by default. If you want to enable it for older posts, all you have to do is to copy/paste the old post’s URL into the Twitter Card Validator.

Sharing is caring!

2 thoughts on “Figuring Out Twitter Card”

    • It was not too hard in my case too, but the steps differed from what Twitter recommends in their CMS Integration Guide.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Don’t miss the fun!
Subscribe to Traveling Bytes updates.