How to Optimize Your Content for Social Media Sharing
Good content will attract a relevant audience to your website, and there’s a good chance that some of those people will want to share your content on social media. However, sometimes problems occur when shared content doesn’t appear properly on a social stream. This is where using Open Graph tags can help.
Open Graph allows you to control the appearance of your content’s title, image, description, and more when shared via social channels. You may already be familiar with common meta tags like the title tag and description tags. But many bloggers don’t know that there are other meta tags specific to social networking sites like Google+, Facebook, Twitter, and Pinterest. These social networking sites have started using metadata to properly display content along with related images, descriptions, and links. By defining these meta tags, you can make sure your content is easier to share and understand at a glance on social media.
Each social network site has different preferences. Pinterest and Google+ give preference to Schema tags, but they also support Open Graph Protocol tags, which are preferred by Facebook, Google+, and Pinterest.
The Open Graph tags go between the
section of the webpage. The most commonly used tags are:– og:title
– og:description
– og:url
– og:site_name
– og:image
– og:type
These tags may not make much sense at first, so here are some diagrams of social shares with the Open Graph tags clearly labeled.
In addition to Open Graph tags, Twitter has defined its own custom tags known as Twitter Cards. These tags enable your links to present more information whenever they are tweeted. Similar to Open Graph tags, the Twitter card tags also go between the
section of a webpage. The most commonly used Twitter tags are:– twitter:card
– twitter:site
– twitter:creator
While you can add Open Graph and Twitter Card tags manually, there are many plugins available on WordPress.org that make it very easy for even novice users to add tags on WordPress posts and pages. Some popular plugins include SEO by Yoast, Open Graph for Facebook, Google+ and Twitter Card Tags, The SEO Framework, JM Twitter Cards (only for Twitter Cards), and Open Graph Protocol Framework (only for Open Graph tags and recommended for developers).
For this tutorial, we will use the Yoast SEO plugin’s built-in options to define special Meta tags to make our posts rich media friendly.
Step 1: Install the Latest Version of Yoast SEO
We recommend installing the latest version of Yoast SEO. The easiest way to do that is through the WordPress admin dashboard under Plugins > Add New and search for “Yoast SEO”. Then install and activate the plugin.
Once activated, you should see a new “SEO” tab in your WordPress admin dashboard. Today, we are interested in the Social tab.
Step 2: Configure Your Social Settings
To configure the Open Graph and Twitter cards, navigate to SEO > Social from the WordPress admin dashboard. First, add your social profile links here to help search engines validate that they are connected to your site. Then move on to the various social tabs.
Facebook:
Your first step is to enable Open Graph meta data for Facebook posts – simply click on the Enabled option. Assuming you already added your site’s related Facebook page under the Accounts tab, you’re good to go. You can add a default image if you’d like for any pages that don’t have featured media, but that’s up to you.
Twitter:
With Facebook done, it’s time to tackle Twitter. Just be sure the Twitter card meta data is Enabled, then select a default card layout (summary or summary with large image). Again, this will be associated with the Twitter handle you’ve added on the Accounts page.
Pinterest:
Pinterest is a bit different, as this platform uses a meta tag verification. Go to your Pinterest account, hover on your user icon, then click on the Settings tab. Click on the Claim Website option and select the Add HTML tag option. Copy the generated meta tag and paste it into your Yoast SEO panel. Save your changes, then go back to Pinterest to Submit. This tells Pinterest to check the tag and verify your site.
Google+:
The last social account you’ll need to set is Google+, which is just a link to your business’ Google+ page. Paste it in and you’re all set.
Set Defaults:
The last step is to create your default. Yoast uses meta boxes on your content to define Open Graph data, so be sure to edit your defaults under SEO > Search Appearance > Content Types. Use Yoast SEO’s built-in snippet variables to build your own dynamic defaults for your post title (which is used for og:title) and meta description (used for og:description).
Custom Image, Title & Description:
Yoast SEO also includes an option on individual posts to customize the image, title, and description used for Facebook and Twitter. When editing a post, simply scroll down to the Yoast SEO section and click on the sharing icon (it looks like less than < symbol). Then upload a custom image or edit the title and description as needed.
Debugging and Validating:
Each major social networking site has its own Validator or debugger to test and preview how your links will appear when shared on social media.
– Google Structured Data Testing Tool: This tool will not show you the preview of a post shared on Google+, but it will show which metadata are present and readable by Google. Your properties will appear under RDFA-node properties.
– Facebook Debug: After implementing Open Graph tags, simply paste the URL of your site containing the tags. It will show you the object properties.
– Twitter Validation Tool: You can use this link to preview the Twitter card for your post before it’s shared on social media.
– Pinterest Rich Pins Validator: Similar to the last two validators, just enter the URL containing the Open Graph tags to preview and be sure your content is displaying as it should.
By using these Open Graph meta tags, you can optimize the way titles, images, descriptions, and other details for your content appear on social media. This can aid in increasing traffic from social sites, as links with clear information tend to get more shares and natural links. People also tend to trust links that contain more information rather than clicking on naked or short URLs.
