Mengatasi Gambar Tidak Tampil Saat Di Share Ke Facebook
Mengatasi Gambar Salah (Tidak Muncul / Tampil), Tidak Sesuai Saat Share Ke Facebook
Tutorial Cara Mengatasi Gambar Thumbnail Blog Tidak Muncul Ketika di Share Facebook, kali ini blog mas tamvan akan share trik untuk memperbaiki gambar thumbnail homepage / alaman post yang tidak muncul saat di share ke fb dengan memakai meta tag og:image
Mungkin blog kalian juga memiliki beberapa problem kenapa gambar image tidak muncul saat di share ...
Gambar muncul tapi hanya itu aja, tidak sesuai dengan yang ada di postingan, Thumbnail Di postingan muncul tapi saat share homepage gambarnya tidak ada..., Gambar homepage dan post muncul tapi ukurannya kecil..
Nah mungkin masih banyak yg lainnya, saya sudah mencoba beberapa percobaan di template yang di gunakan teman blogger saya ibarat Templates Evo Magz Blog, Simplify 2 Red, Template anime, dan masalahnya berbeda-beda tapi cara memperbaikinya sama.
Ukuran maximum gambar yang di upload ke facebook 1200 x 630 (Tanpa Link Tautan / dapat tapi terpotong).
Ukuran yang disarankan untuk menampilkan Gambar Cukup Besar Dan Tautan Di Bawahnya 600 x 315 Cocok Untuk Website.
Ukuran Minimum Thumbnail : 200px by 200px. Akan menampilkan Gambar Di Sebelah Kiri Dan Tautan Di Sebelah Kanan.
Jadi kalian dapat menciptakan tampilan gambar thumbnail lebih maksimal saat di share ke Facebook dengan menentukan ukuran yang sudah di tentukan oleh facebook, saya sendiri memakai ukuran gambar 600 x 315 yang akan menampilkan gambar thubnail di atas tautan / Judul dan Deskripsi Blog
Okeh, kini kita pribadi menuju ke permasalahannya.. Kenapa Gambar Thumbnail Blogger Tidak Tampil / Tidak Sesuai Ketika Di Share Ke Facebook
- Silahkan kalian login terlebih dahulu ke akun blogger kalian
- Lalu masuk ke hidangan Template → Edit HTML
- Sekarang kita akan merubah / menambahkan meta tag og:image
- Mungkin Para pembuat template kini sudah menambahkan og:image tapi ada juga yang belum.
- Langkah Pertama Silahkan Kalian Cari Kode property='og:image'
- Nanti akan ada isyarat ibarat ini / ibarat mirip ini ↓
<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> - Kalian tinggal rubah isyarat ini <meta expr:content='data:blog.blogspotFaviconUrl' property='og:image' />
- Menjad menjadi <meta content='LINK URL IMAGE KALIAN' property='og:image'/>, Sehingga karenanya ibarat dibawah ini
<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 content='LINK URL IMAGE KALIAN' property='og:image'/> </b:if> </b:if> LINK URL IMAGE KALIAN, Ganti Dengan Link Logo Blog Kalian, Thumbnail itu akan di tampilkan saat homepage di share ke facebook. Sedangkan untuk halaman post akan otomatis mengambil gambar yang ada di dalam postingan.
Nanti Hasilnya Sperti ini
<meta content='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyRqcMulRFQdfFRy7KgpJDT9vqskPDBcFc29sD7YKeI8cCBpkZmMEdoxRmA8bD6_JcVIGIkdHon2AedczpJwB_SlW2s22MqGSOZFW9kHlFJeMwlsislVkskiJ_EsWpL2OL8x5sFJYYGffo/s1600/Blog-Mas-Tamvan.png' property='og:image'/> - Intinya sih kalian jangan memakai image dari Favicon data:blog.blogspotFaviconUrl Karena ukurannya terlalu kecil
- Nah cara di atas ini untuk mengatasi Thumbnail yang sudah ada og:imagenya. Buat kalian yang tidak menemukan tag og:image
Cara Menambahkan Meta Tag og:image Di Blogger
- Kalian Cari Kode <head>, kemudian copy dan masukan isyarat dibawah ini dibwahnya
<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 content='LINK URL IMAGE KALIAN' property='og:image'/> </b:if> </b:if> Jangan lupa ganti LINK URL IMAGE KALIAN, Seperti Catatan di atas ↑
- Kalo sudah, kalian tinggal save template..
Berdasakran pengalaman, isyarat di atas biasanya tidak pribadi bekerja. Kalian harus menunggunya beberapa hari / jam. Atau kalian dapat coba submit website kalian ke webmaster
Untuk mengeceknya kalian dapat memakai tools dari developer facebook Facebook Sharing Debugger
Jangan lupa mampir ke artikel lainnya ya gan
Cukup sekian dan terima kasih, biar artikel wacana Tutorial Cara Mengatasi Gambar Thumbnai Blogger Yang Tidak Tampil Ketika Di Share Ke Social Media Facebook ini bermanfaat
Apabila ada yang resah silahkan bertanya di kolom komentar