Cara Membuat Multiple Related Post di Blogger

arsipbiru_membuat-multiple-related-post-di-blogger

Arsipbiru.com - Jika sebelumnya saya telah membagikan tutorial bagaimana cara membuat Baca Juga di postingan, maka kali ini saya akan membagikan tutorial bagaimana cara membuat Multiple Related Post di postingan. Multiple Related Post adalah widget yang hampir sama dengan widget Baca Juga atau Artikel Terkait atau Related Post pada umumnya. Namun, hanya saja widget tersebut muncul beberapa kali dalam postingan. Biasanya widget tersebut hanya akan muncul satu kali dalam postingan. 


Multiple Related Post akan muncul setidaknya dua atau lebih link terkait tergantung panjang pendeknya suatu artikel. Seperti yang saya jelaskan sebelumnya bahwa Related Post pada umumnya hanya muncul pada satu tempat dan biasanya berada tepat di tengah-tengah postingan. Contohnya kurang lebih seperti berikut ini.


Paragraf satu.
Paragraf dua.
Paragraf tiga.
Paragraf empat.
<!-- Related Post Biasa -->
Paragraf lima.
Paragraf enam.
Paragraf tujuh.
Paragraf delapan.


Sementara Multiple Related Post akan secara otomatis muncul beberapa link dalam satu artikel. Jumlahnya bisa lebih dari 2 buah, tergantung Anda mengaturnya. Berikut ini contoh jika Anda memasukan 2 buah Multiple Related Post.


Paragraf satu.
Paragraf dua.
<!-- Multiple Related Post -->
Paragraf tiga.
Paragraf empat.
<!-- Multiple Related Post -->
Paragraf lima.
Paragraf enam.


Nah, tertarik ingin memasangnya pada blog? Silahkan Anda ikuti langkah-langkahnya berikut ini.


Cara Membuat Multiple Related Post di Blogger

Sebelum melanjutkan tutorial berikut ini, alangkah baiknya Anda cadangkan terlebih dahulu template Anda. Jika sewaktu-waktu ada kesalahan, Anda dapat memulihkannya dengan cepat.

1. Pertama, silahkan masuk ke akun Blogger masing-masing.


2. Selanjutnya, pilih menu Tema > klik ikon segitiga terbalik di samping menu Sesuaikan > klik Edit HTML.


3. Lalu, letakkan kode CSS berikut ini di atas code ]]></b:skin> atau </style>.

/* Multiple Related Post baca juga */

.ignielMultiRelated {background-color:transparent;border-left:4px solid $(link.colors); margin:10px 0;

display:flex; flex-wrap:nowrap; justify-content:space-between; transition:all .3s ease}

.ignielMultiRelated .content {padding:.5rem .75rem;}

4. Berikutnya, carilah code <data:post.body/> untuk memudahkannya klik satu kali pada template dan tekan CTRL + F.

