Cara Membuat Link BACA JUGA di Postingan Blog Beserta Penjelasannya - (Khusus Pemula)

Link baca juga atau Artaikel terkait

Internal link adalah sebuah link yang digunakan untuk menginformasikan bahwa di halaman lain dari blog yang sama masih terdapat artikel yang berkaitan dengan artikel yang dibaca saat ini.

Internal Link atau yang sering kita temui di dalam sebuah postingan artikel blog adalah tulisan Baca juga. Tulisan Baca juga merupakan salah satu teknik SEO yang sangat bermanfaat untuk mengurangi jumlah persentase Bounce Rate dan meningkatkan jumlah Pageview.

Tujuan penulis membuat internal link Baca juga atau Artikel terkait selain untuk mengurangi persentase bounce rate dan menambah jumlah pageview adalah untuk mengedukasi ke pembaca supaya alur artikel tersebut lebih jelas dan mudah untuk dipahami. Maka dari itu banyak penulis artikel yang tidak lupa untuk memberikan internal link di dalam artikel yang Ia buat.

Baca juga: 



Internal Link Otomatis dan  Manual

Membuat internal link dapat Anda lakukan secara otomatis atau manual. Anda dapat memilih kedua jenis tersebut sesuai yang Anda sukai. Namun, akan lebih baik jika Anda mengetahui kelebihan dan kekurangannya terlebih dahulu.

Kelebihan dan Kekurangan Internal Link Otomatis

Kelebihan membuat internal link secara otomatis adalah dibuat dengan menggunakan kode html yang di kolaborasikan dengan kode css terlihat lebih cantik dan menarik. Hal tersebut akan membuat pengunjung merasa nyaman dan akan lebih memungkinkan untuk menjelajahi artikel-artikel Anda yang lainnya.

Selain itu, Internal link yang dibuat secara otomatis tidak akan merepotkan Anda setiap kali membuat artikel. Anda cukup menulis artikel dan posting saja, secara otomatis internal link akan tampil di postingan artikel sesuai dengan label yang Anda berikan.

Kekurangan membuat internal link secara otomatis Adalah membuat sang penulis lupa bahwa internal link yang muncul secara otomatis terkadang tidak sesuai dengan artikel yang dibuat. Hal tersebut akan menjadi link yang sia-sia dan dapat menurunkan kualitas artikel Anda.

Jika Anda masih awam dengan kode html dan css mungkin akan lebih terasa membingungkan. Terlebih jika Anda salah memasukan kode html dan css, justru yang terjadi pada blog Anda adalah eror atau membuat kecepatan loading blog Anda menjadi lambat saat dibuka. Anda juga tidak bisa menentukan di posisi mana yang akan ditampilkan sebagai internal link.

Kelebihan dan Kekurangan Internal Link Manual

Kelebihan membuat internal link secara manual adalah Anda tidak perlu dipusingkan dengan kode html dan css. Anda juga bisa leluasa memberikan internal link yang berkaitan dengan isi artikel tersebut dengan tepat. Hal ini dapat memberikan rujukan yang lebih pasti kepada pengunjung Anda, sehingga pengunjung Anda merasa lebih diringankan.

Selain itu, Anda juga lebih leluasa untuk menempatkan posisi internal link ke posisi yang menurut Anda lebih baik. Hal tersebut akan membuat isi artikel lebih terarah dan terlihat rapi, dan tentunya artikel Anda akan terlihat menarik.

Kekurangan membuat internal link secara manual adalah Anda harus membuat internal link setiap kali membuat artikel yang berkaitan dengan artikel yang lain. Jika blog Anda sudah memiliki lebih dari 500 artikel, mungkin akan sedikit membingungkan untuk mencari artikel-artikel yang berkaitan.

Selain itu, membuat internal link secara manual juga tidak terlihat lebih cantik dan menarik, sebab hanya bertulisan biasa seperti tulisan yang lainnya. Hanya saja seorang blogger lebih sering untuk di buat dengan huruf tebal atau miring atau bisa juga dua-duanya digabungkan agar terlihat sedikit beda dan mudah untuk dilihat.

Untuk Anda yang masih sangat awam tentang kode HTML dan CSS, saya sarankan untuk membuat internal link secara manual saja. Lebih tepat sasaran dan juga mudah dalam proses membuatnya.

Jika Anda sudah mengetahui kelebihan dan kekurangannnya, silakan Anda tentukan sendiri. Ingat, ada "kelebihan dan kekurangannya masing-masing". Pilih sesuai dengan keadaan Anda sendiri.

Cara Membuat Internal link Otomatis

1. Sebelum Anda mengedit kode, silakan cadangkan terlebih dahulu file blog Anda saat itu. Mengapa? Jika terjadi eror, Anda masih mempunyai file cadangan untuk memulihkan blog Anda.
Silakan Anda masuk ke Dasboard blog Anda - Tema - Cadangkan/Pulihkan - Download tema.


