27 September, 2015

Mengatur Jumlah Karakter Deskripsi (Snippet) Postingan di HomePage Blog

Mengatur jumlah karakter deskripsi (snippet) postingan artikel di homepage blog yang menggunakan template auto read more berguna untuk memperkuat deskripsi yang mewakili isi dari suatu postingan dan sebagai optimasi aspek SEO halaman utama (homepage) sebuah blog / website, banyaknya jumlah karakter kata yang ditampilkan harus tepat agar search engine dapat mengindeksnya, yakni karakter kata pada awal postingan artikel.

Mengatur Jumlah Karakter Deskripsi (Snippet) Postingan di HomePage Blog

Meski dalam segi estetika, desain template yang anda gunakan sudah sempurna. Tapi beberapa template terkadang belum optimasi aspek tersebut, hanya tersedia sedikit ringkasan deskripsi atau bahkan terlalu panjang.

Biasanya secara default, kebanyakan template hanya memiliki deskripsi snippet berkisar 100 karakter. Menurut saya 100 karakter tersebut kurang dalam hal memenuhi aspek SEO. Oleh sebab itu saat ini saya akan membagikan bagaimana cara agar deskripsi postingan pada homepage blog dapat kita ubah panjangnya / banyaknya karakter sesuai keinginan kita. Tutorial ini saya peroleh dari thread seorang template developer di situs Forum Google. Berikut ini caranya :

Mengatur Jumlah Karakter Deskripsi (Snippet) Postingan di HomePage Blog

Secara default, kode html untuk menampilkan deskripsi snippet yaitu <data:post.snippet/>, namun jumlah karakter yang ditampilkan hanya 100 karakter bila postingan memiliki gambar thumbnail, dan 140 karakter bila artikel tidak memiliki gambar thumbnail. Nah, berikut ini cara untuk merubahnya :

1. Letakkan javascript dibawah ini tepat diatas kode </head>
<script type='text/javascript'>
snippet_count = 200;
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var snippet = strx.split("<");
for(var i=0;i<snippet.length;i++){
if(snippet[i].indexOf(">")!=-1){
snippet[i] = snippet[i].substring(snippet[i].indexOf(">")+1,snippet[i].length);
}
}
strx = snippet.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSnippet(pID){
var div = document.getElementById(pID);
var summ = snippet_count;
var summary = '<div class="snippets">' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>
Keterangan : Bila pada template anda sudah memiliki kode javascript tersebut, maka silahkan ganti saja jumlah karakter snippetnya. Untuk menambah atau mengurangi jumlah karakter silahkan ubah angka 200 pada kode snippet_count = 200. 

2. Kemudian cari dan ganti semua kode <data:post.snippet/> dengan kode berikut ini :
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSnippet(&quot;summary<data:post.id/>&quot;);</script>
Catatan : Jika tidak ketemu kode <data:post.snippet/>, maka silahkan cari dan ganti kode berikut ini :
<div class='post-snippet' expr:data-snippet='data:post.snippet'/>
atau
<meta expr:content='data:post.snippet' name='description'/>

3. Dan simpan template

Sekarang silahkan buka blog dan lihat apakah deskripsi postingan pada homepage sudah berubah atau belum. 

Demikian artikel tutorial mengenai Cara Mengatur Jumlah Karakter Deskripsi (Snippet) Postingan di HomePage Blog . Apabila kurang jelas silahkan kirimkan pertanyaan melalui kolom komentar. 

Artikel Terkait

Mengatur Jumlah Karakter Deskripsi (Snippet) Postingan di HomePage Blog
4/ 5
Oleh

Berlangganan

Suka dengan artikel di atas? Silakan berlangganan gratis via email

4 komentar

13 June, 2016 delete

gan, ane malah jadi gk bisa di save, yg tadinya kyk gini
<p style="padding-top: 8%"><data:post.snippet/></p>
jadi kyk gini kan?
<p style="padding-top: 8%"><div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSnippet(&quot;summary<data:post.id/>&quot;);</script></p>

Reply
avatar
17 September, 2016 delete

berhasil coooy makasih tutorialnya...

Reply
avatar
18 September, 2016 delete

Dah di coba gan berhasil tapi snippet nya aneh, semua isi artikel nya muncul, kr kr knp y

Reply
avatar
12 December, 2016 delete

Pas tutorialnya gan gak ada errornya . Thanks for info

Reply
avatar

Mari berkomentar dan berbagi info atau pengalaman Anda. Dan jangan SPAM!