ALL the Shares!!

Customizing the content that you need your users to share on social media couldn’t be easier. I have integrated this with the Umbraco CMS to allow for web administrators to tailor the content that is shared.

Add the following code to your project page and amend accordingly. Once the code is deployed to a publicly accessible URL (This will not work on your localhost!), you will need to run the URL through the following validators to ensure that your content is being found correctly.

https://developers.facebook.com/tools/debug/og/object/

https://dev.twitter.com/cards/types/summary-large-image
https://cards-dev.twitter.com/validator

Place the following in the head of your page

<meta property=”og:url” content=”@Umbraco.NiceUrlWithDomain(CurrentPage.Id)” />
<meta property=”og:type” content=”article” />
<meta property=”og:title” content=”@CurrentPage.facebook_title” />
<meta property=”og:description” content=”@CurrentPage.facebook_summary” />
<meta property=”og:image” content=”@CurrentPage.MediaFile(“facebook_thumbnail_image”).Replace(“https”, “http”)” />
<meta property=”og:image:secure_url” content=”@CurrentPage.MediaFile(“facebook_thumbnail_image”)” />

<meta name=”twitter:card” content=”photo” />
<meta name=”twitter:site” content=”@Umbraco.NiceUrlWithDomain(CurrentPage.Id)” />
<meta name=”twitter:title” content=”@CurrentPage.Twitter_Title” />
<meta name=”twitter:description” content=”@CurrentPage.twitter_summary” />
<meta name=”twitter:image” content=”@CurrentPage.MediaFile(“twitter_thumbnail_image”)” />
<meta name=”twitter:url” content=”@Umbraco.NiceUrlWithDomain(CurrentPage.Id)” />

Place the links in the body content.

<a href=”@String.Format(“https://www.facebook.com/sharer/sharer.php?u={0}”, Umbraco.NiceUrlWithDomain(CurrentPage.Id))” >Facebook</a>

<a href=”@String.Format(“http://pinterest.com/pin/create/link/?url={0}&media={1}&description={2}”, Umbraco.NiceUrlWithDomain(CurrentPage.Id), CurrentPage.MediaFile(“pintrest_thumbnail_image”), CurrentPage.pintrest_summary)”></a>

<a href=”@String.Format(“http://twitter.com/intent/tweet?status={0}”, Umbraco.NiceUrlWithDomain(CurrentPage.Id))”>Twitter></a>

Advertisements