Cara Menampilkan Gambar Thumbnail Halaman Depan Blog di Facebook dan Twitter

SAAT alamat blog atau halaman depan (homepage) blog kita dishare di Facebook atau Twitter, bagusnya muncul gambar thumbnail berupa logo atau gambar pilihan kita. 

Contohnya seperti homepage Contoh Blog ini:

Cara Menampilkan Gambar Thumbnail Halaman Depan Blog di Facebook dan Twitter

Cara Menampilkan Gambar Thumbnail Halaman Depan Blog di Facebook dan Twitter


Jika hanya muncul alamat blog saja, tanpa gambar, berikut ini Cara Menampilkan Gambar Thumbnail Halaman Depan Blog di Facebook dan Twitter.

Cara Menampilkan Gambar Thumbnail Halaman Depan Blog di Facebook dan Twitter

Di dashboard Blogger Anda, Klik Tema > Edit HTML

1. Klik tanda panah di samping Customize 
2. Pilih Edit HTML

Tema > Edit HTML


Tema > Edit HTML

3. Copas/simpan kode berikut ini di atas kode <b:skin>

  <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='https://1.bp.blogspot.com/-nuL5LPtf4ww/X1mX82HzD0I/AAAAAAAAU0s/cx6JCDlmzRcDJw_y0qWk96Xau3qor3fRwCLcBGAsYHQ/s16000/logo-fsp-lem-spsi.JPG' property='og:image'/>
<b:else/>
    <meta expr:content='data:blog.blogspotFaviconUrl' property='og:image'/>
  </b:if>
</b:if>
  <b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' name='twitter:image:src'/>
<b:else/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postThumbnailUrl' name='twitter:image:src'/>
<b:else/>
<meta content='https://1.bp.blogspot.com/-nuL5LPtf4ww/X1mX82HzD0I/AAAAAAAAU0s/cx6JCDlmzRcDJw_y0qWk96Xau3qor3fRwCLcBGAsYHQ/s16000/logo-fsp-lem-spsi.JPG' name='twitter:image:src'/>
</b:if>
</b:if>
<meta content='summary_large_image' name='twitter:card'/>

4. Ganti link gambar warna merah dengan gambar logo atau gambar pilihan Anda.
5. Simpan!

Selesai. Silakan cek dengan menggunakan laman Debug Facebook dan Twitter Card Validator di atas.

Demikian Cara Menampilkan Gambar Thumbnail Halaman Depan Blog di Facebook dan Twitter.*




Thanks for reading Cara Menampilkan Gambar Thumbnail Halaman Depan Blog di Facebook dan Twitter | Labels: Desain Blog, Media Sosial edit this post

1 komentar on Cara Menampilkan Gambar Thumbnail Halaman Depan Blog di Facebook dan Twitter

  1. Caranya mudah sekali ya
    Saya sudah menerapkan sejak lama
    Dan hasilnya juga keren, tampak lebih profesional
    Terimakasih atas sharingnya

    ReplyDelete

Contact Form

Name

Email *

Message *

Back To Top