navi: 色の種類 線の種類 ブログサイト一覧 ASPサイト一覧

『アフィリエイト情報』『HTMLタグ情報』『ブログカスタマイズ方法』『ジュゲム&ロリポブログ用テンプレート』



移転しました

このブログも削除はしませんので、何かの参考になれば幸いです。
これからの更新は、こちらのアフィリエイト日記にて・・・

スポンサーサイト:

一定期間更新がないため広告を表示しています

  - | | - | - │ 2007.01.08 Monday │
| △トップページへ |  ▲このページの先頭へ 

:

  | | | │ │
<< テンプレート爛魁璽辧辞瓩了箸な | △トップページへ | カテゴリーのスクリプト化 verジュゲム >>  ▲このページの先頭へ 

カテゴリーのリスト化:

ブログくん
『( ̄~ ̄;) ウーン
ブログのカテゴリーってたまに・・リスト化されてるのを見ますよね。
たとえば、このブログとか・・・( ̄∇+ ̄)vキラーン
※このブログのカテゴリーを見てくださいね。

そんな、カテゴリーのリスト化の方法を紹介します。』
ブログくん
『今から紹介する方法はジュゲムカスタマイズ講座さんの参照です。
難しい事は、いいから・・で、どうするの?って方は以下の手順です。

、スクリプト本体を記述します。</body>の直前(htmlテンプレートの最後の方ですよ。)に以下のようなJavaScriptを挿入します。
ではコピーして、貼り付けてください。



<script type="text/javascript">
<!--
function makeTreeElements (idName,objList) {
if (!objList.innerHTML) return;
var objLink = objList.getElementsByTagName('a')[0];
var linkUrl = objLink.getAttribute('href');
if (idName.indexOf('comment') > -1 || idName.indexOf('tb') > -1) {
var tmpText = objList.innerHTML.split("⇒");
tmpText[0] = tmpText[0].slice(0,tmpText[0].search(/<BR/i));
this.base = Array('<a href="',linkUrl,'">',tmpText[0],'</a>').join('');
this.elem = objLink.innerHTML;
} else if (idName.indexOf('entry') > -1) {
var tmpText = objList.innerHTML;
tmpText.match(/¥((¥d¥d¥/¥d¥d)¥)/);
this.base = Array('<strong>[',RegExp.$1,']</strong>').join('');
this.elem = Array('<a href="',linkUrl,'">',objLink.innerHTML,'</a>').join('');
} else if (idName.indexOf('link') > -1) {
var tmpText = objList.innerHTML;
if ( tmpText.match(/¥[(.+)¥](.+)/) ) {
this.base = Array('<strong>[',RegExp.$1,']</strong>').join('');
this.elem = Array('<a href="',linkUrl,'" target="_blank">',RegExp.$2,'</a>').join('');
}
} else if (idName.indexOf('category') > -1) {
var tmpText = objList.innerHTML;
if ( tmpText.match(/¥[(.+)¥](.+)/) ) {
this.base = Array('<strong>[',RegExp.$1,']</strong>').join('');
this.elem = Array('<a href="',linkUrl,'">',RegExp.$2).join('');
}
} else if (idName.indexOf('archive') > -1) {
var tmpText = objList.innerHTML;
tmpText.match(/¥((¥d+)¥)/);
var tmpCnt = Array(' (', RegExp.$1, ')').join('');
tmpText = objLink.innerHTML;
tmpText.match(/(.+) (¥d+)/);
this.base = Array('<strong>[',RegExp.$2,']</strong>').join('');
this.elem = Array('<a href="',linkUrl,'">',RegExp.$1,'</a>', tmpCnt).join('');

}
return this;
}
function createTreeList(idName,option) { // version 2.2
var objFocus = this.document.getElementById(idName);
if (!objFocus) return;
if (!objFocus.innerHTML) return;
var objLists = objFocus.getElementsByTagName('li');
var linkList = new Array();
var outText = new Array();
if (objLists.length > 0) {
for (i=0;i<objLists.length;i++) {
var chckFlag = true;
var elemText = new makeTreeElements(idName,objLists[i]);
if (!elemText.base || !elemText.elem) return;
for (j=0;j<linkList.length;j++) {
if ( linkList[j].base.indexOf(elemText.base) > -1 ) {
chckFlag = false;
linkList[j][linkList[j].length] = elemText.elem;
}
}
if (chckFlag) {
var tmpNum = linkList.length;
linkList[tmpNum] = new Array();
linkList[tmpNum][0] = elemText.elem;
linkList[tmpNum].base = elemText.base;
}
}
if (linkList.length > 0) {
outText[outText.length] = '<ul>¥n';
for (i=0;i<linkList.length;i++) {
outText[outText.length] = Array('<li>',linkList[i].base,option.top).join('');
if (linkList[i].length > 0 && option.sort) linkList[i].reverse();
for (j=0;j<linkList[i].length;j++) {
outText[outText.length] = (j == linkList[i].length - 1) ? option.end : option.list;
outText[outText.length] = Array(linkList[i][j],option.leef).join('');
}
outText[outText.length] = Array(option.btm,'</li>').join('');
}
outText[outText.length] = '</ul>¥n';
objFocus.innerHTML = outText.join('');
}
}
}
var gTreeOption = new Array;
gTreeOption['sort'] = false; /* ツリー内の表示順 true:並び替える false:そのまま */
gTreeOption['list'] = '├ '; /* ツリー用マーク(通常) */
gTreeOption['end'] = '└ '; /* ツリー用マーク(末端) */
gTreeOption['leef'] = '<br />¥n'; /* 各枝の末尾 */
gTreeOption['top'] = '<br />¥n'; /* ツリー本体の最初 */
gTreeOption['btm'] = ''; /* ツリー本体の最後 */
createTreeList('newentrylist',gTreeOption); // 最新エントリリストのツリー化
createTreeList('entrylist',gTreeOption); // エントリリストのツリー化
createTreeList('commentlist',gTreeOption); // 最新コメントリストのツリー化
createTreeList('tblist',gTreeOption); // 最新トラックバックリストのツリー化
createTreeList('linklist',gTreeOption); // リンクリストのツリー化
createTreeList('categorylist',gTreeOption); // カテゴリリストのツリー化
createTreeList('archivelist',gTreeOption); // アーカイブリストのツリー化
// -->
</script>



