ブログテンプレートならHKD

このプラグインのプログラムの流れは、表示させるRSSの内容を作る→その内容を#CustomRssReaderAreaというID名のdivボックスに表示する、という流れになっています。
そのため、同時にダウンロードした二つ目のプラグインも同じdivボックスに内容を表示させようとするので、表示がおかしくなります。

つまり#CustomRssReaderAreaとは違う表示領域を設けて、そこに表示させるようにすればOKとなります。

ではいつものようにダウンロードしたプラグインの編集画面からHTMLの編集を開いてください。

/********** javascriptのカスタマイズはここまで ***********/


  $("#CustomRssReaderArea").CustomRssReader({"rssArr" : rssList, "displayItem": displayItem, "sortItem": sortItem, "rssItemLimit": rssItemLimit, "titleLength": titleLength, "descriptionLength": descriptionLength, "dateFormat": dateFormat, "effectSpeed": effectSpeed, "newmark": newmark, "thumnail": thumnail});
 });
-->
</script>

この青字の部分を仮に#hutatumeという名前に変更します。
この部分でどこに表示させるかの命令を行っています。

/********** CSSのカスタマイズはここまで ***********/

-->
</style>
<div id="CustomRssReaderArea"></div>

この青字の部分をさっきと同じようにhutatumeと変更します。
これで表示させるdivボックスが完成しました。

/********** CSSのカスタマイズはここから ***********/

#CustomRssReaderArea{
	margin:0px;
	padding:0px;
}
#CustomRssReaderArea div.crr_container{
	/*ここのheightで高さを設定*/
	height:300px;
	
	overflow-x:hidden;
	overflow-y:scroll;
	padding-right:5px;
}
#CustomRssReaderArea div.crr_container ul.rssBox{
	margin:0px;
	padding:0px;
}
#CustomRssReaderArea div.crr_container ul.rssBox li.rssList{
	width:100%;
	list-style:none;
	list-style-image:none;
	background-image:none;
	padding:0px;
	margin:0px;
}
/*　シーケンス番号が入っている　*/
#CustomRssReaderArea div.crr_container ul.rssBox li.rssList span.crr_seq{
}
/*　カテゴリーが入っている　*/
#CustomRssReaderArea div.crr_container ul.rssBox li.rssList span.crr_category{
}
/*　タイトルが入っている　*/
#CustomRssReaderArea div.crr_container ul.rssBox li.rssList span.crr_title{
}
/*　日付が入っている　*/
#CustomRssReaderArea div.crr_container ul.rssBox li.rssList span.crr_date{
	display:block;
	padding-bottom:2px;
	text-align:right;
}
/*　Newマークが入っている　*/
#CustomRssReaderArea div.crr_container ul.rssBox li.rssList span.crr_newmark{
}
/*　ソーシャルブックマークのリスト　*/
#CustomRssReaderArea div.crr_container ul.rssBox li.rssList ul.crr_bookmark{
	display:inline;
}
/*　はてブ・twitter・FaceBookが入っている　*/
#CustomRssReaderArea div.crr_container ul.rssBox li.rssList ul.crr_bookmark li{
	display:inline;
	margin:0px;
	padding:0px;
	background-image: none;
	list-style:none;
}
/*　サムネイルのリスト　*/
#CustomRssReaderArea ul.thumnailBox li.crr_thumnail{
	list-style:none;
	padding:0px;
}
/*　サムネイルの画像　*/
#CustomRssReaderArea ul.thumnailBox li.crr_thumnail img{
	border:1px solid #333333;
}

/********** CSSのカスタマイズはここまで ***********/

最後にこの青字の部分を#hutatumeに変更し、CSSの変更も行います。


これで完了です。

関連記事

• CustomRssReaderカスタマイズ【表示される記事数編】 (2012/01/25)
• CustomRssReaderカスタマイズ【日付が未来になっている記事の表示設定】 (2011/11/20)
• CustomRssReaderを2つ同時に使う方法 (2011/10/16)
• CustomRssReaderカスタマイズ【ソーシャルブックマーク編】 (2011/05/29)
• CustomRssReaderカスタマイズ【デザインサンプル編】 (2011/05/29)