» » Daftar Isi Navigasi [2 Kolom]

Daftar Isi Navigasi [2 Kolom]

17.58
0 komentar
Daftar Isi Navigasi [2 Kolom]
Setelah beberapa hari tidak posting karena sibuk, untuk kesempatan kali ini saya akan posting tentang "Widget Daftar Isi Navigation 2 kolom", widget daftar isi 2 kolom ini hasil modifikasi dari widget daftar isi navigasi dari DT:] dan widget ini pula yang saya gunakan untuk menggantikan elemen posting pada homepage atau halaman utama blog saya.

» CSS

<style type='text/css'>
#toc-outer {
  color:black;
  font:normal 11px/14px Arial,Sans-Serif;
  height:auto;
  margin:0 auto;
  overflow:hidden;
  padding:0;
  text-align:left;
}
#loadingscript {
  background:transparent url(&#39;
  http://3.bp.blogspot.com/-Z0w4M80kNoE/Tz4_RrLC4fI/AAAAAAAACJY/2mQ2yk5hCdU/s1600/loading.gif&#39;
  ) no-repeat 50% 45%;
  font-weight:bold;
  font-size:20px;
  height:345px;
  padding:30px 0;
  text-align:center;
  text-indent:-99999px;
}
.itemposts {
  background-color:#fff;
  border:1px solid #ccc;
  -moz-border-radius:2px;
  -webkit-border-radius:2px;
  border-radius:2px;
  float:right;
  height:130px;
  margin:0 1% 5px;
  overflow:hidden;
  position:relative;
  padding:1%;
  width:45%;
}
.itemposts h6 {
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  border-bottom:2px solid #333;
  color:#333;
  font:bold 11px/16px Sans-Serif;
  height:15px;
  margin:0 0 5px;
  overflow:hidden;
  padding:2px 6px !important;
  text-transform:none;
}
.itemposts h6 a:hover {
  color:#AD3000;
  text-decoration:none;
}
.itemposts img {
  background-color:#fff;
  border:1px solid #ccc;
  -moz-border-radius:3px;
  -webkit-border-radius:3px;
  border-radius:3px;
  float:left;
  height:65px;
  margin:0 7px 5px 0;
  padding:3px;
  width:65px;
  z-indent:99999px;
}
.itemposts .iteminside {}
.itemposts .itemfoot {
  border-radius:5px;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-top:2px solid #333;
  padding:3px;
  clear:both;
  background-color:#fff;
  color:333;
  overflow:hidden;
}
.itemposts .itemfoot a.itemrmore {
  color:#333;
  float:right;
  font-weight:bold;
  text-decoration:none;
}
.itemposts .itemfoot a.itemrmore:hover {text-decoration:underline}
#itempager {
  clear:both;
  padding:10px 0;
}
#halaman,
#totalposts {
  color:#000;
  display:block;
  font:bold 10px Verdana,Arial,Sans-Serif;
  margin-bottom:10px;
  text-align:center;
  padding:0;
}
#halaman span,
#halaman a {
  background-color:#666;
  color:#fff;
  display:inline;
  margin:0 1px;
  padding:3px 5px;
  text-indent:0;
  text-decoration:none;
}
#halaman a:hover {background-color:#333}
#halaman span.actual {background-color:black}
#halaman span.hidden {display:none}
</style>

» JavaScript

