アーカイブスの表示件数を制御 | リアナのカスタマイズ日記(CSS編集用デザイン)

リアナのカスタマイズ日記(CSS編集用デザイン)

アメブロ 新CSS CSS編集用デザイン 無料
カスタマイズ アメブロカスタマイズ 初心者
CSS スタイルシート デザイン
javascript jQuery

★ サイドバーのアーカイブスの表示件数を制御


● サイドバーのアーカイブス(月別)の表示件数は、サイドバーの基本設定では
  指定できません。
  その件数の表示件数を指定可能にします。


● アーカイブスの表示方法は、リスト表示 と プルダウン表示があります。


リアナのカスタマイズ日記(CSS編集用デザイン)



◆ var disp_cnt=5; の 5 が表示件数です。
  好きな表示件数に変えてください。


① リスト表示の場合(下記をフリープラグインへ追記する)


<script type='text/javascript' src='http://stat100.ameba.jp/blog/js/apm001.js'></script>
<script type='text/javascript'>
$(function(){
var disp_cnt=5;
for(i = 0; i < $(".archiveMenu .skinSubList li").length; i++){
if(i>disp_cnt-1){$(".archiveMenu .skinSubList li:eq("+i+")").css("display", "none");}
}})
</script>




② プルダウン表示の場合(下記をフリープラグインへ追記する)


<script type='text/javascript' src='http://stat100.ameba.jp/blog/js/apm001.js'></script>
<script type='text/javascript'>
$(function(){
var disp_cnt=5;
for(i = 0; i < $(".archiveMenu .menuSelectArea option").length; i++){
if(i>disp_cnt){$(".archiveMenu .menuSelectArea option:eq("+i+")").css("display", "none");}
}})
</script>



● 注意

① 下記はフリープラグインの最初に1つあればOKです。

<script type='text/javascript' src='http://stat100.ameba.jp/blog/js/apm001.js'></script>



◆ リスト表示の例(変更前→変更後)



リアナのカスタマイズ日記(CSS編集用デザイン)  右矢印 リアナのカスタマイズ日記(CSS編集用デザイン)



◆ プルダウン表示の例(変更前→変更後)



リアナのカスタマイズ日記(CSS編集用デザイン)  右矢印 リアナのカスタマイズ日記(CSS編集用デザイン)