#Html social media meta tags how to
#Html social media meta tags generator

We’ve selected the Summary card with large image option. Under the Twitter tab, check the check box beside Add Twitter card meta data. The plugin will automatically do the same for individual posts and pages. For Facebook, fill in the title, description and image URL you want to use for the front page. Simply download and activate the plugin and click the Social tab on the plugin’s menu bar which will appear as SEO. The WordPress SEO by Yoast plugin can do this Open Graph and Twitter Card meta tags for you. A Wordpress plugin that does all the work

Once you’ve written in the card type, description, title, image source, and creator, you can test out your article’s URL with Twitter’s Card Validator.

Instead of the og: prefix, they use twitter:įor each of its Card types, Twitter can you walk you through how to set up your meta tags in the head section of your article’s HTML. The meta tags Twitter’s crawlers look for are based on Open Graph tags. Here is a summary card with a large image:ĭid you know Kramer was the happiest character on Seinfeld? Find out how researchers figured that out. Twitter uses a system called Twitter Cards that can differentiate between different types of content: photo cards, four-photo gallery cards ( AJ+ used this well), app cards (with direct download), lead generation ad cards, and summary cards, among others.

Here’s an Open Graph generator that can help those with limited HTML skills. That’s how Facebook includes an image or short description with the link you’ve shared. When your article URL is pasted into Facebook or shared with a Facebook button, Facebook crawls the article URL and pulls out the information from these Open Graph metatags.

For individual news articles, you can include heds, deks, and URLs for images: This clearly labels each packet of information about your website. Notice that most every property has an og: prefix. The information is contained in the head section of the HTML of the site like so: Open Graph is essentially a system that shuttles packets of information about a website’s title, description and preferred image to a place like Facebook. Using Open Graph tags for Facebookįacebook uses a system of tags called the Open Graph protocol. And don’t worry WordPress folks, it’s not all hard-coding. Don’t you love those tweets or Facebook posts that include a photo and a brief summary of the article you’re about to click? Do you wish you knew how to bake that meta-information into your news article? We put together a brief tutorial on how to insert meta tags to optimize your news article for social media.

#Html social media meta tags how to

#Html social media meta tags generator