、各リストにidを付けます。ここからはテンプレートによって少し違いますよ。以下のタグは例です。必要な部分は。idの部分ですよ。


<!-- ▼ JUGEMの独自タグを使用しています。ロリポブログ場合はお使いのブログのタグと置き換えてください。 -->
<!-- BEGIN calendar -->
<div class="linktitle"><a href="./?month={calendar_prev_yearmonth}" title="前月">▼</a> {calendar_str_yearmonth} <a href="./?month={calendar_next_yearmonth}" title="次月">▲</a></div>
<div class="calendar">{calendar_only}</div>
<!-- END calendar -->
<!-- ▲ JUGEMの独自タグを使用しています。ロリポブログ場合はお使いのブログのタグと置き換えてください。 -->


<!-- search -->
<div class="linktitle" id="searchname">SEARCH</div>
<div class="linktext" id="searchlist">
<form method="get" action="" class="search_form">
<input id="search" name="search" size="20" style="width:140px" class="form" />
<input type="submit" value="?" class="button2" />
</form>
</div>
<!-- /search/ -->

<!-- BEGIN latest_entry -->
<div class="linktitle" id="entryname">ENTRIES</div>
<div class="linktext" id="entrylist">{latest_entry_list}</div>
<!-- END latest_entry -->

<!-- BEGIN category -->
<div class="linktitle" id="categoryname">CATEGORIES</div>
<div class="linktext" id="categorylist">{category_list}</div>
<!-- END category -->