2.  Jika sudah, silakan Anda masuk ke Edit HTML. Masukan kode di bawah ini berada di atas kode </head>. Untuk mencari kode agar lebih mudah silakan klik di area kode html dan tekan ctrl+F. Akan muncul kolom di pojok kanan atas. Silakan ketikan kode yang Anda cari lalu Enter. 

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
var relatedSimply = new Array(); var relatedSimplyNum = 0; var relatedUrls = new Array(); function related_results_labels(json) { for (var i = 0; i < json.feed.entry.length; i++) { var entry = json.feed.entry[i]; relatedSimply[relatedSimplyNum] = entry.title.$t; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') {relatedUrls[relatedSimplyNum] = entry.link[k].href; relatedSimplyNum++; break;}}}} function removeRelatedDuplicates() { var tmp = new Array(0); var tmp2 = new Array(0); for(var i = 0; i < relatedUrls.length; i++) { if(!contains(tmp, relatedUrls[i])) { tmp.length += 1; tmp[tmp.length - 1] = relatedUrls[i]; tmp2.length += 1; tmp2[tmp2.length - 1] = relatedSimply[i];}} relatedSimply = tmp2; relatedUrls = tmp;} function contains(a, e) { for(var j = 0; j < a.length; j++) if (a[j]==e) return true; return false;} function printRelatedLabels() { var r = Math.floor((relatedSimply.length - 1) * Math.random()); var i = 0; document.write('<ul>'); while (i < relatedSimply.length && i < 20) { document.write('<li><a href="' + relatedUrls[r] + '">' + relatedSimply[r] + '</a></li>'); if (r < relatedSimply.length - 1) { r++; } else { r = 0;} i++;} document.write('</ul>');}
//]]>
</script>
</b:if>

3. Masukan kode di bawah ini sebelum kode </style> atau ]]></b:skin>

/* Related Post Style 1 */
.related-simplify{position:relative;padding:0;margin:15px auto;width:100%;}
.related-simplify h4{background:#3498db;padding:8px 12px;margin:0;font-size:15px;font-weight:400;color:#fff;border:1px solid #2e88c5}
.related-simplify ul{margin:0;padding:0}
.related-simplify ul li{background:#f6f6f6;position:relative;list-style:none;padding:9px;margin:auto;line-height:1.4em;border:1px solid rgba(0,0,0,0.1);border-bottom:0;transition:all .3s}
.related-simplify ul li:nth-child(odd){background:#fefefe}
.related-simplify ul li:last-child{border-bottom:1px solid rgba(0,0,0,0.1)}
.related-simplify ul li:before{content:'\f138';font-family:fontawesome;position:absolute;margin:0 9px 0 4px;color:#2ecc71;overflow:hidden;transition:all .3s}
.related-simplify ul li:hover:before{content:'\f138';font-family:fontawesome;-webkit-animation:bounceright .3s alternate ease infinite;animation:bounceright .3s alternate ease infinite}
.related-simplify a{color:#0383d9;font-size:13px;margin:0 0 0 30px;}
.related-simplify a:hover{color:#0383d9;text-decoration:underline}
.related-simplify ul li:nth-child(n+4) {display:none;}
@-webkit-keyframes bounceright{from{-webkit-transform:translateX(0)}to{-webkit-transform:translateX(3px)}}
@keyframes bounceright{from{transform:translateX(0)}to{transform:translateX(3px)}}

4. Silakan cari kode <data:post:body/> kemudian Anda ganti dengan kode di bawah ini.

<div expr:id='&quot;post1&quot; + data:post.id'/>
<div class='related-simplify'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=3&quot;' type='text/javascript'/>
</b:if>
</b:loop>
</b:if>
<h4>Baca Juga</h4>
<script type='text/javascript'>
removeRelatedDuplicates();
printRelatedLabels();
</script>
</div>
<div expr:id='&quot;post2&quot; + data:post.id'><p><data:post.body/></p></div>
<script type='text/javascript'>
var obj0=document.getElementById(&quot;post1<data:post.id/>&quot;);
var obj1=document.getElementById(&quot;post2<data:post.id/>&quot;);
var s=obj1.innerHTML;
var t=s.substr(0,s.length/2);
var r=t.lastIndexOf(&quot;&lt;br&gt;&quot;);
if(r&gt;0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+4);}
</script>

5. Jika sudah semua silakan Anda simpan tema dan lihat hasilnya. Jika Anda belum mempunyai font Awesome silakan anda instal terlebih dahulu, agar iconnya bisa terlihat.

Catatan: Kode membuat internal link otomatis di atas saya dapatkan dari blog Mastimon. Karena saya sendiri tidak memakainya dan lebih suka menggunakan yang manual. Untuk lebih jelasnya tentang internal link otomatis di atas, silakan Anda kunjungi sumber kode tersebut. 


Cara Membuat Internal Link Manual

Untuk membuat internal link secara manual sangatlah mudah. Tidak perlu mengotak-atik kode html maupun css. Anda cukup mencari tempat yang sekiranya pas dan menuliskan "Baca Juga: Nama judul postingan yang di tuju". Contoh lihat gambar di bawah ini.


Selanjutnya silakan Anda copy link judul yang akan Anda kaitkan.



Blok tulisan yang akan dijadikan internal link kemudian klik tulisan link di atas sebelah icon gambar.


Selanjutnya masukkan link yang telah Anda copy di kolom URL yang saya beri warna merah. Centang kolom yang bertulisan Open this link in a window. Klik OK. Anda sudah berhasil membuat internal link secara manual.

Tips: Jangan terlalu banyak memberikan internal link di setiap postingan. Hal tersebut akan dinilai Google sebagai SPAM . Silakan buat internal link maksimal 4 saja.

Membuat internal link secara manual adalah hal yang lebih baik menurut saya, karena Anda dapat menentukan artikel mana yang paling berkaitan dari postingan tersebut.

Itulah beberapa penjelasan singkat dan tutorial Cara Membuat Link BACA JUGA di Postingan Blog Beserta Penjelasannya - (Khusus Pemula). Silakan Anda coba sendiri. Semoga dapat bermanfaat dan Anda berhasil membuatnya.


Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel