Solusi Share Ke Facebook Muncul Author Avatar Atau Foto Author

Ditulis oleh: Adhy Suryadi

Ditulis pada: 6/29/2017

Apakah Anda memiliki masalah muncul foto author atau foto komentator Blogger ketika postingan di-share ke Facebook sebagai thumbnail postingan? Padahal jelas bahwa gambar postingan itu bukan foto author atau foto komentator. Menjadi tidak bagus jika thumbnail postingan berupa foto author atau foto komentator ketika di-share ke sosmed, bukan?

Padahal kita sudah memasang kode meta og:image dengan menggunakan post image, tapi kenapa yang muncul sebagai gambar postingan adalah foto author?

Sebagai contoh meta og:image seperti di bawah ini.

<b:if cond='data:blog.postImageUrl'>

<meta expr:content='data:blog.postImageUrl' property='og:image'/>

</b:if>

Jika masalahnya demikian, biasanya penyebab tidak munculnya gambar postingan ketika di-share ke Facebook dan berganti dengan foto author adalah karena ukuran gambar postingan terlalu kecil, lebih kecil dari ukuran foto author. Sementara pada postingan tersebut menampilkan foto author, biasanya pada author box atau postmeta dan secara default ukuran foto author adalah 512px x 512px.

Nah agar hal ini tidak terjadi, maka ukuran foto author harus kecil. Lebih baik ukurannya disamakan dengan ukuran tampilan foto di blog.

Biasanya untuk menampilkan foto author menggunakan kode seperti di bawah ini.

<b:if cond='data:post.authorPhoto.url'>

<img alt='author-photo' class='authorphoto' expr:src='data:post.authorPhoto.url' height='80' title='author photo' width='80'/>

</b:if>

Maka kode di atas akan menghasilkan image seperti di bawah ini (contoh menggunakan authorPhoto saya)

<img alt="author-photo" class="authorphoto" src="//lh3.googleusercontent.com/-Q55pKJrgnXs/AAAAAAAAAAI/AAAAAAAAh9M/ae9EthU2__8/s512/photo.jpg" height='80' title='author photo' width='80'>

Photo di atas akan tampil 80x80 di dalam postingan, namun ukuran photo sebenarnya adalah 512x512 terlihat dari kode /s512/ yang terdapat pada url photo tersebut. Jadi jika ukuran gambar postingan kurang dari 512x512 maka gambar yang akan muncul ketika di-share ke Facebook adalah foto author-nya.

Nah agar foto author berukuran kecil, sebaiknya gunakan kode resizeImage Blogger untuk gambar-gambar Blogger.

Silahkan gunakan kode di bawah ini untuk menampilkan foto author dengan ukuran kecil atau ukuran sesuai tampilannya di blog.

<b:if cond='data:post.authorPhoto.url'>

<img alt='author-photo' class='authorphoto' expr:src='resizeImage(data:post.authorPhoto.url,80)' height='80' title='author photo' width='80'/>

</b:if>

Silahkan sesuaikan 80 dengan ukuran tampilan foto di blog. Dengan kode di atas maka akan menghasilkan kode image seperti di bawah ini.

<img alt="author-photo" class="authorphoto" src="//lh3.googleusercontent.com/-Q55pKJrgnXs/AAAAAAAAAAI/AAAAAAAAh9M/ae9EthU2__8/w80/photo.jpg" height='80' title='author photo' width='80'>

Dengan /w80/ maka ukuran foto sebenarnya adalah 80x80.

Trik ini juga bisa digunakan pada foto avatar komentar jika yang muncul ketika share postingan di Facebook adalah foto komentator Blogger. Semoga bermanfaat.