まとめサイト速報「いちページ」

　うちの猫がパソコンの前から動かないと思っていたら、このサイトができていました。

　このサイトは独断と偏見により集めたまとめサイトのRSSを利用し、新着記事を1ページにまとめたサイトです。ﾆｬ
　紹介している記事やメディア等の著作権は、それぞれの権利者に帰属します。掲載内容は引用の範囲内にとどめておりますが、万が一問題あればご連絡ください。

　掲載依頼や、削除依頼、変更依頼も以下のアドレスまでご連絡ください。こたろうの写真くださいでもOKﾐｬ！
　相互リンク/相互RSS依頼、大歓迎です。ﾏｰｵ。

• サイト名：　まとめサイト速報「いちページ」 （タイトルが長い！ってときは「いちぺーじ」とかもう「壱頁」でもOKですﾆｬﾝｺﾛﾘ。）
• 管理猫名：　こたろう （飼い主：りゅういち）
• サイトURL：　http://www.dvd-access.com/matome/
• サイトRSS：　http://www.dvd-access.com/matome/index.rdf 　カテゴリ別RSSもありますﾆｬ（＾ω＾）
• もろもろ連絡先：　mailto:webmaster@dvd-access.com または、メールフォームからどぞ
• Twitter：　@kotarou_matomeをフォロー

　相互リンクしてくださると、、、アクセス数に応じて新着つぶやき率、新着RSSの掲載が最大5倍になり(ﾟдﾟ)ﾏｰｰｰｵ！
　1ヶ月以上更新がなかった場合、記事紹介ばかりの場合はまことに勝手ながら更新停止状態にしますﾆｬ(´・ω・｀) 更新再開時にはお気軽にご連絡くださいﾆｬ(｀・ω・´)
　逆アクセスを参考に、勝手に追加することもありますのであしからずご了承ください。掲載位置も逆アクセスを参考に入れ替えていますﾆｬ。

　逆アクセスは「dvd-access.com/matome」でまとめてくだればうれしいですﾐｬ（＾ω＾）たらいまわしが嫌なので、まとめて下さっている記事へは直接飛ぶようにしていますﾆｬ(｀・ω・´)

• RSS収集間隔：最短30分ごと
• ツイート数収集間隔：最短12分ごと
• クリック数収集期間：1週間ちょい
• HOT TAG更新間隔：最短15分ごと
  HOT TAGは、Yahoo! JAPAN Webサービスの「キーフレーズ抽出」に最新の100KB分の記事をつっこんで解析しています。
• 新着／話題／人気記事画像は、RSSのdiscriptionまたはcontent:encoded内のimgタグから抽出
• 本サイトは、RSS分のみの記事の紹介であり、保存は目的としていません。
  更新頻度の高いサイト様は、RSSの件数が1日分以上あるとうれしいですﾆｬ(´・ω・｀)

その他、履歴的なモノ

• 2012/04/17：サイト開設したﾆｬ(｀・ω・´)
• 2012/05/27：1日のアクセス交換数が1000を超えたﾆｬ（＾ω＾）
• 2012/06/15：ツイッターのフォロワーが1000人超えたﾆｬ！(・｀ω・´)
• 2012/06/25：Click Count開始したﾆｬ(　｀ω´)
• 2012/07/11：100,000 Clickﾆｬ！(∩´ω｀)∩
• 2012/10/30：1,000,000 Clickﾆｬ！(∩´ω｀)∩
• 2012/11/24：ブログパーツを公開したﾆｬ(｀・ω・´)
• 2013/08/01：総クリック回数をリセットしたﾆｬ(´・ω・｀)

　あなたのブログ記事のTwitterのつぶやき数ランキングのブログパーツです。

特徴

• あなたのブログ記事のTwitterつぶやき数をランキング形式で表示します。
• テキスト表示、画像表示が可能です。
• ランキング表示数も指定できます。
• デザインはCSS（スタイルシート）で変更可能です。

制限

• ※リツイート数の取得がサーバのスペック上できず、暫定としてクリック数（pt）ランキングとなります。
• ※注意：RSSで取得可能な記事分のみのランキングとなります。ランキング対象を増やしたい場合は、RSS出力数を増やしてください。
• ※注意：当サイトにRSSが登録されていないと使用できません。この機会にぜひ、、お問合せ
• 他サイトの記事紹介が1件表示されます。（※現状表示されるのは当サイトと相互リンクしているサイトの記事のみ）
• 画像は、RSSのdiscriptionまたはcontent:encoded内のimgタグから抽出しています。その記述がない場合、画像は表示されません。

サンプル （２ちゃんねるのこわーい話まとめさまの情報をサンプルとして利用させていただいております）