<!-- BEGIN link -->
<div class="linktitle" id="linkname">LINKS</div>
<div class="linktext" id="linklist">{link_list}</div>
<!-- END link -->


<!-- BEGIN profile -->
<div class="linktitle" id="profilename">PROFILE</div>
<div class="linktext" id="profilelist">{user_list}</div>
<!-- END profile -->

<!-- BEGIN archives -->
<div class="linktitle" id="archivename">ARCHIVES</div>
<div class="linktext" id="archivelist">{archives_list}</div>
<!-- END archives -->


<!-- BEGIN recent_comment -->
<div class="linktitle" id="commentname">COMMENTS</div>
<div class="linktext" id="commentlist">{recent_comment_list}</div>
<!-- END recent_comment -->

<!-- BEGIN recent_trackback -->
<div class="linktitle" id="tbname">TRACKBACK</div>
<div class="linktext" id="tblist">{recent_trackback_list}</div>
<!-- END recent_trackback -->


<div class="linktitle" id="reconame">RECOMMEND</div>
<!-- BEGIN amazon -->
<div class="linktext" id="recolist">{amazon_item}</div>
<!-- END amazon -->

<!-- フリースペース -->
<!-- BEGIN freespace1 -->
<div class="linktitle" id="fs1name">{freespace_title1}</div>
<div class="linktext" id="fs1list">{freespace_contents1}</div>
<!-- END freespace1 -->

<!-- BEGIN freespace2 -->
<div class="linktitle" id="fs2name">{freespace_title2}</div>
<div class="linktext" id="fs2list">{freespace_contents2}</div>
<!-- END freespace2 -->

<!-- BEGIN freespace3 -->
<div class="linktitle" id="fs3name">{freespace_title3}</div>
<div class="linktext" id="fs3list">{freespace_contents3}</div>
<!-- END freespace3 -->

<!-- BEGIN freespace4 -->
<div class="linktitle" id="fs4name">{freespace_title4}</div>
<div class="linktext" id="fs4list">{freespace_contents4}</div>
<!-- END freespace4 -->

<!-- BEGIN freespace5 -->
<div class="linktitle" id="fs5name">{freespace_title5}</div>
<div class="linktext" id="fs5list">{freespace_contents5}</div>
<!-- END freespace5 -->
<!-- /フリースペース/ -->



、完了( ̄‥ ̄)=3 フン

と、手順は二つですね・・・更新が出来たら確認してみてください。

( ̄0 ̄;アッ

手順が完了したら

この分類分けの使用法は、
下の画像のようにカテゴリーを分けてください。
分類を [ ] で囲う様にしてその分類に入るカテゴリーの文頭に付ける感じです。』


  [カスタマイズ] ブログくんの話 | 12:27 | comments(0) | - │ 2006.04.24 Monday │
| △トップページへ |  ▲このページの先頭へ 

スポンサーサイト:

  - | 12:27 | - | - │ 2007.01.08 Monday │
| △トップページへ |  ▲このページの先頭へ 
コメント
コメントする










LinkShare(リンクシェア)
リンクシュアは報酬の最低支払額などがなく、一円からでも報酬の受け取りがあり便利です。また、提携サイトに大手企業が多いです。
一番のオススメです! 
A8.net
提携先サイト数がNo1?とのほど、提携サイトが多く必ず登録して置きたいサイトの一つです。
オススメです! 
バリューコマース
A8netと同じぐらいの提携先企業をもち、そして、YAHOOショッピングのアフィリエイトはココでしか登録できません。
AccessTrade
うれしい報酬振込み手数料無料のサービスや他にはない珍しい提携先企業も魅力なAPSです。
電脳卸
報酬額(%)が一番いいAPSです。
Amazon.co.jp アソシエイト
書籍通販最大手のアマゾンが独自に行うアフィリエイトです。
Google AdSense
アドセンスは成果報酬は無くクリック報酬のみですが、リンクの張替え等の必要も無くとても便利です。