5. Jika sudah ketemu, letakkan kode berikut ini tepat di bawahnya. Kalau misalkan ada banyak kode <data:post.body/>. Silahkan coba satu per satu. Namun, jika Anda pengguna template Median UI, silahkan cari kode tersebut di atas kode <b:if cond='data:view.isPost'><script>medianTOC();</script></b:if>.
<b:if cond='data:view.isPost'>

  <script> //<![CDATA[

  // Multiple Related Posts by igniel.com

  (function() {

    var jumlah = 4;

    eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('Z i=["\\J\\v\\l\\s\\j\\E\\t\\l\\q\\x\\w\\t\\n\\14\\w\\J\\v\\l\\s\\j\\E\\t\\l\\q\\x\\w\\v","\\X\\F\\h\\n\\x\\D\\h\\k\\h\\A\\j\\l\\n\\T\\k\\k","\\k\\h\\m\\B\\j\\U","\\G\\n\\l\\u","\\q\\o\\L","\\A\\n\\h\\r\\j\\h\\K\\k\\h\\u\\h\\m\\j","\\A\\k\\r\\s\\s\\z\\r\\u\\h","\\o\\B\\m\\o\\h\\k\\M\\F\\k\\j\\o\\O\\h\\k\\r\\j\\h\\q","\\m\\l\\q\\h\\z\\r\\u\\h","\\P","\\o\\m\\s\\h\\n\\j\\R\\h\\G\\l\\n\\h","\\v\\r\\n\\h\\m\\j\\z\\l\\q\\h","\\m\\h\\N\\j\\D\\o\\t\\k\\o\\m\\B"];y p=I[i[1]](i[0]),a=C+1,b=p[i[2]]/a;c=V[i[3]]({W:C},(15,H)=>H+1);Y(y d=0;d<c[i[2]];d++){y e=c[d],f=13((b*e)),g=I[i[5]](i[4]);g[i[6]]=i[7];S(p[f][i[8]]==i[9]){p[f][i[11]][i[10]](g,p[f])}Q{p[f][i[11]][i[10]](g,p[f][i[12]])}}',62,68,'|||||||||||||||||x65|_0xe7e5|x74|x6C|x6F|x6E|x72|x69|post|x64|x61|x73|x62|x6D|x70|x20|x79|let|x4E|x63|x67|jumlah|x53|x2D|x75|x66|_0x67aex5|document|x2E|x45|x76|x4D|x78|x52|x50|else|x42|if|x41|x68|Array|length|x71|for|var||||parseInt|x2C|_0x67aex4'.split('|'),0,{}));

  })();

  eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('a 9=["\\i\\c\\l\\L\\d\\C","\\c\\l\\d\\k\\H","\\x\\c\\c\\K","\\F\\d","\\d\\w\\d\\i\\c","\\i\\w\\l\\M","\\k\\c\\i","\\z\\i\\d\\c\\k\\l\\z\\d\\c","\\C\\k\\c\\x"];a n=o p();a m=0;a f=o p();t E(u){r(a b=0;b<u[9[2]][9[1]][9[0]];b++){a j=u[9[2]][9[1]][b];n[m]=j[9[4]][9[3]];r(a h=0;h<j[9[5]][9[0]];h++){s(j[9[5]][h][9[6]]==9[7]){f[m]=j[9[5]][h][9[8]];m++;I}}}}t G(){a e=o p(0);a g=o p(0);r(a b=0;b<f[9[0]];b++){s(!B(e,f[b])){e[9[0]]+=1;e[e[9[0]]-1]=f[b];g[9[0]]+=1;g[g[9[0]]-1]=n[b]}};n=g;f=e}t B(v,y){r(a q=0;q<v[9[0]];q++){s(v[q]==y){A D}};A J}',49,49,'|||||||||_0x6cd8|var|_0x941ax6|x65|x74|_0x941axa|relatedUrls|_0x941axb|_0x941ax8|x6C|_0x941ax7|x72|x6E|relatedTitlesNum|relatedTitles|new|Array|_0x941axf|for|if|function|_0x941ax5|_0x941axd|x69|x66|_0x941axe|x61|return|contains|x68|true|related_results_labels|x24|removeRelatedDuplicates|x79|break|false|x64|x67|x6B'.split('|'),0,{}));

  //]]> </script>

  <b:if cond='data:post.labels'>

    <b:loop values='data:post.labels' var='label'>

      <b:if cond='data:view.isPost'>

        <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=100&quot;'/>

      </b:if>

    </b:loop>

  </b:if>

  <script> //<![CDATA[

    // Multiple Related Posts by igniel.com

    (function ignielMultiRelated() {

      var text = 'BACA JUGA:';

      eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('P b=["\\e\\f\\c\\B\\h\\E","\\o\\d\\c\\z\\q\\N","\\A\\e\\q\\q\\o","\\S\\n\\B\\c\\n\\f\\e\\C\\y\\e\\h\\n\\T\\f\\e\\d\\h\\f\\z","\\M\\y\\f\\o\\G\\H\\f\\e\\f\\p\\h\\q\\o\\L\\e\\e","\\n\\c\\c\\f\\o\\F\\V\\C\\I","\\k\\g\\m\\d\\c\\s\\p\\e\\d\\g\\g\\u\\j\\p\\q\\c\\h\\f\\c\\h\\j\\l\\k\\g\\m\\d\\c\\s\\p\\e\\d\\g\\g\\u\\j\\h\\f\\K\\h\\j\\l","\\k\\w\\g\\m\\d\\c\\l\\k\\d\\s\\E\\o\\f\\A\\u\\j","\\j\\s\\h\\n\\h\\e\\f\\u\\j","\\j\\l","\\k\\w\\d\\l\\k\\w\\g\\m\\d\\c\\l\\k\\g\\m\\d\\c\\s\\p\\e\\d\\g\\g\\u\\j\\n\\p\\q\\c\\j\\l\\k\\w\\g\\m\\d\\c\\l"];v r=D[b[2]]((t[b[0]]-1)*D[b[1]]());v i=0;v x=O[b[4]](b[3]);Q(i<t[b[0]]&&i<x[b[0]]){R(v a=0;a<x[b[0]];a++){x[a][b[5]]=b[6]+W+b[7]+Y[r]+b[8]+t[r]+b[9]+t[r]+b[U];J(r<t[b[0]]-1){r++}X{r=0};i++}}',61,61,'|||||||||||_0x2867|x6E|x61|x6C|x65|x73|x74||x22|x3C|x3E|x70|x69|x72|x63|x6F||x20|relatedTitles|x3D|let|x2F|jumlah|x75|x64|x66|x67|x4D|Math|x68|x48|x79|x53|x4C|if|x78|x41|x71|x6D|document|var|while|for|x2E|x52|10|x54|text|else|relatedUrls'.split('|'),0,{}));

    })();

  //]]> </script>

</b:if>

var jumlah = 3 merupakan jumlah Multi Related Post yang akan tampil. Jika Anda ingin menambahkan atau mengurangi jumlahnya, Anda cukup mengganti angka 3 dengan angka sesuai keinginan.

var text = 'BACA JUGA:' merupakan judul dari Multi Related Post. Anda bisa menggantinya sesuai keinginan, sepanjang kata tersebut berada di antara tanda petik (').


6. Terakhir, klik Simpan Tema dan lihat hasilnya.

Demikianlah tutorial terkait bagaimana cara membuat Multiple Related Post di Blogger. Jika ada saran dan masukan, silahkan berkomentar di bawah ini. Terima kasih atas kunjungannya dan semoga bermanfaat.

Sumber:

Mau donasi lewat mana?

Trakteer Saweria
N/A
Traktir creator minum kopi dengan cara memberikan sedikit donasi.
Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
More Details