Menampilkan Judul Artikel dan Deskripsi Artikel Ketika dishare | Mengatasi Deskripsi dan Judul Artikel Yang Tidak Muncul Ketika dishare

7
30

Pernahkah Anda mengalami suatu problem ketika Anda share artikel, maka tautan yang Anda share tidak menampilkan judul artikel dan deskripsi artikel ketika dishare? tapi justru malah muncul judul blog dan deskripsi dari blog Anda?
Jika memang iya, maka tutorial ini sangat patut untuk Anda coba dan praktekkan.

Sebenarnya ada banyak cara untuk menampilkan judul artikel atau deskripsi artikel ketika dishare. Pada artikel kali ini, saya akan kumpulkan banyak cara dari berbagai sumber dan tutorial yang beredar di internet untuk mengatasi deskripsi dan judul artikel yang tidak muncul ketika dishare. tentunya artikel yang saya share di sini kaitannya dengan platform blogger.

Baca juga:  Cara Membuat Read More Atau Baca Selengkapnya di Blogger Atau Blogspot

cara pertama yang umumnya beredar di internet adalah:
dengan meletakkan kode dibawah ini

<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.snippet'>
<meta expr:content='data:post.snippet' name='description'/>
</b:if>
</b:if>

di atas kode

<data:post.body/>

lalu save.
jika code

 <data:post.body/>

ada lebih dari dua, Anda bisa coba satu-satu atau anda bisa letakkan kode tadi di setiap code

 <data:post.body/>

itu terserah Anda.

cara kedua adalah:
dengan menambahkan kode

xmlns:fb='http://ogp.me/ns/fb#'

di dalam code

<html 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'>

sehingga codenya menjadi sperti ini:

<html 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:fb='http://ogp.me/ns/fb#'>

lalu tambahkan meta tag berikut ini:

<meta property='og:site_name' expr:content='data:blog.title'/>
<meta property='og:image' expr:content='data:blog.postImageThumbnailUrl'/>
<meta property='og:title' expr:content='data:blog.pageTitle'/>
<meta property='og:description' expr:content='data:blog.metaDescription'/>
<meta property='og:type' content='article'/>
<meta property='og:url' expr:content='data:blog.canonicalUrl'/>

di bawah kode <head> dan simpan.

Baca juga:  4 Kemampuan yang Harus Dimiliki Oleh Seorang Blogger

cara ketiga sama dengan cara kedua, tapi kodenya lebih kompleks:
yaitu dengan menambahkan kode

xmlns:og='http://ogp.me/ns#'

di dalam code

<html 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'>

sehingga codenya menjadi sperti ini:

<html 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#'>

kemudian tambahkan meta tags berikut ini di bawah kode <head>.

<!-- BEGIN Open Graph tags -->
<meta expr:content='data:blog.metaDescription' name='description' property='og:description'/>
<meta expr:content='data:blog.pageTitle' name='keywords'/>
<meta content='1784037820' property='fb:admins'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta content='article' property='og:type'/>
<meta content='https://www.blogger.com/profile/15962486274008870514' property='article:author'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<meta expr:content='data:blog.pageName' property='og:title'/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>
<b:else/>
<meta content='http://4.bp.blogspot.com/-Qd1OJTJsRBo/VD2ZZo2OtXI/AAAAAAAAAnM/pAJcsEOPSSM/s220-h/aku.jpg' property='og:image'/>
</b:if>
<b:else/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta expr:content='data:blog.canonicalHomepageUrl' property='og:url'/>
<meta content='blog' property='og:type'/>
<meta content='http://4.bp.blogspot.com/-Qd1OJTJsRBo/VD2ZZo2OtXI/AAAAAAAAAnM/pAJcsEOPSSM/s220-h/aku.jpg' property='og:image'/>
</b:if>
<meta expr:content='&quot;en_US&quot;' property='og:locale'/>
<!-- END Open Graph tags -->

kemudian simpan.

Baca juga:  10 Keuntungan dan Manfaat yang Bisa Kamu Dapatkan Dari Ngeblog

Catatan: Anda bisa mengkombinasikan cara kedua atau cara ketiga dengan cara pertama, tapi anda tidak bisa mengkombinasikan cara kedua dan cara ketiga. Jadi untuk cara kedua dan cara ketiga Anda harus pilih salah satunya, jika memang dirasa belum ada perubahan, Anda bisa mengkombinasikannya dengan cara pertama. Jika memang belum ada perubahan pula, silahkan tunggu 1×24 jam. Kemungkinan besar berubah, jika tidak ada perubahan, minimalnya ketika Anda share artikel, maka tautan tersebut akan menampilkan judul artikel yang Anda share.

sekian tutorial dari saya, sampai jumpa di sesi berikutnya.

7 COMMENTS

  1. mas kalau wordpress bagaimana ya ? saya share artikel google plus ga muncul judul artikel saya,, itu bagaimana ya mas ? mau edit di mana itu ya

LEAVE A REPLY

Please enter your comment!
Please enter your name here