Sebagian besar orang yang menekuni dunia blogging niscaya pernah mengalami insiden ibarat ini. Dan duduk kasus ini sering dihadapi blogger yang templatenya belum terpasang Meta Tag khusus untuk share ke Facebook. Postingan berupa link yang disertai dengan gambar dan deskripsi atau yang biasa disebut snippet cenderung lebih menerima perhatian dan klik daripada hanya berupa teks saja.
Karena kalau postingan hanya berupa link saja, terlihat kurang menarik bagi orang yang melihatnya. Oleh alasannya yaitu itu, tentu kita ingin biar postingan yang kita share ke media umum ibarat facebook, twitter, maupun google plus secara otomatis dilengkapi dengan gambar dan deskripsi dari postingan kita. Berdasarkan pengalaman aku selama ngeblog, aku pernah mengalami duduk kasus pada blog aku sendiri pada deskripsi dan gambar yang tadinya muncul tiba-tiba menghilang entah kemana. Hehehe...
Berikut cara memasang Meta Tag Facebook Open Graph (OG) pada Blogger atau Blogspot untuk mengatasi gambar dan judul posting blog yang tidak muncul dikala share ke Facebook.
1. Login ke halaman Dashboard blogspot kamu, sesudah berhasil login, masuk ke sajian Template » Edit HTML.
2. Cari aba-aba <head> , untuk memudahkan pencarian tekan CTRL+F, lalu letakkan aba-aba di bawah ini di bawah aba-aba <head>
3. Kemudian pasang aba-aba berikut ini di bawah kode <body> atau <body .... ada aba-aba lain... />
4. Simpan template.
6. Ukuran Gambar juga Penting!
"Pastikan gambar ilustrasi posting yang diupload berukuran minimal 200x200 pixel atau ideaknlnya minimal 600×300 pixels. Facebook akan mengambil gambar paling besar yang ada di halaman yang di-share."
7. Cek salah satu posting di Facebook Debugger. Masukkan linknya dan lalu klik Ambil info pengurangan baru, biar facebook mengambil ulang cache pada artikel kamu. Kemudian scroll kebawah untuk melihat hasilnya, kalau muncul gambar dan deskripsi ibarat gambar dibawah, berarti kau sudah berhasil.
Demikian Cara Jitu Mengatasi Gambar Posting Blog yang Tidak Muncul Saat di Share ke Facebook. Semoga sanggup bermanfaat bagi kalian semua. Selamat mencoba dan Good Luck! Samapai jumpa di postingan selanjutnya. (https://broggerku.blogspot.com)
sumber
Karena kalau postingan hanya berupa link saja, terlihat kurang menarik bagi orang yang melihatnya. Oleh alasannya yaitu itu, tentu kita ingin biar postingan yang kita share ke media umum ibarat facebook, twitter, maupun google plus secara otomatis dilengkapi dengan gambar dan deskripsi dari postingan kita. Berdasarkan pengalaman aku selama ngeblog, aku pernah mengalami duduk kasus pada blog aku sendiri pada deskripsi dan gambar yang tadinya muncul tiba-tiba menghilang entah kemana. Hehehe...
Mengapa sanggup begitu? dan Bagaimana caranya menambahkan Facebook Open Graph pada Blogger atau Blogspot?
Cara Pasang Meta Tag Facebook Open Graph
Berikut cara memasang Meta Tag Facebook Open Graph (OG) pada Blogger atau Blogspot untuk mengatasi gambar dan judul posting blog yang tidak muncul dikala share ke Facebook.
1. Login ke halaman Dashboard blogspot kamu, sesudah berhasil login, masuk ke sajian Template » Edit HTML.
2. Cari aba-aba <head> , untuk memudahkan pencarian tekan CTRL+F, lalu letakkan aba-aba di bawah ini di bawah aba-aba <head>
Meta Tag Facebook Open Graph
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.pageType == "static_page"'>
<b:if cond='data:blog.url'>
<meta expr:content='data:blog.url' property='og:url'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.pageName'>
<meta expr:content='data:blog.pageName' property='og:title'/>
</b:if></b:if></b:if></b:if>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<b:if cond='data:blog.pageType == "item"'>
<meta content='article' property='og:type'/>
<b:else/>
<meta content='website' property='og:type'/>
</b:if>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
<b:else/>
<meta expr:content='data:blog.blogspotFaviconUrl' property='og:image'/>
</b:if></b:if>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:post.snippet' name='og:description'/>
<b:else/>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta content='KODE_APLIKASI_FB_KAMU' property='fb:app_id'/>
<meta content='KODE_ADMIN_FB_KAMU' property='fb:admins'/>
<meta content='en_US' property='og:locale'/>
<meta content='en_GB' property='og:locale:alternate'/>
<meta content='id_ID' property='og:locale:alternate'/>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.pageType == "static_page"'>
<b:if cond='data:blog.url'>
<meta expr:content='data:blog.url' property='og:url'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.pageName'>
<meta expr:content='data:blog.pageName' property='og:title'/>
</b:if></b:if></b:if></b:if>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<b:if cond='data:blog.pageType == "item"'>
<meta content='article' property='og:type'/>
<b:else/>
<meta content='website' property='og:type'/>
</b:if>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
<b:else/>
<meta expr:content='data:blog.blogspotFaviconUrl' property='og:image'/>
</b:if></b:if>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:post.snippet' name='og:description'/>
<b:else/>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta content='KODE_APLIKASI_FB_KAMU' property='fb:app_id'/>
<meta content='KODE_ADMIN_FB_KAMU' property='fb:admins'/>
<meta content='en_US' property='og:locale'/>
<meta content='en_GB' property='og:locale:alternate'/>
<meta content='id_ID' property='og:locale:alternate'/>
3. Kemudian pasang aba-aba berikut ini di bawah kode <body> atau <body .... ada aba-aba lain... />
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'KODE_APLIKASI_FB_KAMU',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'KODE_APLIKASI_FB_KAMU',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
4. Simpan template.
6. Ukuran Gambar juga Penting!
"Pastikan gambar ilustrasi posting yang diupload berukuran minimal 200x200 pixel atau ideaknlnya minimal 600×300 pixels. Facebook akan mengambil gambar paling besar yang ada di halaman yang di-share."
7. Cek salah satu posting di Facebook Debugger. Masukkan linknya dan lalu klik Ambil info pengurangan baru, biar facebook mengambil ulang cache pada artikel kamu. Kemudian scroll kebawah untuk melihat hasilnya, kalau muncul gambar dan deskripsi ibarat gambar dibawah, berarti kau sudah berhasil.
Demikian Cara Jitu Mengatasi Gambar Posting Blog yang Tidak Muncul Saat di Share ke Facebook. Semoga sanggup bermanfaat bagi kalian semua. Selamat mencoba dan Good Luck! Samapai jumpa di postingan selanjutnya. (https://broggerku.blogspot.com)
sumber