{"id":79,"date":"2014-08-26T09:00:40","date_gmt":"2014-08-26T09:00:40","guid":{"rendered":"http:\/\/www.lcn.com\/blog\/?p=79"},"modified":"2021-07-12T17:14:12","modified_gmt":"2021-07-12T16:14:12","slug":"complete-guide-social-media-markup","status":"publish","type":"post","link":"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/","title":{"rendered":"A Complete Guide to Social Media Markup"},"content":{"rendered":"

A great deal of website traffic comes from social media shares, and a major part of social media marketing is encouraging people to share your content with their Twitter followers, Facebook friends and Google+ contacts<\/p>\n

The more your content is shared with others, the more exposure your website gets. However, webmasters usually don’t have much freedom with regards to how their content appears when someone shares a link on a social network, unless they take a few additional steps.<\/p>\n[Tweet “Social media markup gives you control over how your content appears when shared via social networks”]\n

Social media markup gives you a great deal more control over how your content appears when it is shared over popular social networks. Adding social media markup to your website makes it easier for users to share your content in a more useful and presentable way.<\/p>\n

You can achieve this by adding the necessary HTML code to your website or by using a suitable social media markup plugin if there is one available for your content management system.<\/p>\n

 <\/p>\n

Twitter Cards<\/strong><\/h2>\n

One of the reasons Twitter is so popular is that it keeps things simple, but the 140 character limit also doesn’t provide users with much to work with.<\/p>\n

Twitter Cards allow you to get a great deal more out of this limit by accompanying Tweets with a far richer representation of the content being shared.<\/p>\n

Example of a Twitter card:<\/p>\n

\"Twitter<\/p>\n

There are currently six Twitter Cards available which determine how the preview of your content appears when it is shared on Twitter.<\/p>\n

You can choose from Summary, Photo, Gallery, App, Player or Product cards. For example, if the content in question represents a product, you may want to use the Product Card to better showcase it when the content is shared on Twitter.<\/p>\n

To enable Twitter Cards on your website, you will need to log in to your Twitter account and navigate to dev.twitter.com\/cards to obtain the necessary code.<\/p>\n

The code will look something like the following:<\/p>\n

<meta name=\"twitter:card\" content=\"summary_large_image\"\/>\r\n<meta name=\"twitter:description\" content=\"Description goes here\"\/>\r\n<meta name=\"twitter:title\" content=\"Title here\"\/>\r\n<meta name=\"twitter:site\" content=\"@YourTwitterHandle\"\/>\r\n<meta name=\"twitter:domain\" content=\"http:\/\/www.yourdomain.com\"\/>\r\n<meta name=\"twitter:image:src\" content=\"https:\/\/www.yourdomain\/image.jpg\"\/>\r\n<meta name=\"twitter:creator\" content=\"@AuthorTwitterHandle\"\/><\/em>\r\n<\/pre>\n
For the full lowdown on Twitter Cards you can check out the help section on Twitter at dev.twitter.com\/docs\/cards<\/a>. Once you have familiarised yourself with the various cards available, you can generate one using the Twitter Card Validator<\/a>.<\/p>\n
Related: Small business guide to Twitter<\/a><\/strong><\/em><\/p>\n
 <\/p>\n
Facebook Open Graph<\/strong><\/h2>\n
Facebook Open Graph allows you to customise the way your content appears when it is shared on Facebook. In order to use Open Graph, you will need to add certain meta tags to the HTML code of the webpage you want shared.<\/p>\n
For example, for the homepage, you’ll likely want to use tags which will present information about your website as a whole whenever it is shared, while tags for a specific page should be chosen so that they better summarise and present the content.<\/p>\n
More specific meta tags are also available, including ones which focus on geographical locations, individuals, businesses, products and more.<\/p>\n
Example of Open Graph being used to populate a Facebook link post:<\/p>\n
\"Facebook<\/p>\n
In order to add Open Graph to your website, you will need to add the following two lines to yourtag:<\/p>\n
xmlns:og=\"http:\/\/ogp.me\/ns#\" <\/em>\r\nxmlns:fb=\"https:\/\/www.facebook.com\/2008\/fbml\"><\/em><\/pre>\n
With this code in your homepage HTML, you will now be able to add meta tags to your individual webpages to customise the appearance of their previews when shared. These tags include og:title, og:type, og:image and og:url.<\/p>\n
There are also some additional optional tags such as og:description and og:site_name. For example, the Open Graph meta data attached to a particular webpage may look something like this:<\/p>\n
<meta property=\"og:title\" content=\"Your title\"\/>\r\n<meta property=\"og:image\" content=\"http:\/\/www.yourdomain.com\"\/>\r\n<meta property=\"og:site_name\" content=\"Site name\"\/>\r\n<meta property=\"og:description\" content=\"This is your description\"\/><\/em>\r\n<\/pre>\n
\u00a0Then visit Facebook’s Open Graph debugger<\/a> to validate your code.<\/p>\n
Related: Small business guide to Facebook<\/a><\/strong><\/em><\/p>\n
 <\/p>\n
Google Structured Data<\/strong><\/h2>\n
Google Structured Data is used to customise the way your content appears when shared on the Google+ social network, and more importantly, how it appears in the Google search results (these are commonly known as rich snippets).<\/p>\n
Example of Structured Data being used to populate a Google+ link post:<\/p>\n
\"Google+<\/p>\n
Google supports structured data markup for various different types of content including reviews, people, products, businesses, recipes, events and music.<\/p>\n
However, like Open Graph for Facebook, you can also use structured data to dictate what title, description and image will show when sharing a link in via Google+. As you can see, it\u2019s pretty similar to Open Graph.<\/p>\n
<meta itemprop=\u201dname\u201d content=\u201dTitle here\u201d>\r\n<meta itemprop=\u201ddescription\u201d content=\u201dDescription here\u201d>\r\n<meta itemprop=\u201dimage\u201d content=\u201dhttps:\/\/www.yourdomain\/image.jpg\u201d><\/pre>\n
Once you have added the code you can validate it using Google’s Structured Data Testing Tool<\/a>.<\/p>\n
If Google Structured Data is not present, Google+ will use Open Graph data.<\/p>\n
 <\/p>\n
Your Say!<\/strong><\/h2>\n
If you have any questions at all regarding social markup you can ask us anything in the comments below. Thanks!<\/p>\n","protected":false},"excerpt":{"rendered":"
Add social media markup to your site and get total control over how your content appears when it’s shared over social networks such as Facebook and Twitter.<\/p>\n","protected":false},"author":31,"featured_media":176,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[41,42,39,40],"tags":[4],"class_list":["post-79","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-facebook","category-google","category-social-media","category-twitter","tag-beginner"],"yoast_head":"\nA Complete Guide to Social Media Markup - LCN.com<\/title>\n<meta name=\"description\" content=\"Add social media markup to your site and get total control over how your content appears when it's shared over social networks such as Facebook and Twitter.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"A Complete Guide to Social Media Markup - LCN.com\" \/>\n<meta property=\"og:description\" content=\"Add social media markup to your site and get total control over how your content appears when it's shared over social networks such as Facebook and Twitter.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/\" \/>\n<meta property=\"og:site_name\" content=\"Grow a successful website with the LCN Business Hub\" \/>\n<meta property=\"article:publisher\" content=\"http:\/\/www.facebook.com\/lcndotcom\" \/>\n<meta property=\"article:published_time\" content=\"2014-08-26T09:00:40+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-07-12T16:14:12+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.lcn.com\/blog\/wp-content\/uploads\/2014\/05\/view_img_hr.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"960\" \/>\n\t<meta property=\"og:image:height\" content=\"720\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Nathan Preedy\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@lcndotcom\" \/>\n<meta name=\"twitter:site\" content=\"@lcndotcom\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Nathan Preedy\" \/>\n\t<meta name=\"twitter:label2\" content=\"Estimated reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/\"},\"author\":{\"name\":\"Nathan Preedy\",\"@id\":\"https:\/\/www.lcn.com\/blog\/#\/schema\/person\/e6493782266f4474f2c90dc96682d069\"},\"headline\":\"A Complete Guide to Social Media Markup\",\"datePublished\":\"2014-08-26T09:00:40+00:00\",\"dateModified\":\"2021-07-12T16:14:12+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/\"},\"wordCount\":788,\"image\":{\"@id\":\"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.lcn.com\/blog\/wp-content\/uploads\/2014\/05\/view_img_hr.jpg\",\"keywords\":[\"Beginner\"],\"articleSection\":[\"Facebook\",\"Google+\",\"Social Media\",\"Twitter\"],\"inLanguage\":\"en-GB\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/\",\"url\":\"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/\",\"name\":\"A Complete Guide to Social Media Markup - LCN.com\",\"isPartOf\":{\"@id\":\"https:\/\/www.lcn.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.lcn.com\/blog\/wp-content\/uploads\/2014\/05\/view_img_hr.jpg\",\"datePublished\":\"2014-08-26T09:00:40+00:00\",\"dateModified\":\"2021-07-12T16:14:12+00:00\",\"author\":{\"@id\":\"https:\/\/www.lcn.com\/blog\/#\/schema\/person\/e6493782266f4474f2c90dc96682d069\"},\"description\":\"Add social media markup to your site and get total control over how your content appears when it's shared over social networks such as Facebook and Twitter.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/#breadcrumb\"},\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/#primaryimage\",\"url\":\"https:\/\/www.lcn.com\/blog\/wp-content\/uploads\/2014\/05\/view_img_hr.jpg\",\"contentUrl\":\"https:\/\/www.lcn.com\/blog\/wp-content\/uploads\/2014\/05\/view_img_hr.jpg\",\"width\":960,\"height\":720,\"caption\":\"thumbs up in coffee foam\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"LCN.com\",\"item\":\"\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Blog\",\"item\":\"https:\/\/www.lcn.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Social Media\",\"item\":\"https:\/\/www.lcn.com\/blog\/category\/social-media\/\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"A Complete Guide to Social Media Markup\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.lcn.com\/blog\/#website\",\"url\":\"https:\/\/www.lcn.com\/blog\/\",\"name\":\"Grow a successful website with the LCN Business Hub\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.lcn.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-GB\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.lcn.com\/blog\/#\/schema\/person\/e6493782266f4474f2c90dc96682d069\",\"name\":\"Nathan Preedy\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\/\/www.lcn.com\/blog\/wp-content\/plugins\/wp-user-avatars\/wp-user-avatars\/assets\/images\/mystery.jpg\",\"url\":\"https:\/\/www.lcn.com\/blog\/wp-content\/plugins\/wp-user-avatars\/wp-user-avatars\/assets\/images\/mystery.jpg\",\"contentUrl\":\"https:\/\/www.lcn.com\/blog\/wp-content\/plugins\/wp-user-avatars\/wp-user-avatars\/assets\/images\/mystery.jpg\",\"caption\":\"Nathan Preedy\"},\"description\":\"Nathan has been with team.blue since 2005 and has a background in Technical Support. He is passionate about helping customers find the best product for them and use it to its full potential.\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"A Complete Guide to Social Media Markup - LCN.com","description":"Add social media markup to your site and get total control over how your content appears when it's shared over social networks such as Facebook and Twitter.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/","og_locale":"en_GB","og_type":"article","og_title":"A Complete Guide to Social Media Markup - LCN.com","og_description":"Add social media markup to your site and get total control over how your content appears when it's shared over social networks such as Facebook and Twitter.","og_url":"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/","og_site_name":"Grow a successful website with the LCN Business Hub","article_publisher":"http:\/\/www.facebook.com\/lcndotcom","article_published_time":"2014-08-26T09:00:40+00:00","article_modified_time":"2021-07-12T16:14:12+00:00","og_image":[{"width":960,"height":720,"url":"https:\/\/www.lcn.com\/blog\/wp-content\/uploads\/2014\/05\/view_img_hr.jpg","type":"image\/jpeg"}],"author":"Nathan Preedy","twitter_card":"summary_large_image","twitter_creator":"@lcndotcom","twitter_site":"@lcndotcom","twitter_misc":{"Written by":"Nathan Preedy","Estimated reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/#article","isPartOf":{"@id":"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/"},"author":{"name":"Nathan Preedy","@id":"https:\/\/www.lcn.com\/blog\/#\/schema\/person\/e6493782266f4474f2c90dc96682d069"},"headline":"A Complete Guide to Social Media Markup","datePublished":"2014-08-26T09:00:40+00:00","dateModified":"2021-07-12T16:14:12+00:00","mainEntityOfPage":{"@id":"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/"},"wordCount":788,"image":{"@id":"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/#primaryimage"},"thumbnailUrl":"https:\/\/www.lcn.com\/blog\/wp-content\/uploads\/2014\/05\/view_img_hr.jpg","keywords":["Beginner"],"articleSection":["Facebook","Google+","Social Media","Twitter"],"inLanguage":"en-GB"},{"@type":"WebPage","@id":"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/","url":"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/","name":"A Complete Guide to Social Media Markup - LCN.com","isPartOf":{"@id":"https:\/\/www.lcn.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/#primaryimage"},"image":{"@id":"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/#primaryimage"},"thumbnailUrl":"https:\/\/www.lcn.com\/blog\/wp-content\/uploads\/2014\/05\/view_img_hr.jpg","datePublished":"2014-08-26T09:00:40+00:00","dateModified":"2021-07-12T16:14:12+00:00","author":{"@id":"https:\/\/www.lcn.com\/blog\/#\/schema\/person\/e6493782266f4474f2c90dc96682d069"},"description":"Add social media markup to your site and get total control over how your content appears when it's shared over social networks such as Facebook and Twitter.","breadcrumb":{"@id":"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/#breadcrumb"},"inLanguage":"en-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/"]}]},{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/#primaryimage","url":"https:\/\/www.lcn.com\/blog\/wp-content\/uploads\/2014\/05\/view_img_hr.jpg","contentUrl":"https:\/\/www.lcn.com\/blog\/wp-content\/uploads\/2014\/05\/view_img_hr.jpg","width":960,"height":720,"caption":"thumbs up in coffee foam"},{"@type":"BreadcrumbList","@id":"https:\/\/www.lcn.com\/blog\/complete-guide-social-media-markup\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"LCN.com","item":"\/"},{"@type":"ListItem","position":2,"name":"Blog","item":"https:\/\/www.lcn.com\/blog\/"},{"@type":"ListItem","position":3,"name":"Social Media","item":"https:\/\/www.lcn.com\/blog\/category\/social-media\/"},{"@type":"ListItem","position":4,"name":"A Complete Guide to Social Media Markup"}]},{"@type":"WebSite","@id":"https:\/\/www.lcn.com\/blog\/#website","url":"https:\/\/www.lcn.com\/blog\/","name":"Grow a successful website with the LCN Business Hub","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.lcn.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-GB"},{"@type":"Person","@id":"https:\/\/www.lcn.com\/blog\/#\/schema\/person\/e6493782266f4474f2c90dc96682d069","name":"Nathan Preedy","image":{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/www.lcn.com\/blog\/wp-content\/plugins\/wp-user-avatars\/wp-user-avatars\/assets\/images\/mystery.jpg","url":"https:\/\/www.lcn.com\/blog\/wp-content\/plugins\/wp-user-avatars\/wp-user-avatars\/assets\/images\/mystery.jpg","contentUrl":"https:\/\/www.lcn.com\/blog\/wp-content\/plugins\/wp-user-avatars\/wp-user-avatars\/assets\/images\/mystery.jpg","caption":"Nathan Preedy"},"description":"Nathan has been with team.blue since 2005 and has a background in Technical Support. He is passionate about helping customers find the best product for them and use it to its full potential."}]}},"_links":{"self":[{"href":"https:\/\/www.lcn.com\/blog\/wp-json\/wp\/v2\/posts\/79","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.lcn.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.lcn.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.lcn.com\/blog\/wp-json\/wp\/v2\/users\/31"}],"replies":[{"embeddable":true,"href":"https:\/\/www.lcn.com\/blog\/wp-json\/wp\/v2\/comments?post=79"}],"version-history":[{"count":99,"href":"https:\/\/www.lcn.com\/blog\/wp-json\/wp\/v2\/posts\/79\/revisions"}],"predecessor-version":[{"id":5456,"href":"https:\/\/www.lcn.com\/blog\/wp-json\/wp\/v2\/posts\/79\/revisions\/5456"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.lcn.com\/blog\/wp-json\/wp\/v2\/media\/176"}],"wp:attachment":[{"href":"https:\/\/www.lcn.com\/blog\/wp-json\/wp\/v2\/media?parent=79"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.lcn.com\/blog\/wp-json\/wp\/v2\/categories?post=79"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.lcn.com\/blog\/wp-json\/wp\/v2\/tags?post=79"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}