当ブログで作成したFC2専用スクリプトです。
複数カテゴリに対応した次ページ、前ページのリンクを表示できます。
JKL.ParseXML を使用して、非同期にRSSファイルからリストを取得します。
カテゴリ内の記事数が、RSSの最大記事数以下でないと正しく動作しません。
Firefox 3.6.3、IE7 で動作確認しています。
実際の動作は、当ブログでご確認ください。
テンプレートのバックアップを必ずとってから編集してください。
設置は自己責任でお願いします。
編集中テンプレートの確認方法は、以下のページが参考になります。
http://crazymoon.blog3.fc2.com/blog-entry-68.html
設置手順
１．下記URLより、jkl-parsexml-0.22.zip をダウンロードします。
http://www.kawa.net/works/js/jkl/parsexml.html
２．yaruo-pages.js をダウンロードします。（右クリックして「対象をファイルに保存」を実行してください）
yaruo-pages.js
３．jkl-parsexml-0.22 を解凍し、jkl-parsexml.js を「ファイルアップロード」でアップロードします。
４．yaruo-pages.js を「ファイルアップロードでアップロードします。
※アップロードしたファイルのアドレスは後で使用します。忘れないようにしてください。
５．テンプレートの <head> ～ </head> 内に、以下を貼りつけます。
各種設定パラメータは当ブログ用の記述のため、後で変更します。
------貼付け位置 この下の行から------
<script type="text/javascript" src="jkl-parsexml.js"></script>
<script type="text/javascript" src="yaruo-pages.js"></script>
<!--yaruo-pages ここから--->
<script type="text/javascript"><!--
var nextP= new Array;
var prevP= new Array;
<!--設定エリア ここから--->
//関連カテゴリ設定
var yrmcategoryGroup= new Array;
yrmcategoryGroup[0] = new Array('00'); //ダミー
<!--設定エリア ここまで--->
function yaruoPageDispInit(blogurl, categoryno, entryno){
<!--設定エリア ここから--->
//表示部ID設定
var objidGroup = new Array;
objidGroup[0] = entryno + ""; //記事一覧表示部ID
objidGroup[1] = 'yaru_page_p'; //前ページ表示部ID
objidGroup[2] = ''; //現ページ表示部ID（未使用）
objidGroup[3] = 'yaru_page_n'; //次ページ表示部ID
//現在表示中のカテゴリ・記事の表示設定
var currentlink = 1; // 0:リンク無し 1:リンクあり
var currenttype = 1; // 0:標準 1:太字<b> 2:斜字<i> 3:太字＆斜字
//記事一覧の形式
var listtype = '0'; //0:数字 d:黒丸 c:白丸 s:四角
<!--設定エリア ここまで--->
//パラメータ設定
var yaruopages = new YARUO.Pages();
yaruopages.param.blogurl = blogurl;
yaruopages.param.categoryno = categoryno;
yaruopages.param.entryno = entryno;
yaruopages.param.currentlink = currentlink;
yaruopages.param.currenttype = currenttype;
yaruopages.param.listtype = listtype;
yaruopages.param.categoryGroup = yrmcategoryGroup;
yaruopages.param.objidGroup = objidGroup;
return yaruopages;
}
function yaruoPageDisp(blogurl, categoryno, entryno){
//初期化
var yaruopages = yaruoPageDispInit(blogurl, categoryno, entryno);
//表示中のカテゴリ情報取得
var rssurl = yaruopages.geturl(0);
getRSS(yaruopages, rssurl, 0);
};
//リンクオブジェクト作成
function yaruogetanc(pageinf, param){
var a = document.createElement("a");
var title=pageinf[2];
if(title.length<1){
title=" ";
}
a.appendChild(document.createTextNode(title));
if(pageinf[3]==1) {
if(param.currentlink==1) {
a.href = pageinf[1];
}
if((param.currenttype==1) || (param.currenttype==3)){
a.style.fontWeight = 'bolder';
}
if((param.currenttype==2) || (param.currenttype==3)){
a.style.fontStyle = 'italic';
}
} else {
a.href = pageinf[1];
}
return a;
};
//取得処理メイン
function yaruoGetList(data, yaruopages, mode){
var entrylist = yaruopages.entrylist(data, mode);
if(mode==0) {
//記事一覧表示
var container = document.getElementById(yaruopages.param.objidGroup[0]);
var ol = document.createElement("ol");
for(i=0;i<entrylist.list.length;i++){
var li = document.createElement("li");
var a = yaruogetanc(entrylist.list[i], yaruopages.param);
li.appendChild(a);
ol.appendChild(li);
}
ol.style.listStyle=yaruopages.getlisttype();
container.appendChild(ol);
yaruodisp(yaruopages.param.objidGroup[0], container);
var pagedispflg=false;
//カテゴリ内で完結
if(entrylist.nextkbn==1){
//ページ表示
pagedispflg=true;
} else {
//前後のカテゴリ情報取得
yaruopages.param.nextkbn = entrylist.nextkbn;
yaruopages.param.pageprev = entrylist.pageprev;
yaruopages.param.pagethis = entrylist.pagethis;
yaruopages.param.pagenext = entrylist.pagenext;
yaruopages.param.categoryno = entrylist.nextcatno;
var rssurl = yaruopages.geturl(0);
getRSS(yaruopages, rssurl, 9);
}
} else {
//ページ表示
pagedispflg=true;
}
if(pagedispflg){
//前ページ表示
prevP = entrylist.pageprev;
var container = document.getElementById(yaruopages.param.objidGroup[1]);
if(container) {
if(entrylist.pageprev[1].length>0){
var a = yaruogetanc(entrylist.pageprev, yaruopages.param);
container.appendChild(a);
}
}
//次ページ表示
nextP = entrylist.pagenext;
var container = document.getElementById(yaruopages.param.objidGroup[3]);
if(container) {
if(entrylist.pagenext[1].length>0){
var a = yaruogetanc(entrylist.pagenext, yaruopages.param);
container.appendChild(a);
}
}
}
};
//画面出力
function yaruodisp(id, a){
if(0<id.length){
var container = document.getElementById(id);
if(container) {
container.removeChild(container.firstChild);
}
}
};
//RSS取得
function getRSS(yaruopages, rssurl, mode)
{
var xml = new JKL.ParseXML( rssurl );
xml.setOutputArrayElements(["item"]);
var func = function ( data ) {
yaruoGetList(data, yaruopages, mode);
}
xml.async( func );
xml.parse();
};
//--></script>
<!--yaruo-pages ここまで--->
------貼付け位置 この上の行まで------
６．各種パラメータを、設置するブログにあわせて変更します。
・アップロードファイルの変更
赤字の箇所を、実際にアップロードしたファイルのアドレスに書き換えます。
<script type="text/javascript" src="jkl-parsexml.js"></script>
<script type="text/javascript" src="yaruo-pages.js"></script>
・関連カテゴリ設定
長編作品等、記事が複数のカテゴリにまたがる場合に設定します。
ひとつのカテゴリ内で完結する場合、設定は不要です。
複数のカテゴリの設定は、以下の通りです。（当ブログの設定例です）
<!--設定エリア ここから--->
//関連カテゴリ設定
var yrmcategoryGroup= new Array;
yrmcategoryGroup[0] = new Array('00'); //ダミー
yrmcategoryGroup[1] = new Array('12', '114', '4', '5', '6', '7'); //小技
yrmcategoryGroup[2] = new Array('20', '27', '29'); //ブルー
yrmcategoryGroup[3] = new Array('36', '59', '82', '71'); //バベル
yrmcategoryGroup[4] = new Array('38', '41'); //ジアース
yrmcategoryGroup[5] = new Array('28', '37'); //エヴァ
yrmcategoryGroup[6] = new Array('46', '92'); //聖刻
yrmcategoryGroup[7] = new Array('62', '70', '77'); //ゼノギアス
yrmcategoryGroup[8] = new Array('53', '91'); //ハンターＭＭ２
yrmcategoryGroup[9] = new Array('45', '42', '44'); //パワポケ
yrmcategoryGroup[10] = new Array('81', '85', '93', '113'); //サクラ
yrmcategoryGroup[11] = new Array('9', '49', '109', '63'); //ロボ戦記
yrmcategoryGroup[12] = new Array('47', '66', '87', '88'); //鋼の巨人
yrmcategoryGroup[13] = new Array('31', '89'); //ジェットマン
yrmcategoryGroup[14] = new Array('10', '115'); //Gセイバー
<!--設定エリア ここまで--->
yrmcategoryGroup の後ろの [ ] の中は、半角数字を 1 から順に入れてください。
Array の後ろの ( ) の中は、カテゴリ番号を ' ' で括って、入れてください。
カテゴリ番号は、カテゴリページのURLの数字部分となります。
例）
カテゴリ名：やる夫がプラモを作るようです
カテゴリURL：http://yarumo.blog83.fc2.com/blog-category-12.html
カテゴリ番号：12
・表示部ID設定
前ページ、次ページを表示するエリアを指定します。
現在使用しているテンプレート内に、yaru_page_p、yaru_page_n という記述がなければ、
変更する必要はありません。
もし、既に使われている場合は、'' 内の単語を適当に変更してください。
//表示部ID設定
var objidGroup = new Array;
objidGroup[0] = entryno + ""; //記事一覧表示部ID
objidGroup[1] = 'yaru_page_p'; //前ページ表示部ID
objidGroup[2] = ''; //現ページ表示部ID（未使用）
objidGroup[3] = 'yaru_page_n'; //次ページ表示部ID
７．テンプレートに、前ページ、次ページを表示するエリアを記述します。
記事を表示いているエリアの一番下に置く場合、<!--/more--> の直前に、
以下を貼りつけてください。
※注意事項
６で、yaru_page_p、yaru_page_n の名称を変更している場合、
以下で使用している yaru_page_p、yaru_page_n の箇所に、変更した名称を記述してください。
※表示エリアを編集する際の注意点
前ページが表示されるエリアの記述箇所
<span id="yaru_page_n"> </span>
次ページが表示されるエリアの記述箇所
<span id="yaru_page_p"> </span>
前ページ、次ページを編集する処理<script type="text/javascript">以降の記述は、
上の二つの後に記載すること。
それ以外の記述は、ページに応じて自由に編集できます。
------貼付け位置 この下の行から------
<table class="pages">
<tr>
<td> </td>
<td align="center">NEXT</td>
<td rowspan="2"> </td>
<td align="center">PREV</td>
<td> </td>
</tr>
<tr>
<td align="center">««</td>
<td class="pages"><span id="yaru_page_n" class="pages"> </span></td>
<td class="pages"><span id="yaru_page_p" class="pages"> </span></td>
<td align="center"> »»</td>
</tr>
</table>
<script type="text/javascript"><!--
var yaruopages = yaruoPageDispInit('<%url>', '<%topentry_category_no>', '<%topentry_no>');
//前ページ表示
var container = document.getElementById(yaruopages.param.objidGroup[1]);
if(container) {
if(prevP[1]){
var a = yaruogetanc(prevP, yaruopages.param);
container.appendChild(a);
}
}
//次ページ表示
var container = document.getElementById(yaruopages.param.objidGroup[3]);
if(container) {
if(nextP[1]){
var a = yaruogetanc(nextP, yaruopages.param);
container.appendChild(a);
}
}
//--></script>
------貼付け位置 この上の行まで------
８．スタイルリスト編集欄に、以下の記述を貼りつけます。
７で表示形式を変更して、class="pages"を指定しなくなった場合は不要です。
------貼付け位置 この下の行から------
TABLE.pages {
width:100%;
empty-cells: hide;
}
TD.pages {
width:45%;
vertical-align:top;
background-color:#FFFFFF;
border: 1px solid gray;
padding: 10px 10px 10px 10px;
}
SPAN.pages {
}
------貼付け位置 この上の行まで------
９．その他
設置に関する質問等は、メールフォームか、掲示板でお願いします。
コメント欄は使用しないでください。
まとめ記事に対するコメントを優先したいため、当記事に対するコメントは基本的に削除します。
ご了承ください。
| NEXT | PREV | |||
| «« | »» |
| 2009/09/01 00:01 | おしらせ | COMMENT(0) | TRACKBACK(0) | PageTop | カテゴリ＆記事一覧 |
コメント
コメントの投稿