Cara Memasang Kotak Permalink Keren dibawah Postingan

Assalamu'alaikum Wr. Wb. Sobat Fakhrie.
Nah, pada artikel sebelumnya saya telah membahas tentang Cara Edit HTML Template Blog yang Benar.
Pada kesempatan kali ini, saya akan memberikan tutorial Cara Memasang Kotak Permalink Keren dibawah Postingan. Apa sih gunanya memasang kotak permalink? gunanya adalah agar memperkuat keyword di mata Search Engine khususnya Google yang notabennya merupakan SE nomor 1 di dunia. Ini juga merupakan salah satu teknik SEO Onpage menurut saya.

Penampakkan Kotak Permalinknya seperti ini :

Gimana? keren kan?

Oke, langsung saja ke langkah-langkah memasangnya :

Langkah Pertama : Login Blogger
Langkah Kedua : Pilih blog
Langkah Ketiga : Masuk tab Template
Langkah Keempat : Klik Edit HTML
Langkah Kelima : cari kode ]]></b:skin>
Langkah Keenam : Copy kode dibawah ini

<!-- script berlangganan bskin mulai here -->
#related-posts{float:left; width: 60%;  padding: 0px 3px;}
#related-posts {font-size:16px; text-align:left; color: #1476cc; font-weight: bold;}
#related-posts a{font-size:12px;}
#related-posts li{list-style:decimal; border-bottom: 1px dashed #ccc;}
#box-kanan{float: right; width: 38%; height:250px; padding: 0px 0px 5px;}
.authorinfo { font-size: 12px; border-bottom:double 3px #e6e4e3; margin: 10px 0 10px 0;}
.kotakRSS1 {background-color: rgb(255, 255, 255); -moz-border-radius: 5px;-webkit-border-radius:5px; border: 1px solid #cccccc; padding:5px 10px; margin: 0 0 10px 0; } .Rssardi33 { background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjE19uDLBF8f1HsNECbAb7W6cBQR_wJ6cCR-qVxxkZ_ZjcmqNEIadr-q53CovAnCpVCDJC9it0dWVDQg66lInPsW1unpD8o5XEfior1Vx2AeQjPaTvgReCbX1b9WM8-uJF2Q7mPJg_YXFk/s1600/maskolis.co.cc.jpg') no-repeat bottom right; } .Rssardi33 a { background: none;}  .inpRssardi33 { border: 1px solid #B9C1C6; width: 170px;height: 16px; font-size: 12px; padding:3px 4px 4px 10px;-moz-border-radius:5px;-webkit-border-radius: 5px;} .sbmtRssardi33 {background:#9b9b9b;border: 1px #9b9b9b solid;color:#FFF;font-size:12px;font-family:Arial,Tahoma,Verdana;margin-left:5px;padding:3px 5px 3px 5px;font-weight:bold;-moz-border-radius:7px;-webkit-border-radius: 7px;} .ardi33subs table {border-collapse: inherit; border: none;} .ardi33subs tr { border:0;} .ardi33subs td { border:0;} .ardi33subs th { border:0;} .clear { clear: both; }
<!-- script berlangganan bskin end here -->

Langkah Ketujuh : Letakkan kode yang sudah dicopy tadi tepat diatas kode ]]></b:skin>
Langkah Kedelapan : Cari kode </head>
Langkah Kesembilan : Copy kode dibawah ini

    <!-- script berlangganan head begin here -->
    <script type='text/javascript'>
      //<![CDATA[
      var relatedTitles = new Array();
      var relatedTitlesNum = 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];
          relatedTitles[relatedTitlesNum] = entry.title.$t;
          for (var k = 0; k < entry.link.length; k++) {
            if (entry.link[k].rel == 'alternate') {
              relatedUrls[relatedTitlesNum] = entry.link[k].href;
              relatedTitlesNum++;
              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] = relatedTitles[i];}}
        relatedTitles = 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((relatedTitles.length - 1) * Math.random());
        var i = 0;
        document.write('<ul>');
        while (i < relatedTitles.length && i < 20) {
          document.write('<li><a href="' + relatedUrls[r] + '">' +
                         relatedTitles[r] + '</a></li>
                         ');
                         if (r < relatedTitles.length - 1) {
            r++;
          } else {
            r = 0;}
          i++;}
        document.write('</ul>
                       ');}
                       //]]>
    </script>
    <!-- script berlangganan head end here -->

Langkah Kesepuluh : Letakkan kode tersebut tepat diatas kode </head>
Langkah Kesebelas : Cari kode <data:post.body/>
Note : setiap template terdapat banyak kode <data:post.body/>. Gunakan yang ketiga.
Langkah Keduabelas : Copy kode dibawah ini

                        <!-- script berlangganan data post awal here -->
                        <b:if cond='data:blog.pageType == &quot;item&quot;'>
                          <!-- Script Artikel Berlangganan  -->
                          <div class='kotakRSS1'>
                            <div class='Rssardi33'>
<strong>Title</strong> : <a expr:href='data:post.url' rel='permalink'><data:blog.pageName/></a>
<br/>
<strong>URL</strong> : <data:post.url/>
<br/>
<br/>
Terimakasih sudah membaca artikel tentang <strong><u><data:blog.pageName/></u></strong>, Anda bisa bookmark halaman ini dengan URL <span style='color:green;'>
<b><data:post.url/></b></span>. Jangan lupa Bagikan artikel ini kesemua sosial media agar semua orang tahu. <strong><i>Berbagi Itu Indah</i></strong>. Apabila ada yang kurang jelas silahkan tinggalkan komentar. <strong>Terimakasih</strong>
                            </div>
                          </div>
                          <div class='clear'/>
                        </b:if>
                        <!-- End Artikel Berlangganan -->

Langkah Ketigabelas : Letakkan kode tersebut tepat dibawah kode <data:post.body/>
Langkah Keempatbelas : Klik Simpan

Lihat hasilnya. Jika gagal, maka coba satu-persatu kode <data:post.body/> tadi.
Sekian yang hanya dapat saya bagikan. Semoga bermanfaat bagi sobat semua ^_^