Bagaimana jika blog anda terlihat acak acak kan dan tidak tersusun rapi apakah mengurangi pengunjung blok? atau blok bisa aja sepi kuburan seperti kuburan. Nah lantas bagaimana cara blog anda bisa menata dengan rapi apa langkah yang harus anda laku kan?.

Baik lah sobat pertanyaan di atas sebenar hanya pertanyaan tidak begitu penting dan suatu blog tapi ada juga manfaat untuk blog anda.

Menyusun dengan rapi struk code template di suatu postingan blog juga sangat bagus loh sobat.

Biasa setiap postingan memiliki tombol share di bawah dan tombol komentar 2 benda ini sangat lah berguna untuk blog anda.

Dan tak kalah enting nya satu lagi yaitu related post atau post terkait.

Kalau tombol share dan tombol komentar di blogger kita sendiri sudah tau apa guna nya bulan. Sekarang kita bahas tentang manfaat related post di postingan blogger anda mari kita simak sedikit tentang Releted post.

Apa itu related post atau post terkait di blogger Related post adalah :. sekumpulan link yang menuju ke postingan atau konten lain yang memiliki kesamaan topik dengan artikel yang sedang dibaca.

Keberadaannya sudah cukup lumrah dan sepertinya belakangan ini menjadi wajib karena dapat membuat pengunjung tertarik untuk menjelajahi postingan lainnya.

Itu arti related post seperti yang di terang di atas nah kita lanjut ke konten utama kita dulu.

Pertama yang harus di lakukan adalah persiap paket Internet anda kalau g ada paket pasti anda GK bisa dunk mengedit nya hehehehe canda kali, dah kita lanjut ke serius aja sobat.

Pertama letak kode di bawah di bagian CSS atau di atas </head> bisa menggunakan style. Seperti tampilan yang saya buat code di bawah ini.

Ingat ya harus di atas code </head>

<Style>

/*Grid Body Putra Winata */

#bang putra winata ul li .thumb{background-color: white; box-sizing: border-box; color: white; float: left; font-family: Roboto; font-size: 14px; margin-top: 0px; min-height: 1px; overflow: hidden; padding-left: 10px; padding-right: 10px; position: relative; width: 160px; height:120px;}#ignielRelated{

display:block;

margin:0px 0px;

line-height:1.2em;}#ignielRelated h3.title{

font-size:15px;

font-weight:600;

text-align:center;

text-transform:uppercase;

line-height:initial;}#ignielRelated h3.title span{

background-color:#fff;

padding:0px 15px;

position:relative;

z-index:999;}#ignielRelated h3.title:before{

content: '';

display: block;

position: relative;

top:10px;

width: 100%;

border-top: 5px solid #cccccc;}#ignielRelated ul{

margin:10px 0px 0px;

padding:0px;

display:flex;

display:-webkit-flex;

flex-wrap:wrap;

-webkit-flex-wrap:wrap;

-ms-flex-wrap:wrap;}#ignielRelated ul li{

list-style:none;

width:calc((100% / 2) - 10px);

text-align:center;

margin-right:10px;

margin-bottom:10px;

padding:0px;

-webkit-margin-start:0px !important;}

#ignielRelated ul li .thumb{

overflow:hidden;

line-height:0px;

border-radius:7px;}#ignielRelated ul li:nth-of-type(2n){

margin-right:0px;}#ignielRelated ul li a{display:block;}#ignielRelated ul li a.judul{

color:#000; /* Warna Huruf */

font-weight:500;

margin-top:10px;}

#ignielRelated ul li a.judul:hover, #ignielRelated ul li:hover a.judul{

color:#000; /* Warna Huruf Ketika Disorot */}#ignielRelated ul li a img{

width:160px; height:120px;

max-height:150px;

transition:all .3s ease;

border:0px;

margin:0px;}#ignielRelated ul li a img:hover, #ignielRelated ul li:hover img{

transform:scale(1.1) rotate(-5deg);

filter: brightness(50%);

-webkit-filter: brightness(50%);}#ignielRelated .norelated{

text-align:center;

font-weight:500;}@media screen and (max-width:480px){

#ignielRelated ul li{

width: calc((100% / 2) - 10px);

margin-right:20px;

margin-bottom:10px;}

#ignielRelated ul li:nth-of-type(6n){

margin-right:10px;}

