Open Graph通訊協定(Protocol)本身是一種制定一套Metatags的規格,用來標註你的頁面,告訴我們你的網頁代表哪一類型的現實世界物件。
2010年F8會議上Facebook公布了Open Graph,把這種種不同的Graph連結起來,將形成Open Graph
即這種協議可以讓網頁成為一個「富媒體對象」。
用了Meta Property=og標籤,就是你同意了網頁內容可以被其他社會化網站引用等,目前這種協議被SNS網站如Fackbook、renren採用。
SNS已經成為網絡上的一大熱門應用,優質的內容通過分享在好友間迅速傳播。為了提高站外內容的傳播效率,2010年F8會議上Facebook公布 了一套開放內容協議(Open Graph Protocol),任何網頁只要遵守該協議,SNS就能從頁面上提取最有效的信息並呈現給用戶。
通過Meta Property=og標籤實現。
og是一種新的HTTP頭部標記,即Open Graph Protocol:
範例1:
(來源:startbootstrap.com首頁)
<meta property="og:title" content="Free Bootstrap Themes, Templates, Snippets, and Guides">
<meta property="og:site_name" content="Start Bootstrap">
<meta property="og:type" content="website">
<meta property="og:description" content="Start Bootstrap develops free to download, open source Bootstrap 4 themes, templates, and snippets and creates guides and tutorials to help you learn more about designing and developing with Bootstrap.">
<meta property="og:image" content="https://startbootstrap.com/assets/img/branding/og-start-bootstrap.png">
<meta property="og:url" content="https://startbootstrap.com/">
<meta property="og:image:alt" content="Free Bootstrap Themes, Templates, Snippets, and Guides">
範例2:
(來源:genesis主題網站的首頁)
<!-- Genesis Open Graph -->
<meta property="og:title" content="xxx | 又一個WordPress站點" />
<meta property="og:type" content="website" />
<meta property="og:description" content="xxxx" />
<meta property="og:url" content="http://127.0.0.1/genesis/" />
<meta property="og:image" content="http://127.0.0.1/genesis/wp-content/uploads/2020/09/advantage04.png" />
<meta property="og:image:width" content="305" />
<meta property="og:image:height" content="305" />