テキスト表示：

画像表示：

使用方法 / お問合せ

表示方法

以下のJavaScriptコードを表示したい箇所に記載します。

<script type="text/javascript" src="http://www.dvd-access.com/matome/tool/parts.php?url=[ブログURL]"></script>
    

テキスト表示サンプル

画像を表示したい場合は、以下のように記載します。

<script type="text/javascript" src="http://www.dvd-access.com/matome/tool/parts.php?url=[ブログURL]&img=true"></script>
    

画像表示サンプル

スタイルシートによるデザイン調整方法

　このままだと、あまりみやすいものではなく、また画像のサイズによって表示が崩れたりしてしまいます。そこで、スタイルシートを用いてデザインを調整します。

テキスト表示のスタイル調整

テキスト表示の場合以下のようなHTMLコードが返されます。

<ol class="ichi_lists">
  <li class="ichi_list">
    <span class="ichi_tweetcount">[ツイート数]</span>
    <a href="[記事URL]" class="ichi_title">[記事タイトル]</a>
    <span class="ichi_date">([投稿時間])</span>
  </li>
  :（表示数分繰り返し）
</ol>
    

上記のHTMLタグのclassを踏まえ以下のようにスタイルを指定します。(例)

<style type="text/css">
/*もちろんスタイルシートを指定しているファイルに記述してもOKです*/

/*ツイート数の表示スタイル*/
.ichi_list span.ichi_tweetcount{
    background-color:#e6e6fa;
    color:#4169e1;
    font-weight: bold;
    display:inline-block;
    width:45px;
    text-align:right;
    font-size:10px;
}
/*記事タイトルの表示スタイル*/
.ichi_list a.ichi_title {
    font-size:12px;
}
/*投稿時間の表示スタイル*/
.ichi_list span.ichi_date{
    font-size:10px;
}
</style>
    

テキスト表示サンプル

画像表示のスタイル調整

画像表示の場合以下のようなHTMLコードが返されます。

<div class="ichi_images">
  <div class="ichi_image">
    <span class="ichi_tweetcount">[ツイート数]</span>
    <a href="[記事URL]" class="ichi_anchor">
      <img class="ichi_file" src="[画像URL]" />
      <div class="ichi_title">[記事タイトル]
        <span class="ichi_date">([投稿時間])</span>
      </div>
    </a>
  </div>
  :（表示数分繰り返し）
</div>
<br style="clear: both;" />
    

上記のHTMLタグのclassを踏まえ以下のようにスタイルを指定します。(例)

<style type="text/css">
/*もちろんスタイルシートを指定しているファイルに記述してもOKです*/

/*画像表示枠の設定*/
div.ichi_image {
    position: relative;
    float:left; 
    border:1px solid #999; 
    overflow:hidden; 
    width:150px;  /*横幅ピクセル*/
    height:100px; /*縦幅ピクセル*/
    margin-right:5px; 
    padding:2px;
}
/*ツイート数の表示*/
div.ichi_image .ichi_tweetcount{
    position: absolute;
    right:2px;
    padding:2px;
    background-color:#4169e1;
    color:#e6e6fa;
    font-weight: bold;
    font-size:10px;
    z-index:5;
}
/*画像の表示*/
div.ichi_image img.ichi_file{ 
    width:150px; /*画像の横幅 画像表示枠にあわせる*/
    height:auto; /*画像の縦幅 autoにすると縦横比固定*/
    border:0;
}
/*画像下部のタイトル表示*/
div.ichi_image div.ichi_title{
    position: absolute;
    bottom:0;
    left:0;
    background:#000;
    font-size:10px;
    color:#fff;
    padding:0 3px;
    opacity:0.7;
}
/*投稿時間の表示*/
div.ichi_image span.ichi_date{
    display:none; /*文字表示が長くなるので表示しない*/
}
</style>
    

画像表示サンプル

その他オプション

その他以下のようなオプションがありますので必要に応じてご使用ください。

• max: 表示記事最大数値。常に+1の紹介記事が表示されるので注意（デフォルト: 5）
• enc: 文字エンコード。UTF-8 / SJIS / EUC-JP（デフォルト: UTF-8）
• noimg: 画像表示の際、画像がない場合に表示される画像URL（デフォルト: http://www.dvd-access.com/matome/img/no_image.png）

オプション使用例（最大表示10件、no image画像変更、文字エンコードSJIS）

<script type="text/javascript" src="http://www.dvd-access.com/matome/tool/parts.php?url=[ブログURL]&img=true&max=10&enc=SJIS&noimg=http://hogehoge.com/noimage.jpg"></script>