#ignielRelated ul li:nth-of-type(2n){

margin-right:0px}}

</Style>

Kedua cari code <data post body/> terus pastikan anda sudah menemukan kode yang saya minta tadi ingat pasti jumpa code yang saya minta tadi yaitu code <data post body/>

Jika sudah jumpa maka lihat baik baik anda harus meletak nya Tetap di bawah kode tersebut.

Lalu copy kode script di bawah ini

Dan tempel kan seperti yang saya sebut kan di atas

Jangan salah harus di bawah kode <data post body/>

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

<h3 class='title'><span>Related Posts</span></h3>

<script>//<![CDATA[

var jumlah = 8;

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}('d a=["\\y","\\x\\1f\\f\\k\\h","\\f\\e\\q\\C\\h\\E","\\w","\\k\\q\\A\\e\\1Y\\1d\\P","\\x\\z\\U\\x\\h\\n\\k\\q\\C","","\\1l\\F\\k\\q","\\e\\q\\h\\n\\1E","\\P\\e\\e\\A","\\1H\\h","\\h\\k\\h\\f\\e","\\S\\F\\q\\h\\e\\q\\h","\\x\\z\\v\\v\\g\\n\\1E","\\v\\e\\A\\k\\g\\1H\\h\\E\\z\\v\\U\\q\\g\\k\\f","\\z\\n\\f","\\A\\g\\h\\g\\2n\\k\\v\\g\\C\\e\\D\\1f\\q\\C\\2q\\U\\g\\x\\e\\1M\\1z\\2p\\k\\1t\\1w\\1d\\1C\\1i\\2k\\2j\\2e\\C\\F\\b\\b\\b\\b\\1I\\1n\\Z\\E\\V\\Z\\C\\b\\b\\b\\b\\V\\b\\b\\b\\b\\1w\\O\\b\\1r\\b\\b\\b\\O\\W\\A\\1b\\2f\\e\\b\\b\\b\\b\\b\\1A\\1I\\O\\1n\\1t\\W\\1r\\O\\b\\1l\\U\\1z\\Z\\D\\C\\b\\b\\b\\b\\2h\\V\\f\\V\\W\\1t\\W\\1r\\v\\1T\\1d\\F\\n\\1M\\2g\\2b\\b\\b\\1B\\1X\\b\\1W\\1V\\1j\\1d\\1K\\1G\\1J\\b\\b\\b\\b\\b\\V\\f\\1K\\1J\\1k\\1n\\z\\W\\v\\O\\O","\\f\\k\\q\\1k","\\n\\e\\f","\\g\\f\\h\\e\\n\\q\\g\\h\\e","\\E\\n\\e\\P","\\n\\g\\q\\A\\F\\v","\\P\\f\\F\\F\\n","\\Z\\1C\\1B","\\y\\f\\k\\w","\\y\\A\\k\\1j\\K\\S\\f\\g\\x\\x\\I\\p\\h\\E\\z\\v\\U\\p\\w\\y\\g\\K\\E\\n\\e\\P\\I\\p","\\p\\K\\h\\k\\h\\f\\e\\I\\p","\\p\\w\\y\\k\\v\\C\\K\\x\\n\\S\\I\\p","\\D\\1i\\1b\\2a\\1b\\X\\E\\1b\\1G\\1A\\X\\1f\\X\\1k\\X\\q\\F\\X\\q\\z","\\n\\e\\1f\\f\\g\\S\\e","\\p\\K\\g\\f\\h\\I\\p","\\p\\D\\w\\y\\D\\g\\w\\y\\D\\A\\k\\1j\\w","\\y\\g\\K\\E\\n\\e\\P\\I\\p","\\p\\K\\S\\f\\g\\x\\x\\I\\p\\1l\\z\\A\\z\\f\\p\\w","\\y\\D\\g\\w","\\y\\D\\f\\k\\w","\\1i\\n\\k\\h\\e"];d Q=0,l=J H(),r=J H(),B=J H();1c 2l(t,T){d i=t[a[1]](a[0]);N(d j=0;j<i[a[2]];j++){u(i[j][a[4]](a[3])!=-1){i[j]=i[j][a[5]](i[j][a[4]](a[3])+1,i[j][a[2]])}};i=i[a[7]](a[6]);i=i[a[5]](0,T-1);1q i}1c 2d(T){N(d i=0;i<T[a[9]][a[8]][a[2]];i++){d t=T[a[9]][a[8]][i];l[Q]=t[a[11]][a[10]];1g=a[6];u(a[12]1h t){1g=t[a[12]][a[10]]}1s{u(a[13]1h t){1g=t[a[13]][a[10]]}};u(a[14]1h t){1m=t[a[14]][a[15]]}1s{1m=a[16]};B[Q]=1m;N(d j=0;j<t[a[17]][a[2]];j++){u(t[a[17]][j][a[18]]==a[19]){r[Q]=t[a[17]][j][a[20]];1o}};Q++}}1c 1L(1p,i){N(d j=0;j<1p[a[2]];j++){u(1p[j]==i){1q 1Q}};1q 1P}1c 1R(){d L=J H(0);d R=J H(0);d 1N=J H(0);d Y=J H(0);N(d m=0;m<r[a[2]];m++){u(!1L(L,r[m])){L[a[2]]+=1;L[L[a[2]]-1]=r[m];R[a[2]]+=1;R[R[a[2]]-1]=l[m];1N[a[2]]+=1;Y[a[2]]+=1;Y[Y[a[2]]-1]=B[m]}};l=R;r=L;B=Y;N(d m=0;m<l[a[2]];m++){d G=1a[a[22]]((l[a[2]]-1)*1a[a[21]]());d 1O=l[m];d 1F=r[m];d 1v=B[m];l[m]=l[G];r[m]=r[G];B[m]=B[G];l[G]=1O;r[G]=1F;B[G]=1v};d 1e=0;d o=1a[a[22]]((l[a[2]]-1)*1a[a[21]]());d 1D=o;d M;d 1y=1u[a[23]];2i(1e<1x){u(r[o]!=1y){M=a[24];M+=a[25]+r[o]+a[26]+l[o]+a[27]+B[o][a[29]](/\\/s[0-9]+(\\-c)?/,a[28])+a[2o]+l[o]+a[26]+l[o]+a[2c];M+=a[2m]+r[o]+a[2r]+l[o]+a[1Z];M+=a[1S];1u[a[1U]](M);1e++;u(1e==1x){1o}};u(o<l[a[2]]-1){o++}1s{o=0};u(o==1D){1o}}}',62,152,'||||||||||_0x91f7|x41||var|x65|x6C|x61|x74|_0x46aax8|_0x46aax9|x69|judul|_0x46aax12|x72|_0x46aax18|x27|x6E|urls||_0x46aax6|if|x6D|x3E|x73|x3C|x75|x64|gambar|x67|x2F|x68|x6F|_0x46aax13|Array|x3D|new|x20|_0x46aaxe|_0x46aax1a|for|x43|x66|rel|_0x46aaxf|x63|_0x46aax7|x62|x45|x51|x2D|_0x46aax11|x55|||||||||||Math|x31|function|x4F|_0x46aax17|x70|postcontent|in|x77|x76|x6B|x6A|postimg|x53|break|_0x46aaxc|return|x49|else|x56|document|_0x46aax16|x42|jumlah|_0x46aax1b|x34|x33|x4C|x52|_0x46aax19|x79|_0x46aax15|x32|x24|x4E|x54|x46|contains|x36|_0x46aax10|_0x46aax14|false|true|ignielRelatedGrid|35|x57|36|x37|x58|x2B|x78|34|||||||||||x39|x48|31|relpostimgcuplik|x47|x50|x38|x44|while|x4B|x30|filter|32|x3A|30|x2C|x3B|33'.split('|'),0,{}));

//]]></script>

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

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

</b:loop>

<ul>

</ul>

<b:else/>

There is no other posts in this category.

</b:if>

</div>

</b:if>

Lalu selanjut nya Simpan

Maka hasil nya akan seperti gambar di atas bagaimana rapi bukan.

Akhir kata

Mungkin hanya ini yang dapat saya berikan kalau ada pertnyaan yang membuat anda kurang paham dengan artikel di atas silahkan berikan komentar anda mudah mudahan bisa saya terang kan apa keluhan anda.

Terima kasih....

Semangat slalu blogger indo

Ledies Night

Search This Blog

Cara Buat Post Terkait Grid di blog

Comments

Post a Comment

Colosseum Jakarta

Bombastic dan Morena