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

Diposting pada

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.

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

[html]
<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>
[/html]

Baca juga:  Cara Mengetahui URL RSS Feed Website dan Blog

di atas kode

[html]
<data:post.body/>
[/html]

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

[html]
xmlns:fb=’http://ogp.me/ns/fb#’
[/html]

di dalam code

[html]
<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’>
[/html]

sehingga codenya menjadi sperti ini:

[html]
<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#’>
[/html]

lalu tambahkan meta tag berikut ini:

[html]
<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’/>
[/html]

di bawah kode <head> dan simpan.

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

[html]
xmlns:og=’http://ogp.me/ns#’
[/html]

di dalam code

Baca juga:  Cara Copy Paste Artikel di Blog yang Tidak Bisa diCopy Paste

[html]
<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’>
[/html]

sehingga codenya menjadi sperti ini:

[html]
<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#’>
[/html]

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

[html]
<!– 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 –>
[/html]

kemudian simpan.

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.

Baca juga:  4 Kemampuan yang Harus Dimiliki Oleh Seorang Blogger

sekian tutorial dari saya, sampai jumpa di sesi berikutnya.

7 thoughts on “Menampilkan Judul Artikel dan Deskripsi Artikel Ketika dishare | Mengatasi Deskripsi dan Judul Artikel Yang Tidak Muncul Ketika dishare

  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

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *