Customize Website's Social Sharing Experience with Open Graph Protocol

Hi, Have you ever shared your website/webpage link on social media like Facebook,twitter or even Whatsapp for any purpose it may be marketing or advertising we are not concerned about that.You may have noticed that as you insert any link these social media platforms automatically fetches some image and text snippet from your webpage like this for "www.lpu.in".


And if the snippet contains useless info then ofcourse you want to change it. Basically most social media fetches the title and some text and image but if you want to show customized image/text/description for your website then you can easily do it.



Introducing Open Graph Protocol  by facebook that let you to customize your social sharing experience with just few lines of meta tags.

<html prefix="og: http://ogp.me/ns#">
<head>
<title>The Rock (1996)</title>
<meta property="og:title" content="The Rock" />
<meta property="og:type" content="video.movie" />
<meta property="og:url" content="http://www.imdb.com/title/tt0117500/" />
<meta property="og:image" content="http://ia.media-imdb.com/images/rock.jpg" />
...
</head>
... 
        </html> 

With the addition of these few meta tags and modifying the sources/attributes you will achieve the customization. if you want to know more features of open graph protocol kindly visit http://ogp.me

You Can use this protocol for various needs like advertising, marketing or running any campaign.

I hope this will help you
!Cheers!

Comments

Post a Comment

Popular posts from this blog

Evolution of Internet of Things(IoT)

Image
Internet of Things is one of the trending technology of today's era but we never thought from where it come and how it evolved. So be ready to understand the whole evolution of IoT from the beginning. Image Source:Nokia Insight First come back to Pre-Internet era when their is no internet or  and their is only HUMAN to HUMAN Communication it may be via "Fixed Telephonic Line or SMS" at this time their is only network. Then Comes the era of Internet of CONTENT with the evolution of  World Wide Web (WWW) in this time we started using Email and minor messaging  Service. After that Comes the era of  Internet of SERVICES with the evolution of WEB 2.0 the major game changer of modern internet. In this era we started using internet more frequently for communication and other purpose. Service like E-Commerce and E-productivity was born. And Now we are living in Era of Internet of PEOPLE where humans are connected with each other in various ways and in real time
Read more

Developing a Progressive Web App from a Static Web App.

Image
Hi Everyone Suraj Here ! Back again with an awesome article on Progressive Web Apps. From Last Few years PWA's are in Buzz. Tech Giant  GOOGLE always talks about PWA in all its major events like I/O, Chrome Developer Summits, Solve for India , Google Developers Days and many more. Lets Talk little bit about Progressive web Apps according to google. Progressive Web Apps are experiences that combine the best of the web and the best of apps. They are useful to users from the very first visit in a browser tab, no install required. As the user progressively builds a relationship with the app over time, it becomes more and more powerful. It loads quickly, even on flaky networks, sends relevant push notifications, has an icon on the home screen, and loads as a top-level, full screen experience. To Know more about PWA Concept have a look at my older post HERE . Today I am Going to Show How You can Convert your Existing Static Website to a Progressive Website in minutes.
Read more

Building a Progressive Web Apps- CodeLab

Image
Hi Folks, In this codelab we are going to build a progressive web apps from scratch.This codelab is divided into 7 section: Lets Start: 1. Introduction In this codelabs, you will be learning what is a Progressive Web Application, how it works and how to build and deploy one. What is a Progressive Web Application?
Read more