Akshay Bhardwaj Akshay Bhardwaj - 19 days ago 5
ASP.NET (C#) Question

Not able to share desired text from google+ button in ASP.Net website in C#

I am creating a asp.net website using c# and I have placed buttons so that users can share desired articles on various social media platforms.

I have also added a g+ share button, it does share the links but while sharing it is not showing the title and description of the article, instead it keeps on showing the website heading in place of title of article and instead of description it shows the text placed in Contact Us tag.

The following are the images of the page to share and what it shows while sharing:

enter image description here
enter image description here

You can try it yourself by visiting this website.(You might find various issues with this website as this site is in development so please ignore any such issues)

This is the HTML code that I'm using:

<a href="https://plus.google.com/share?url=<%=HttpContext.Current.Request.Url.AbsoluteUri %>" target="_blank"><i class="fa fa-google-plus"></i></a>


Please suggest me how I can solve this issue, do I need to place buttons at a certain position or there is some extra code that I need to write.

Answer

You should add the <meta> tags https://developers.google.com/+/web/snippet/article-rendering

<meta property="og:type" content="article" /> <meta itemprop="og:headline" content="Top 10 Most Challenging Hikes in North America" /> <meta itemprop="og:description" content="Looking for a challenging hike? We spent the past year spanning the continent for the most grueling trails. Check out the entire ranked list, and learn about our methodology..." /> <meta property="og:image" content="http://i.sportyfitness.com/media/tough-trail-lrg.jpg" />

Facebook (https://developers.facebook.com/docs/sharing/webmasters) uses the same metas twitter (https://dev.twitter.com/cards/getting-started) uses twitter:card

if you're doing a SPA you should check https://prerender.io/

EDIT

Facebook Sharing debugger (https://developers.facebook.com/tools/debug/) Twitter card validator (https://cards-dev.twitter.com/validator)