<script type='text/javascript'>
//<![CDATA[
var showPostDate   = true,
    showComments   = true,
    idMode         = true,
    sortByLabel    = false,
    labelSorter    = "",
    loadingText    = "Loading...",
    totalPostLabel = "Jumlah posting:",
    jumpPageLabel  = "Halaman",
    commentsLabel  = "Komentar",
    rmoreText      = "Selengkapnya &#9658;",
    prevText       = "Prev",
    nextText       = "Next",
    siteUrl        = "http://mdf-blog.blogspot.com",
    postsperpage   = 4,
    numchars       = 150,
    imgBlank       = "http://2.bp.blogspot.com/-11FkySHGB5Y/TpZ6SSbsF2I/AAAAAAAAA94/zK10UaL7jgo/s1600/images.jpeg";
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
// -----------------------------------------------------------------------------------------
// Table of Content for Blogger with Pagination
// Original: http://vagabundia.blogspot.com/2011/04/resumen-de-entradas-con-paginacion.html
// Modified by Taufik Nurrohman
// On 3 March 2012
// Visit: http://hompimpaalaihumgambreng.blogspot.com
// -----------------------------------------------------------------------------------------
var minpage=4;var maxpage=10;var firstPage=0;var pagernum=0;var postsnum=0;var actualpage=1;function showpageposts(_0xef2cx8){var _0xef2cx9,_0xef2cxa,_0xef2cxb,_0xef2cxc;var _0xef2cxd='';if(pagernum==0){postsnum=parseInt(_0xef2cx8['feed']['openSearch$totalResults'].$t);pagernum=parseInt(postsnum/postsperpage)+1};for(var _0xef2cxe=0;_0xef2cxe<postsperpage;_0xef2cxe++){if(_0xef2cxe==_0xef2cx8['feed']['entry']['length']){break};_0xef2cx9=_0xef2cx8['feed']['entry'][_0xef2cxe];_0xef2cxa=_0xef2cx9['title']['$t'];for(var _0xef2cxf=0;_0xef2cxf<_0xef2cx9['link']['length'];_0xef2cxf++){if(_0xef2cx9['link'][_0xef2cxf]['rel']=='alternate'){_0xef2cxb=_0xef2cx9['link'][_0xef2cxf]['href'];break}};for(var _0xef2cx10=0;_0xef2cx10<_0xef2cx9['link']['length'];_0xef2cx10++){if(_0xef2cx9['link'][_0xef2cx10]['rel']=='replies'&&_0xef2cx9['link'][_0xef2cx10]['type']=='text/html'){var _0xef2cx11=_0xef2cx9['link'][_0xef2cx10]['title']['split'](' ')[0];break}};if('content'in _0xef2cx9){var _0xef2cx12=_0xef2cx9['content']['$t']}else{if('summary'in _0xef2cx9){var _0xef2cx12=_0xef2cx9['summary']['$t']}else{var _0xef2cx12=''}};var _0xef2cx13=/<\S[^>]*>/g;_0xef2cx12=_0xef2cx12['replace'](_0xef2cx13,'');if(_0xef2cx12['length']>numchars){_0xef2cx12=_0xef2cx12['substring'](0,numchars)+'...'};var _0xef2cx14=_0xef2cx9['published']['$t'],_0xef2cx15=_0xef2cx14['substring'](0,4),_0xef2cx16=_0xef2cx14['substring'](5,7),_0xef2cx17=_0xef2cx14['substring'](8,10);var _0xef2cx18=new Array();if(idMode){_0xef2cx18[1]='Jan';_0xef2cx18[2]='Feb';_0xef2cx18[3]='Mar';_0xef2cx18[4]='Apr';_0xef2cx18[5]='Mei';_0xef2cx18[6]='Jun';_0xef2cx18[7]='Jul';_0xef2cx18[8]='Agt';_0xef2cx18[9]='Sep';_0xef2cx18[10]='Okt';_0xef2cx18[11]='Nov';_0xef2cx18[12]='Des'}else{_0xef2cx18[1]='Jan';_0xef2cx18[2]='Feb';_0xef2cx18[3]='Mar';_0xef2cx18[4]='Apr';_0xef2cx18[5]='May';_0xef2cx18[6]='Jun';_0xef2cx18[7]='Jul';_0xef2cx18[8]='Aug';_0xef2cx18[9]='Sep';_0xef2cx18[10]='Oct';_0xef2cx18[11]='Nov';_0xef2cx18[12]='Dec'};var _0xef2cx19=(showPostDate)?_0xef2cx17+' '+_0xef2cx18[parseInt(_0xef2cx16,10)]+' '+_0xef2cx15+' - ':'';var _0xef2cx1a=(showComments)?_0xef2cx11+' '+commentsLabel:'';if('media$thumbnail'in _0xef2cx9){_0xef2cxc=_0xef2cx9['media$thumbnail']['url']}else{_0xef2cxc=imgBlank};_0xef2cxd+='<div class="itemposts">';_0xef2cxd+='<h6><a title="'+_0xef2cxa+'" href="'+_0xef2cxb+'" target="_blank">'+_0xef2cxa+'</a></h6>';_0xef2cxd+='<div class="iteminside"><a title="'+_0xef2cxa+'" href="'+_0xef2cxb+'" target="_blank"><img alt="'+_0xef2cxa+'" src="'+_0xef2cxc+'" /></a>';_0xef2cxd+=_0xef2cx12+'</div>';_0xef2cxd+='<div style="clear:both;"></div><div class="itemfoot">'+_0xef2cx19+_0xef2cx1a+'<a class="itemrmore" href="'+_0xef2cxb+'" target="_blank">'+rmoreText+'</a></div>';_0xef2cxd+='</div>'};document['getElementById']('results')['innerHTML']=_0xef2cxd;halaman()};function halaman(){countP=0;output='';if(actualpage>1){output+='<a class="prevjson" href="javascript:incluirscript('+parseInt(actualpage-1)+')">'+prevText+'</a>'}else{output+='<span class="prevjson hidden">'+prevText+'</span>'};if(pagernum<(maxpage+1)){for(countP=1;countP<=pagernum;countP++){if(countP==actualpage){output+='<span class="actual">'+countP+'</span>'}else{output+='<a href="javascript:incluirscript('+countP+')">'+countP+'</a>'}}}else{if(pagernum>(maxpage-1)){if(actualpage<minpage){for(countP=1;countP<(maxpage-2);countP++){if(countP==actualpage){output+='<span class="actual">'+countP+'</span>'}else{output+='<a href="javascript:incluirscript('+countP+')">'+countP+'</a>'}};output+=' ... ';output+='<a href="javascript:incluirscript('+parseInt(pagernum-1)+')">'+parseInt(pagernum-1)+'</a>';output+='<a href="javascript:incluirscript('+pagernum+')">'+pagernum+'</a>'}else{if(pagernum-(minpage-1)>actualpage&&actualpage>(minpage-1)){output+='<a href="javascript:incluirscript(1)">1</a>';output+='<a href="javascript:incluirscript(2)">2</a>';output+=' ... ';for(countP=actualpage-2;countP<=actualpage+2;countP++){if(countP==actualpage){output+='<span class="actual">'+countP+'</span>'}else{output+='<a href="javascript:incluirscript('+countP+')">'+countP+'</a>'}};output+=' ... ';output+='<a href="javascript:incluirscript('+parseInt(pagernum-1)+')">'+parseInt(pagernum-1)+'</a>';output+='<a href="javascript:incluirscript('+pagernum+')">'+pagernum+'</a>'}else{output+='<a href="javascript:incluirscript(1)">1</a>';output+='<a href="javascript:incluirscript(2)">2</a>';output+=' ... ';for(countP=pagernum-(minpage+1);countP<=pagernum;countP++){if(countP==actualpage){output+='<span class="actual">'+countP+'</span>'}else{output+='<a href="javascript:incluirscript('+countP+')">'+countP+'</a>'}}}}}};if(actualpage<countP-1){output+='<a class="nextjson" href="javascript:incluirscript('+parseInt(actualpage+1)+')">'+nextText+'</a>'}else{output+='<span class="nextjson hidden">'+nextText+'</span>'};document['getElementById']('halaman')['innerHTML']=output;var _0xef2cx1c=(actualpage*postsperpage)-(postsperpage-1);var _0xef2cx1d=actualpage*postsperpage;var _0xef2cx1e=totalPostLabel+' '+postsnum+' - '+jumpPageLabel+' '+_0xef2cx1c+' - '+_0xef2cx1d;document['getElementById']('totalposts')['innerHTML']=_0xef2cx1e};function incluirscript(_0xef2cx20){if(firstPage==1){removerscript()};document['getElementById']('results')['innerHTML']='<div id="loadingscript">'+loadingText+'</div>';document['getElementById']('halaman')['innerHTML']='';document['getElementById']('totalposts')['innerHTML']='';var _0xef2cx1c=(_0xef2cx20*postsperpage)-(postsperpage-1);if(sortByLabel){var _0xef2cx21=siteUrl+'/feeds/posts/default/-/'+labelSorter+'?start-index='+_0xef2cx1c}else{var _0xef2cx21=siteUrl+'/feeds/posts/default/?start-index='+_0xef2cx1c};_0xef2cx21+='&max-results='+postsperpage;_0xef2cx21+='&orderby=published&alt=json-in-script&callback=showpageposts';var _0xef2cx22=document['createElement']('script');_0xef2cx22['setAttribute']('type','text/javascript');_0xef2cx22['setAttribute']('src',_0xef2cx21);_0xef2cx22['setAttribute']('id','TEMPORAL');document['getElementsByTagName']('head')[0]['appendChild'](_0xef2cx22);firstPage=1;actualpage=_0xef2cx20};function removerscript(){var _0xef2cx24=document['getElementById']('TEMPORAL');var _0xef2cx25=_0xef2cx24['parentNode'];_0xef2cx25['removeChild'](_0xef2cx24)};onload=function(){incluirscript(1)};document['write']('<div id="toc-outer">');document['write']('<div id="results"></div>');document['write']('<div id="itempager" style="position:relative;"><div id="halaman"></div>');document['write']('<div id="totalposts"></div></div></div>');//]]>
</script>

Untuk Pemasangannya berikut langkah-langkahnya:
1. Login Akun Blogger anda
2. Pada dashboard pilih Tata Letak » Tambah Gadget » HTML/JavaScript
3. Copy kode berikut ini kedalamnya
<style type='text/css'>
#toc-outer {
  color:black;
  font:normal 11px/14px Arial,Sans-Serif;
  height:auto;
  margin:0 auto;
  overflow:hidden;
  padding:0;
  text-align:left;
}
#loadingscript {
  background:transparent url(&#39;
  http://3.bp.blogspot.com/-Z0w4M80kNoE/Tz4_RrLC4fI/AAAAAAAACJY/2mQ2yk5hCdU/s1600/loading.gif&#39;
  ) no-repeat 50% 45%;
  font-weight:bold;
  font-size:20px;
  height:345px;
  padding:30px 0;
  text-align:center;
  text-indent:-99999px;
}
.itemposts {
  background-color:#fff;
  border:1px solid #ccc;
  -moz-border-radius:2px;
  -webkit-border-radius:2px;
  border-radius:2px;
  float:right;
  height:130px;
  margin:0 1% 5px;
  overflow:hidden;
  position:relative;
  padding:1%;
  width:45%;
}
.itemposts h6 {
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  border-bottom:2px solid #333;
  color:#333;
  font:bold 11px/16px Sans-Serif;
  height:15px;
  margin:0 0 5px;
  overflow:hidden;
  padding:2px 6px !important;
  text-transform:none;
}
.itemposts h6 a:hover {
  color:#AD3000;
  text-decoration:none;
}
.itemposts img {
  background-color:#fff;
  border:1px solid #ccc;
  -moz-border-radius:3px;
  -webkit-border-radius:3px;
  border-radius:3px;
  float:left;
  height:65px;
  margin:0 7px 5px 0;
  padding:3px;
  width:65px;
  z-indent:99999px;
}
.itemposts .iteminside {}
.itemposts .itemfoot {
  border-radius:5px;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-top:2px solid #333;
  padding:3px;
  clear:both;
  background-color:#fff;
  color:333;
  overflow:hidden;
}
.itemposts .itemfoot a.itemrmore {
  color:#333;
  float:right;
  font-weight:bold;
  text-decoration:none;
}
.itemposts .itemfoot a.itemrmore:hover {text-decoration:underline}
#itempager {
  clear:both;
  padding:10px 0;
}
#halaman,
#totalposts {
  color:#000;
  display:block;
  font:bold 10px Verdana,Arial,Sans-Serif;
  margin-bottom:10px;
  text-align:center;
  padding:0;
}
#halaman span,
#halaman a {
  background-color:#666;
  color:#fff;
  display:inline;
  margin:0 1px;
  padding:3px 5px;
  text-indent:0;
  text-decoration:none;
}
#halaman a:hover {background-color:#333}
#halaman span.actual {background-color:black}
#halaman span.hidden {display:none}
</style>
<script type='text/javascript'>
//<![CDATA[
var showPostDate   = true,
    showComments   = true,
    idMode         = true,
    sortByLabel    = false,
    labelSorter    = "",
    loadingText    = "Loading...",
    totalPostLabel = "Jumlah posting:",
    jumpPageLabel  = "Halaman",
    commentsLabel  = "Komentar",
    rmoreText      = "Selengkapnya &#9658;",
    prevText       = "Prev",
    nextText       = "Next",
    siteUrl        = "http://mdf-blog.blogspot.com",
    postsperpage   = 4,
    numchars       = 150,
    imgBlank       = "http://2.bp.blogspot.com/-11FkySHGB5Y/TpZ6SSbsF2I/AAAAAAAAA94/zK10UaL7jgo/s1600/images.jpeg";
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
// -----------------------------------------------------------------------------------------
// Table of Content for Blogger with Pagination
// Original: http://vagabundia.blogspot.com/2011/04/resumen-de-entradas-con-paginacion.html
// Modified by Taufik Nurrohman
// On 3 March 2012
// Visit: http://hompimpaalaihumgambreng.blogspot.com
// -----------------------------------------------------------------------------------------
var minpage=4;var maxpage=10;var firstPage=0;var pagernum=0;var postsnum=0;var actualpage=1;function showpageposts(_0xef2cx8){var _0xef2cx9,_0xef2cxa,_0xef2cxb,_0xef2cxc;var _0xef2cxd='';if(pagernum==0){postsnum=parseInt(_0xef2cx8['feed']['openSearch$totalResults'].$t);pagernum=parseInt(postsnum/postsperpage)+1};for(var _0xef2cxe=0;_0xef2cxe<postsperpage;_0xef2cxe++){if(_0xef2cxe==_0xef2cx8['feed']['entry']['length']){break};_0xef2cx9=_0xef2cx8['feed']['entry'][_0xef2cxe];_0xef2cxa=_0xef2cx9['title']['$t'];for(var _0xef2cxf=0;_0xef2cxf<_0xef2cx9['link']['length'];_0xef2cxf++){if(_0xef2cx9['link'][_0xef2cxf]['rel']=='alternate'){_0xef2cxb=_0xef2cx9['link'][_0xef2cxf]['href'];break}};for(var _0xef2cx10=0;_0xef2cx10<_0xef2cx9['link']['length'];_0xef2cx10++){if(_0xef2cx9['link'][_0xef2cx10]['rel']=='replies'&&_0xef2cx9['link'][_0xef2cx10]['type']=='text/html'){var _0xef2cx11=_0xef2cx9['link'][_0xef2cx10]['title']['split'](' ')[0];break}};if('content'in _0xef2cx9){var _0xef2cx12=_0xef2cx9['content']['$t']}else{if('summary'in _0xef2cx9){var _0xef2cx12=_0xef2cx9['summary']['$t']}else{var _0xef2cx12=''}};var _0xef2cx13=/<\S[^>]*>/g;_0xef2cx12=_0xef2cx12['replace'](_0xef2cx13,'');if(_0xef2cx12['length']>numchars){_0xef2cx12=_0xef2cx12['substring'](0,numchars)+'...'};var _0xef2cx14=_0xef2cx9['published']['$t'],_0xef2cx15=_0xef2cx14['substring'](0,4),_0xef2cx16=_0xef2cx14['substring'](5,7),_0xef2cx17=_0xef2cx14['substring'](8,10);var _0xef2cx18=new Array();if(idMode){_0xef2cx18[1]='Jan';_0xef2cx18[2]='Feb';_0xef2cx18[3]='Mar';_0xef2cx18[4]='Apr';_0xef2cx18[5]='Mei';_0xef2cx18[6]='Jun';_0xef2cx18[7]='Jul';_0xef2cx18[8]='Agt';_0xef2cx18[9]='Sep';_0xef2cx18[10]='Okt';_0xef2cx18[11]='Nov';_0xef2cx18[12]='Des'}else{_0xef2cx18[1]='Jan';_0xef2cx18[2]='Feb';_0xef2cx18[3]='Mar';_0xef2cx18[4]='Apr';_0xef2cx18[5]='May';_0xef2cx18[6]='Jun';_0xef2cx18[7]='Jul';_0xef2cx18[8]='Aug';_0xef2cx18[9]='Sep';_0xef2cx18[10]='Oct';_0xef2cx18[11]='Nov';_0xef2cx18[12]='Dec'};var _0xef2cx19=(showPostDate)?_0xef2cx17+' '+_0xef2cx18[parseInt(_0xef2cx16,10)]+' '+_0xef2cx15+' - ':'';var _0xef2cx1a=(showComments)?_0xef2cx11+' '+commentsLabel:'';if('media$thumbnail'in _0xef2cx9){_0xef2cxc=_0xef2cx9['media$thumbnail']['url']}else{_0xef2cxc=imgBlank};_0xef2cxd+='<div class="itemposts">';_0xef2cxd+='<h6><a title="'+_0xef2cxa+'" href="'+_0xef2cxb+'" target="_blank">'+_0xef2cxa+'</a></h6>';_0xef2cxd+='<div class="iteminside"><a title="'+_0xef2cxa+'" href="'+_0xef2cxb+'" target="_blank"><img alt="'+_0xef2cxa+'" src="'+_0xef2cxc+'" /></a>';_0xef2cxd+=_0xef2cx12+'</div>';_0xef2cxd+='<div style="clear:both;"></div><div class="itemfoot">'+_0xef2cx19+_0xef2cx1a+'<a class="itemrmore" href="'+_0xef2cxb+'" target="_blank">'+rmoreText+'</a></div>';_0xef2cxd+='</div>'};document['getElementById']('results')['innerHTML']=_0xef2cxd;halaman()};function halaman(){countP=0;output='';if(actualpage>1){output+='<a class="prevjson" href="javascript:incluirscript('+parseInt(actualpage-1)+')">'+prevText+'</a>'}else{output+='<span class="prevjson hidden">'+prevText+'</span>'};if(pagernum<(maxpage+1)){for(countP=1;countP<=pagernum;countP++){if(countP==actualpage){output+='<span class="actual">'+countP+'</span>'}else{output+='<a href="javascript:incluirscript('+countP+')">'+countP+'</a>'}}}else{if(pagernum>(maxpage-1)){if(actualpage<minpage){for(countP=1;countP<(maxpage-2);countP++){if(countP==actualpage){output+='<span class="actual">'+countP+'</span>'}else{output+='<a href="javascript:incluirscript('+countP+')">'+countP+'</a>'}};output+=' ... ';output+='<a href="javascript:incluirscript('+parseInt(pagernum-1)+')">'+parseInt(pagernum-1)+'</a>';output+='<a href="javascript:incluirscript('+pagernum+')">'+pagernum+'</a>'}else{if(pagernum-(minpage-1)>actualpage&&actualpage>(minpage-1)){output+='<a href="javascript:incluirscript(1)">1</a>';output+='<a href="javascript:incluirscript(2)">2</a>';output+=' ... ';for(countP=actualpage-2;countP<=actualpage+2;countP++){if(countP==actualpage){output+='<span class="actual">'+countP+'</span>'}else{output+='<a href="javascript:incluirscript('+countP+')">'+countP+'</a>'}};output+=' ... ';output+='<a href="javascript:incluirscript('+parseInt(pagernum-1)+')">'+parseInt(pagernum-1)+'</a>';output+='<a href="javascript:incluirscript('+pagernum+')">'+pagernum+'</a>'}else{output+='<a href="javascript:incluirscript(1)">1</a>';output+='<a href="javascript:incluirscript(2)">2</a>';output+=' ... ';for(countP=pagernum-(minpage+1);countP<=pagernum;countP++){if(countP==actualpage){output+='<span class="actual">'+countP+'</span>'}else{output+='<a href="javascript:incluirscript('+countP+')">'+countP+'</a>'}}}}}};if(actualpage<countP-1){output+='<a class="nextjson" href="javascript:incluirscript('+parseInt(actualpage+1)+')">'+nextText+'</a>'}else{output+='<span class="nextjson hidden">'+nextText+'</span>'};document['getElementById']('halaman')['innerHTML']=output;var _0xef2cx1c=(actualpage*postsperpage)-(postsperpage-1);var _0xef2cx1d=actualpage*postsperpage;var _0xef2cx1e=totalPostLabel+' '+postsnum+' - '+jumpPageLabel+' '+_0xef2cx1c+' - '+_0xef2cx1d;document['getElementById']('totalposts')['innerHTML']=_0xef2cx1e};function incluirscript(_0xef2cx20){if(firstPage==1){removerscript()};document['getElementById']('results')['innerHTML']='<div id="loadingscript">'+loadingText+'</div>';document['getElementById']('halaman')['innerHTML']='';document['getElementById']('totalposts')['innerHTML']='';var _0xef2cx1c=(_0xef2cx20*postsperpage)-(postsperpage-1);if(sortByLabel){var _0xef2cx21=siteUrl+'/feeds/posts/default/-/'+labelSorter+'?start-index='+_0xef2cx1c}else{var _0xef2cx21=siteUrl+'/feeds/posts/default/?start-index='+_0xef2cx1c};_0xef2cx21+='&max-results='+postsperpage;_0xef2cx21+='&orderby=published&alt=json-in-script&callback=showpageposts';var _0xef2cx22=document['createElement']('script');_0xef2cx22['setAttribute']('type','text/javascript');_0xef2cx22['setAttribute']('src',_0xef2cx21);_0xef2cx22['setAttribute']('id','TEMPORAL');document['getElementsByTagName']('head')[0]['appendChild'](_0xef2cx22);firstPage=1;actualpage=_0xef2cx20};function removerscript(){var _0xef2cx24=document['getElementById']('TEMPORAL');var _0xef2cx25=_0xef2cx24['parentNode'];_0xef2cx25['removeChild'](_0xef2cx24)};onload=function(){incluirscript(1)};document['write']('<div id="toc-outer">');document['write']('<div id="results"></div>');document['write']('<div id="itempager" style="position:relative;"><div id="halaman"></div>');document['write']('<div id="totalposts"></div></div></div>');
//]]>
</script>
4. Simpan
5. Simpan Setelan
» Silahkan anda sesuaikan sendiri
» Jika ingin menjadikan satu kolom lihat kode css berikut ini:
.itemposts {
  background-color:#fff;
  border:1px solid #ccc;
  -moz-border-radius:2px;
  -webkit-border-radius:2px;
  border-radius:2px;
  float:right;
  height:130px;
  margin:0 1% 5px;
  overflow:hidden;
  position:relative;
  padding:1%;
  width:45%;
}
ganti dengan kode float, height, dan width-nya
float:left;
height:auto;
width:100%;
» Untuk mengganti tulisan total post, next, prev, readmore dll.
lihat pada bagian java scriptnya

var showPostDate   = true, //menampilkan waktu terbit post
    showComments   = true, //menampilkan jumlah komentar
    idMode         = true, //Indonesian language
    sortByLabel    = false, //berdasarkan label
    labelSorter    = "", //tuliskan nama label jika hanya menampilkan artikel dg lebel tertentu
    loadingText    = "Loading...", //ketika animasi loading tidak muncul
    totalPostLabel = "Jumlah posting:", //tulisan jumlah posting
    jumpPageLabel  = "Halaman", //tulisan halaman
    commentsLabel  = "Komentar", //tulisan komentar/comment
    rmoreText      = "Selengkapnya &#9658;", //tulisan readmore
    prevText       = "Prev", //sebelumnya
    nextText       = "Next", //selanjutnya
    siteUrl        = "http://mdf-blog.blogspot.com", //ganti dengan alamat blog anda
    postsperpage   = 4, //jumlah artikel yang tampil per page
    numchars       = 150, //jumlah karakter huruf yang tampil setiap artikel
    imgBlank       = "http://2.bp.blogspot.com/-11FkySHGB5Y/TpZ6SSbsF2I/AAAAAAAAA94/zK10UaL7jgo/s1600/images.jpeg"; //gambar yang tampil jika post tidak terdapat gambar ataupun gambar tidak bisa ditampilkan


Silahkan anda sesuiakan sendiri ganti false dengan true ataupun sebaliknya.
ganti http://mdf-blog.blogspot.com dengan alamat blog anda.
» Semoga Bermanfaat
Share:

Posting Komentar

Catatan: (memasukan item pada komentar)
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR ANDA...</i>
Untuk menyisipkan kode, gunakan tag <i rel="pre">KODE ANDA...</i>
Untuk menciptakan efek tebal gunakan tag <strong>TEKS ANDA...</strong>

Link aktif akan dimatikan secara otomatis.

NB: Jika ingin menuliskan kode pada komentar harap gunakan Tool untuk mengkonversi kode tersebut agar kode bisa muncul dan jelas atau gunakan tool dibawah "Konversi Kode di Sini!".

NB: Jika ingin menuliskan komentar yang keluar dari topik pada artikel ini silahkan kehalaman OOT (Out Of Topic) dengan menekan tombol OOT di bawah ini.
Back to Top