RSSリスティング

RSSリスティング

RSSリスティングのコードを作成する

コードの作成は簡単で無料です。コード発行ページからスタート

1.ブログのURLを入力

STEP1. 更新一覧を表示したい元のブログのURLを入力(例:http://ameblo.jp/blog/)

2.表示をカスタマイズ

STEP2. RSSリスティングのデザインをカスタマイズしてください。

3.ソースコードをコピー&ペースト

STEP3. ソースコードをホームページ(更新を表示したい)の任意の場所にコピー&ペースト

RSSリスティングの高度なカスタマイズ

HTMLソースコードを編集できる中級者向けの機能です(これらの設定はオプションです。)

リンク先を新しいウインドウで開く

RSSリスティングHTMLコードに「target」」を設定するとリンクのブラウザターゲットを指定できます。例えば、新しいウインドウで開きたい場合はHTMLソースに下記を追加します。デフォルト(無指定)で target=_topが指定されています。ターゲット名には任意の名前を入れることもできます。→使用例

&target=_blank

リンク先に nofollow属性を設定する

RSSリスティングHTMLコードに「nofollow」を設定するとリスティングのリンクAタグすべてに「 rel="nofollow"」が設定されます。(デフォルトでなしです)※このオプションはSEOやリンク数コントロールの目的で利用する中級者向け以上のオプションです。

&rel=nofollow

リンクタイトルにはてなブックマーク登録数を表示

RSSリスティングHTMLコードに「sbm」を設定するとリンクタイトルに はてなブックマーク の登録数を表示できます。(デフォルト(無指定)で非表示です)登録数がない場合は表示されません。→使用例

&Sbm=_true

RSSリスティングコードのHTMLマークアップ

RSSリスティングはRSSリストを表示される『JavaScript』とカラーとデザインを決定する『CSS』から構成されます。手動でデザインをカスタマイズする場合は下記を参考にしてください。

<div class="rsstc">
<em>表示リストのタイトル</em>
</div>

<div class="rsstc">
<ul>
<li><a href="URL1" target="_top">記事見出し1</a></li>
<li><a href="URL2" target="_top">記事見出し2</a></li>
<li><a href="URL3" target="_top">記事見出し3</a></li>
<li><a href="URL4" target="_top">記事見出し4</a></li>
</ul>
</div>

CSS(スタイルシート)の基本形

RSSリスティング用カスタムCSS作成ツールからcssコードをウェブ上で簡単に作成できます。

.rsstc   { 全体的な設定 }
.rsstc a { リンク要素のカラー;}
.rsstc em  { タイトル部分 }
.rsstc ul   { 記事リストの全体要素 }
.rsstc li   { 記事リストの個別要素 }

[中級者向け] RSSリスティングを高速表示する(非同期)

非同期モードではRSSリスティングをウェブページ表示後に読み込み表示場所に挿入します(非同期)。非同期の場合はRSSリスティングのコードを二箇所に設定する必要があります。