Social sharing cards – make your web pages shareable

Facebook debugger

2 minutes

Social sharing has become more necessary since the dawn of social media applications. Most users, if they appreciate a web page will often share the page via their social networks, this can be through the use of sharing buttons that are provided on a website or by manually copying the URL and posting the URL in their news feeds.

When a user shares your page, your page's meta title, meta description and image will be shared via social sharing cards. This keeps the information included within shared page uniform so that user can add a custom message along with sharing the basic page information.

Previewing a social sharing card

Facebook debugger - link preview
How do you know what your shared page will look like?

You can check how this will look the old fashioned way and try to share the link manually via your own social networks, a preview is available prior to submitting the post on your own social network. Alternatively you can preview how this will look like via the facebook debugger, twitter card validator and linkedin post inspector online tools.

How you can create a social sharing card

Twitter card validator - link preview
How does this work?

Generating these social sharing cards is done through the use of open graph tags. These open graph tags are meta tags that can be customised to suit your web page.

Linkedin post inspector - link preview
Meta tags for social sharing cards

The page preview is dependent on these open graph meta tags (the tags prefixed by og:) and the twitter meta tags (prefixed by twitter:). These tags can be found via in the head section of the web page. Depending on the CMS you can use a plugin or third party tool to generate these tags on your websites behalf or you can manually at these tags to your website within the websites code base.

Diagnosing issues with for your social sharing card

Facebook debugger - diagnostics

Within each of these tools, diagnostic information can be found so you can see what information is scraped by each tools robots and fix any errors should any be produced or correct any mistakes (like spelling mistakes in the meta title and description).

An important point of note is that your page's results are stored on the relevant social media tools servers, so if you make any changes to the title, description or image it is important that you use these tools to re-scrape the page to update the information on their servers to ensure that when a user shares your web page they are sharing with the most up to date information on your web page.

Your browser is out-of-date!

Update your browser to view this website correctly.Update my browser now

×