(1) 基本
当サイトに登録されているRSS情報の中から、最新の100件を対象に8件をランダム表示します。
画像の表示はOGPに画像情報が含まれているサイトのみとなります。
サイズは縦幅は設定可能ですが、横幅は親要素に依存しますので、必要に応じてブロック要素で囲って下さい。
レスポンシブ対応なのでPC、スマホ共にご利用できます。

デフォルト設定では8件表示、黒枠、黒文字、白背景、ランダム表示、高さ50px、画像表示(画像無skip)、一時間内の記事にNEWマークです。
設置したい箇所に下記タグを挿入して下さい。
<script type="text/javascript" charset="utf-8" src="//imgrss.com/plist/co_1207.js"></script>




(2) オプション (必須ではありません)
・plist_max_view : 表示数 (min:1 max:20、default:8)
・plist_img_view : 画像を表示する、無効の場合テキスト表示のみ (無効:0、有効:1、default:1)
・plist_noimg_skip : 画像がないアイテムを表示しない、(無効:0、有効:1、default:1) ※ plist_img_viewの有効が前提
・plist_sort : 並び替え(最新順:0、人気順(クリック数):1、default:0)
・plist_order_limit : 表示対象を100件より狭める、10以上で有効(無効:0、有効:10over、default:0)
・plist_random : ランダム表示(無効:0、有効:1、default:1)
・plist_new_mark : 指定秒数内の記事に「NEW」マークを付ける(有効:秒数、無効:0、default:3600)
・plist_height : 画像1枠の縦幅ピクセル値(min:25、max:250、default:50)、横幅はアスペクト比4:3で自動調節
・plist_add_style : 上書きCSS(背景色、ボーダー、フォントサイズ、行間などの調整用)

	以下 default
	margin-bottom:2px; // 枠と枠との上下隙間調整
	padding:0px; //枠の中の隙間調整
	background-color:white; //背景色
	border-radius:4px; //角の丸さ
	border:1px solid black; //枠の色、太さなど
	color:black; //文字の色
	font-size:15px; //フォントサイズ
	font-weight: normal; //フォントの太さ、重み
	line-height:1.5; //行間調整(複数行の場合、一番下の行が切れる時に調整)

※default値で良い項目は省略出来ます。
※コメントやHTMLタグが入ると上手く動作しない場合があります
設置したい箇所に下記タグを挿入して下さい。
<script type="text/javascript"> var plist_max_view = 5; var plist_img_view = 1; var plist_noimg_skip = 1; var plist_sort = 1; var plist_order_limit = 50; var plist_random = 1; var plist_new_mark = 1800; var plist_height = 50; var plist_add_style = 'color:black;background-color:unset;border:none;line-height:1.6;'; </script> <script type="text/javascript" charset="utf-8" src="//imgrss.com/plist/co_1207.js"></script>


↑を例とした評価順としては(※画像が無い場合は表示されません)
1.登録されている最新100件をplist_sortで人気順にソート
2.表示対象を100件からplist_order_limitで50件に絞る(人気順上位50件が残る)
3.plist_randomで残った50件をシャッフル
4.plist_img_viewで画像表示を選択
5.plist_noimg_skipで画像がないアイテムを除外
5.plist_max_viewに指定された5件を高さ、テキスト色などを指定どおり表示

plist_sortでの人気順はクリック数が基準ですので、plist_order_limitで対象を絞ると
最新記事が表示され難くなります。
鮮度が重要なNEWS系、スポーツ系などは最新順で絞る方が向いています。
plist_randomを無効にするとソート上位(最新or人気)から順番に固定して表示されます。




縦幅をdefault以外に変えるとfont-sizeやline-heightを調整しないと右側の文字列が半切れになったりします。
以下に大まかなサイズと調整のサンプルを表示します、参考にして下さい。



Sample(枠サイズ iPad mini width:768px)
縦幅25px、右側の文字列は1行となります

<script type="text/javascript"> var plist_max_view = 2; var plist_height = 25; var plist_add_style = 'font-size:14px;'; </script> <script type="text/javascript" charset="utf-8" src="//imgrss.com/plist/co_1207.js"></script>



Sample(枠サイズ iPhone12 width:390px)
縦幅はdefaultの50px、文字列は2行となります、画像を非表示にしています。borderを取り消した後に下線だけ設定しました。

<script type="text/javascript"> var plist_max_view = 2; var plist_img_view = 0; var plist_add_style = 'color:blue;border-radius:0px;border:none;border-bottom:1px solid black;'; </script> <script type="text/javascript" charset="utf-8" src="//imgrss.com/plist/co_1207.js"></script>



Sample(枠サイズ iPhone 13 width:390px)
縦幅75px、右側の文字列は3行となります、画像と枠の間に隙間を設けています。

<script type="text/javascript"> var plist_max_view = 2; var plist_height = 75; var plist_add_style = 'line-height:1.6;padding:2px;border:1px solid blue;background-color:aliceblue;'; </script> <script type="text/javascript" charset="utf-8" src="//imgrss.com/plist/co_1207.js"></script>



Sample(枠サイズ iPhone 14 Pro Max width:430px)
縦幅100px、右側の文字列は最大4行となります、角の丸みを強くしています。

<script type="text/javascript"> var plist_max_view = 2; var plist_height = 100; var plist_add_style = 'font-size:16px;border-radius:16px;'; </script> <script type="text/javascript" charset="utf-8" src="//imgrss.com/plist/co_1207.js"></script>