Tapi bila anda cuba share post daripada blog anda, mungkin hanya kelihatan seperti berikut:-
Tak menarik ... :(
Facebook akan mencerap beberapa tags khas untuk dapatkan maklumat seperti nama website, keterangan (description), thumbnail serta sedikit petikan teks (snippet) daripada link yang kita share. Tags itu dipanggil OpenGraph (OG).
Kita perlu masukkan tags OG ini ke dalam laman kita. Untuk pengguna Blogger (blogspot), masukkan tags berikut ke dalam template:-
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html b:version='2' class='v2' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:og='http://ogp.me/ns'> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- Open Graph Meta Tags BEGIN --> | |
| <meta expr:content='data:blog.pageName' property='og:title'/> | |
| <meta expr:content='data:blog.title' property='og:site_name'/> | |
| <meta expr:content='data:blog.canonicalUrl' property='og:url'/> | |
| <b:if cond='data:blog.metaDescription'> | |
| <meta expr:content='data:blog.metaDescription' property='og:description'/> | |
| </b:if> | |
| <b:if cond='data:blog.pageType == "item"'> | |
| <meta content='article' property='og:type'/> | |
| <b:if cond='data:blog.postImageThumbnailUrl'> | |
| <meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/> | |
| </b:if> | |
| <b:else/> | |
| <meta content='blog' property='og:type'/> | |
| <meta content='URL for image file, e.g. site logo' property='og:image'/> | |
| </b:if> | |
| <!-- Open Graph Meta Tags END --> |
Seterusnya untuk test perubahan ini, boleh gunakan https://developers.facebook.com/tools/debug.
Untuk pastikan petikan teks keluar, kena enable terlebih dahulu Search Preferences pada bahagian settings. Selepas itu setiap kali menulis post baru, anda kena masukkan petikan teks tersebut di bahagian Search Description, pada sebelah kanan ruangan menulis dalam Blogger.
Rujukan asal:-
http://support.addthis.com/customer/portal/articles/1399895-adding-open-graph-tags-using-blogger
http://exde601e.blogspot.com/2012/10/open-graph-markup-for-blogger-version-3.html
No comments:
Post a Comment