ライブラリー：夢実現のためのアファメーション

ちゃんと“フォーマット”してくれない！？

ところで、AS3.0（ActionScript3.0）でスクリプトを書くときに注意しなきゃいけないことが！！

つっても、別にスクリプトの記述方法とかじゃなくて、表題のとおり

「自動フォーマットは使うな」

ってことです。

コードを書きっ散らかしても、後で“ボタン一発できれいに成型！”ってことができる便利な「自動フォーマット」。

スクリプトの書き方（インデントとか）があまりうまくない僕は…いつもお世話になっております。ｗ

んが。
どうやら致命的なバグが。

それは、シンタックスチェックしてエラーがなくて、さらにプレビューしてもちゃんと動いてファイルに、「自動フォーマット」を適用したら、余計なところに中括弧（{}）を入れたり、変なところ（「{」のすぐ後ろとか）にセミコロン（;）を入れてしまったりして、コンパイルエラーになってしまうんです！（びっくり！！）

ウェブでいろいろ調べてみると、どうやら既知のバグらしく、結局、今まですっごく便利に使っていた「自動フォーマット」は、現状使わないほうがいいみたい。

うむぅ。「自動フォーマット」なのに…使えねぇ…。

参考サイト

• [AS3] ()を使った式が戻り値に指定された関数を[自動フォーマット]すると
• [AS3] if/else if/elseステートメントの[自動フォーマット]で余分な閉じ括弧}が入る
• [AS3] ifとカンマと配列と ー [自動フォーマット] vol.3

モテる人に共通すること。

「モテたい」…という言葉の裏側には、『モテない（からモテたい）』という前提が含まれているので、言葉に出さずに「オレはモテない」って自分に暗示をかけているようなものです。

ってことで、あえて実験してみましょう。

「オレはモテない」

さぁ、目を閉じて、感情を込めながら呪文のように唱え続けてみてください。

そうです…。ゆっくりと…言葉の意味を噛みしめながら…。

…ね。落ち込むでしょ？ｗ

意識・無意識に関わらず、冗談半分本気半分で「オレはモテない」なんて言っちゃってる人…いますぐにその口ぐせを封印しましょう。

顕在意識的にも、潜在意識的にも「モテない」なんて言っていたら、未来永劫モテるわけありません。
（まぁ、「モテたい」には前向きな気持ちもあるので、多少救いがありますが。）

逆に、どんなにブサイクでも、どんなにお金がなくても、どんなに…ダメ男（？）でも、女の子にモテる人は、

「モテたい」

なんて言葉は使いません。

たとえばそれは、すでにプロ野球の選手である人が、

「プロ野球選手になりたい」

とは言わないのと同じこと。

だって…もうすでにプロ野球選手なんだから、「～なりたい」なんていう必要はありませんからね。ｗ

…ヘリクツに聞こえますか？そうですか？

でも、そのヘリクツに今しばらくお付き合いください。（笑）

モテるが先か、それとも…？

「ニワトリが先か、卵が先か？」

みたいな話ですが、「モテない」という負のスパイラルから抜け出すには、どちらか一方を変えなければなりません。

つまり、

「モテるようになってから、『モテたい』と言わないようになる」

か、それとも、

「『モテたい』と言わないようにして、あとから本当にモテる」

か…。

あなたにとっては、どっちのほうが今すぐに実践できるでしょうか？

女の子にモテモテになるための究極の奥義。

ってことで、今までモテ男たちが秘密にしていた、けれどもバツグンの効果を発揮する、女の子にモテモテになるための究極の奥義を教えてあげます。

あまり知られると秘密じゃなくなっちゃうから、あなたはナイショにしておいてくださいね。ｗ

それは…

「モテたい」

と言わないことっ！

そして、アファメーション（肯定宣言）のルールにのっとって、肯定的に言い換えるならば、

「オレはモテる」

って、ニッコリと笑って、恥ずかしげもなくさらっと言うことでっす！
（たとえその時点で、実際にモテていなかったとしても。ｗ）

短い言葉だけど、いろんな含みがあって、自分と他人の潜在意識に影響を及ぼします。

いきなりモテることができないのであれば、せめて先に口ぐせのほうを変えてしまいましょうと。

えぇ。単純です。そして、あまりにも簡単すぎます。

でも…マジで効果大ですよ。

いいですか？

「オレはモテたい」

じゃないですよ。ほんの二文字違うだけだけど、効果は全く違います。

もし、そう言いたいなら、

「オレは“もっと”モテたい」

と言ってくださいね。

どんなときに使う？

さて。用法をいくつか。

たとえば、

女の子：「○○くんってさー、かなりオタクだよねー」

と、女の子からちょっと否定的なテンションで言われたとき。
今までだったらかなりダメージを受ける攻撃ですが、あなたは、うろたえずにこう続けるのです。

あなた：「そうかなー？」

女の子：「だって、ガンダムの話すると止まらないじゃん」

あなた：「あぁ、だってオレモテるから」

…まったく意味不明な返答に、女の子の頭はプチ思考停止状態。
（催眠などで使われる、“混乱法”というテクニックの応用です。）

※河村隆一ばりに斜に構えて、「ナルシスト魂」全開で言うと、はっきり言って気持ち悪いので注意。ｗ

それとか、こんな使い方もありです。

あなた：「ごはん、何食べようか？」

女の子：「何でもいいよー。決めて」

あなた：「じゃあ…焼肉かなー？」

女の子：「えー、なんで？」

あなた：「え？だってオレ…モテるから」

…。

かなりおバカだし、やっぱりまったく意味不明ですが…いいんです。
無理やりですが…いいってことにしてしまいましょう。（汗）

まぁ…別にこんな変な使い方をしなくても、今まで「モテたい」もしくは「モテない」と言っていた箇所を「モテる」と言い換える…つまり、否定的な口ぐせを肯定的に変えるだけでいいんです。

上の例には納得できないあなたでも、

「自己否定的な人間よりも、肯定的な人間のほうが人に好かれる」

↑これは納得できますよね？

だったら、もし「モテたい自分」におさらばして、これからはモテモテ人生を送りたい！と思うならば、騙されたと思って試してください。

だって…たとえ騙されたとしても何のリスクもないはずですからｗ

あなた：「で、偉そうに言ってるけど、お前はモテんのかよっ？」

…え？ぼくですか？？

いやー、高校生のころは全然モテなかったっすよ。（泣）

…。

……。

………オモローッ！（世界のナベアツより）

iepngfix.jsを使う場合、印刷のときに注意が必要。

中でも、いろいろ使い勝手がいいのでユンサンさんの「iepngfix.js」を使わせてもらってます。

背景に透過PNGを使う場合、ポジションを使うとレイアウトが崩れるとか、背景画像部分が100%透過してないとリンクが効かなくなる場合があるなど、注意しなきゃいけないことがいくつかあるけど、それでも使い勝手が良い。

んが。

IE6でページを印刷する場合は、ちょっと問題があるみたい。

iepngfix.jsを使って、あるセレクタにフィルターを適用すると、そのフィルターを適用した部分が真っ黒になって印刷されてしまうらしい。

じゃあ、プリント用のCSSを作って上書きすればいいのかというと、基本はOKなんだけどちょっと注意が必要。

例えば、PC用のCSSで

<link rel="stylesheet" href="default.css" type="text/css" media="screen,projection" />

#container {
text-align: left;
background: url(back.png) repeat-y center top;
width: 780px;
margin-right: auto;
margin-left: auto;
}
* html #container {
behavior: expression(IEPNGFIX.fix(this));
}

と定義して、#containerにフィルタを適用し、

media属性でprintを指定したCSSで、

<link rel="stylesheet" href="print.css" type="text/css" media="print" />

メニューやらなんやら、印刷には不必要な部分をdisplay:none;にして非表示にして、その分#containerの幅を小さくして

#container {
text-align: left;
background: url(none);
width:600px;
}

とすると、通常であれば印刷用のスタイルが上書きされて、背景が表示されないはずだけど…。

なぜかフィルターが適用されたままになってしまって、さらに透過PNGの透明部分が黒く表示されてしまうみたい。

うむむぅ…。

いろいろと属性を切り分けして試してみたけど、どうやらwidthを指定しているとダメみたい。

つまり、

#container {
text-align: left;
background: url(none);
}

たったそれだけのことみたいだけど、かなり引っかかったのでメモメモ。

※再現性があるかどうかは知りません。とりあえず自分が作ったサイトで問題になったので…一応ね。

「Google AJAX Feed API」を使って外部RSSを読み込む。

以前から気になってたんだけど、別段使う必然性がなかった「Google AJAX Feed API」。（公開されたのが去年の4月だから、今さら…な感じですんません。汗）

今回、諸事情によりいろいろ調べて実験してみたけど…うんちくをたれるまでもなくチョー簡単っすね！

Googleアカウントの取得。

何はともあれ、「Google Analytics」やら「AdWords」やら「Google Maps」やら、GoogleのAPIサービスを使うのであれば必須になるので、アカウントの取得ページでとりあえず取っておくと便利。

Google API Keyのサインアップ。

んでもって、アカウントを取得したら次は「Google API Key」のサインアップです。

…といっても別にすごく難しいことがあるわけでもなく、サインアップ用のページで、使用許諾（“I have read and agree with the terms and conditions”って書いてあるところ）にチェックを入れて、自分のサイトのURLを入力するだけ。

あとはJSを貼り付けるだけ。

そうするとAPI Keyが生成されて、あとはサンプルで表示されているサンプルコード（htmlとJavaScript）を、ページに貼り付けるだけです。

コードはこんな感じ。

<script type="text/javascript" src="http://www.google.com/jsapi?key=YOUR API KEY"></script>
<script type="text/javascript">
google.load("feeds", "1");

function initialize() {
var feed = new google.feeds.Feed("http://www.dokuritsu-kigyo.net/blog/index.xml");
feed.setNumEntries(7);//フィードの表示数の設定

feed.load(function(result) {
if (!result.error) {
var container = document.getElementById("feed");
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
var div = document.createElement("div");
div.appendChild(document.createTextNode(entry.title));
container.appendChild(div);
}
}
});
}
google.setOnLoadCallback(initialize);

</script>

（とりあえず、デフォルトでは4つしか表示されないfeedを、「feed.setNumEntries(7);」で表示数を7つに指定してみる。）

うえのコードの「YOUR API KEY」のところに、吐き出されたAPIを入れて、「new google.feeds.Feed();」のカッコ内に引っ張りたいRSSを指定すれば完了。

あとはhtml内に「feed」というidを持ったdiv（<div id="feed"></div>）を用意すれば、その中に読み込んだRSSを展開してくれる。

※このとき、IE6（だからなのか？）でAPI Keyを取得すると、サンプルコードの空白文字部分が「＆nbsp;」（“＆”は半角）で表示されてしまうので注意が必要。

「Google AJAX Feed API」の素晴らしいところは、RSSのバージョンやら仕様をAPIの中で吸収してくれてるので、ほとんどのRSSを読み込んでくれること。

なので、ブログに限らずRSSを吐き出しているサイトだったら、そのRSSのフィードを指定すれば簡単に表示できちゃいます。（パチパチッ！）

多少カスタマイズは必要。

サンプルで吐き出されるhtmlは、一行ごとにdivで表示するみたいなので、あんまり美しく（？）ない。

なので、表示や吐き出されるデータをカスタマイズするには、JavaScriptやCSSの部分をごにょごにょとカスタマイズしないといけません。

んが、そのへんはいろんな人が自分用（？）にカスタマイズしたJSを公開しているので参考にすれば大丈夫。

ちなみに、カスタマイズに必要なCSSやJSの仕様などはこちら。

なにはともあれ、別ドメインで既にブログを立てていて、後から会社の静的なページや、他のサイトに記事を読み込みたい…なんて方はすっごくラクチンなので、ぜひお試しを。

参考サイト

• 早速Google AJAX Feed APIを導入してみました
• 【ハウツー】Googleからの新たな贈り物、「Google AJAX Feed API」を試そう
• 「Google AJAX Feed API」の「FeedControl」でRSSリーダーに!?｜webnote
• Google AJAX Feed API
• Google AJAX Feed API - Developer Guide
• Google AJAX Feed API - Class Reference

一番最初は、cookieの中身が空っぽだから。

これは、外部JSを読み込むときに、「必ず」一番最初にcssのhref属性を、cookie内のfsizeと置き換えようとするため、fsizeの値がnullだと、もともと設定していたcss（medium.css）の部分が、空っぽなってしまうため。

うむぅ…。

…と思ったけど、解決法は意外と簡単。

条件分岐（if文）にてちゃちゃっと解決。

要は、fsizeがnullの時にも、強制的にhref属性の値を置き換えをしちゃうことが原因なので、

なので、外部JSの一番最初でcookieのfsizeを取得し、変数fsizeに代入。
（別に、同名である必要はない。hogeでも良い…っつか、混乱するから同名じゃないほうがいいのか？）

fsize=$.cookie('fsize');//cookie内のfsizeを取得

んで、条件分岐（if文）でfsizeがnullじゃなかったら、cssのhref属性の置き換えをするように指定。

if(fsize != null) {
$(function(){
$("#fontSizeControl").attr({href:dirPath+$.cookie('fsize')});
});
}

（※またまたブラウザのcookieを削除して、ver.6版↓にアクセス。）

jQueryでフォントサイズ変更＆クッキーの設定ver.6

これによって、一番最初にアクセスしても（cookieのfsizeが空っぽでも）、ちゃんとmedium.cssが効いて、フォントサイズMの状態で表示させることができるようになりました。（パチパチ）

さ。

次は相対パスの部分…誰かできましたか？（汗）

jQueryでcookieを簡単制御。

S・M・Lサイズのフォントサイズ用のCSSを用意して、それをJSにて切り替え。
そして、その情報をcookieに記録する…という、ありがちな（？）ヤツです。
（ありがち…とか言いながら、あんまりスクリプトとかプログラムに詳しくないので、実装するまで一人悶絶状態でしたが。汗）

んで、サンプルなどを作ってごにょごにょとして、いざ本サイトに実装したあとに、新たな事実が！

…なんて、

「衝撃の新事実！」

みたいに書いたけれど、別にたいしたことじゃないっす。（汗）

要は、最近何かと話題のAjaxのライブラリjQueryと、そのcookie制御用のプラグイン（？）を使うことで悶絶しながらやっと作った「フォント切り替え＆クッキー制御」が簡単に出来ることが判明。

ほんのちょっと悩んだ末、動きとしてはすでに完成してたんだけど、jQueryを使ったバージョンで最初からやり直すことに。
（お客さんに頼まれたわけでもなく…完全に自分の勉強のためです。ｗ）

JavaScriptのライブラリってすごいな。ｗ

結果は…これちょーいいっす！

やったことは…

jQueryをhtmlにリンクして読み込んで、さらにクッキー制御用のプラグイン（？）「jquery.cookie.js」を読み込む。

<script type="text/javascript" src="shared/js/jquery.js"></script>
<script type="text/javascript" src="shared/js/jquery.cookie.js"></script>

んで、フォントサイズ変更、及びクッキーを制御するために、以下のスクリプトを作成し外部JS化。

function fontSize(size){
cssPath="shared/css/"+size+".css";
cssurl=dirPath+cssPath;
$('#fontSizeControl').attr({href:cssurl});
$.cookie('fsize',cssPath,{expires:30,path:'/'});
}

こんだけです。

…jQueryってすげーっ！！

作ったスクリプト（fontSize(size);）でやってること自体はとってもシンプル。

引数「size」で渡された文字列を関数内でcssのパスと連結し、変数cssPathに代入。
んで、ページの階層が変わるとパスが変わるので、各htmlにて「dirPath」を定義し、それをガチャンコして変数cssurlに代入。
さらに、それを#fontSizeControlというidのついたhref属性の値に代入。

そして、その情報（cssのurl）をクッキーに「fsize」の値として代入して、30日間保存する…って感じです。

…と、こうやって文章で書いてもイマイチ良くわからないので、シンプルなサンプル（お、ラップみたい。）を作成。

jQueryでフォントサイズ変更＆クッキーの設定ver.5※追記07/12/04参照

※（「コントローラー」では、cookieに入れた内容を見るために、alertを出すようにしています。実際に使用する場合は、削除またはコメントアウトで。

なお、このサンプルを制作するために、以下のサイトを参考にしました。

• javascriptライブラリjQueryでcookieを超簡単に扱う方法 : 4GALAXYのメモ
• Cookie Plugin for jQuery

サンプルにある、コントローラー用に作った「規定値に戻す」スクリプトは、もっとスマートに書けるはず。（汗）

それはまた時間があるときに。（もしくは、誰かやっちゃってくださーい！ｗ）

追記：07/12/03

上記のサンプルのままでは、一番最初にアクセスしたとき、つまりcookieにfsizeが保存されていないときは、フォントサイズのcssが効かないことが判明。

（※試しにブラウザのcookieを削除してver.5版にアクセス。）

jQueryでフォントサイズ変更＆クッキーの設定ver.5

これは、外部JSを読み込むときに、「必ず」一番最初にcssのhref属性を、cookie内のfsizeと置き換えようとするため、fsizeの値がnullだと、もともと設定していた"medium.css"が、nullになってしまうため。

なので、外部JSの一番最初でcookieのfsizeを取得し、変数fsize（別にhogeでも良い）に代入。

fsize=$.cookie('fsize');

条件分岐で、fsizeがnullじゃなかったら、#fontSizeControlのhref属性を変更するようにしました。

if(fsize != null) {
$(function(){
$("#fontSizeControl").attr({href:dirPath+$.cookie('fsize')});
});
}

jQueryでフォントサイズ変更＆クッキーの設定ver.6（071204修正版）

これによって、一番最初はちゃんとmedium.cssが効いて、「フォントサイズM」の状態で表示させることができるようになりました。（パチパチ）

目が…笑っていない！？

最近（でもないけど）の研究では、人が本当に笑っているときと、作り笑いをしているときでは、明確に違いがあることが分かってきました。

それは…目です。

…って、そんなの昔からも言われてるじゃーんっ！
と思った方。

鋭いです。もう…学者並みに鋭いです。（褒めすぎですか？ｗ）

そう。

「目は口ほどにものを言う」
「目が笑っていない」

って言いますよね。要はアレです。

眼輪筋と笑顔の密接な関係。

より具体的には、眼の周りにある「眼輪筋」。
作り笑いをしたときは、この筋肉が動いていないことが多いんだそうです。

筋肉には運動神経によって自由に動かせる「随意筋」と、自律神経の制御下にあって自由には動かせない「不随意筋」があります。

さきほどの眼輪筋を含む「表情筋」は、そのどちらの性格もあわせもった特殊な筋肉なのです。
（顔の表情を作る筋肉は30種類以上。笑顔って意外と複雑。）

つまりこの眼輪筋、訓練しない限り感情を伴ったときにしか動かない。

なので、口角をきゅっとあげて笑顔を作るだけでは、いわゆる「目が笑っていない」状態になってしまうのです。
（もちろん、自分の気分を変えるときは、口角を上げるだけでも効果大ですよｗ）

「んじゃ、作り笑顔なんてすぐバレちゃうじゃん！」

…確かに。そのとおり。

おもしろくもない、楽しくもないのに「笑顔」だけを作っていたら、それはバレてしまいます。
あなただって、目の前の人が作り笑いをしていたらすぐにわかりますもんねｗ

けれども、本当の笑顔を“作る”ことができたら…。

バーバル・コミュニケーションとノンバーバル・コミュニケーション。

ところで、話は変わりますが、人は、バーバル（言語）コミュニケーションだけでなく、ノンバーバル…つまり非言語のコミュニケーションも無意識に使っている。

一説によると、このノンバーバル（非言語）・コミュニケーションは、全コミュニケーションの約90%を占めるとも言われている。

まぁ、実際の数値がどうなのかは、時と場合によって違うけれど、しぐさや目線、声のトーンなど、「言葉」以外が重要な役割を担っているのはなんとなく感覚的にみんな知っているんです。

例えば、目の前の人と話をしているときに、あなたがふと目線を右上にチラっともっていくと、相手はやっぱり気になって、その目線を追ってしまう。

また、誰かに対して何か悪いことをしてしまったとき、相手は口では

「いいよいいよ。別に気にしてないから」

と言っていても、やっぱり相手の不機嫌さがビンビンと伝わってくる…。

こんなことってありませんか？

逆に、

付き合っている彼氏や彼女が、ニッコリと笑いながらあなたに

「もう、だいっキライっ！」

と言ったとき、あなたはどう感じますか？

潜在意識に語りかける。

言語内容と、行動や雰囲気に整合性がとれないときに、人は後者を選択する場合が多いそうです。

先ほどの「だいっキライっ！」であれば、言葉の内容ではなく、ニッコリ笑った「表情」を正しいと選択し、結果として「愛されている」と感じるわけです。

もちろんこれは言語と行動がズレたときのことなので、そのズレがないこと…つまり、言葉と行動が同じであれば、より強力に相手にその気持ちが伝えることができるってことです。

コミュニケーションの達人への道。

コミュニケーションの達人たちは、知ってか知らずか、こういう潜在意識的なコミュニケーション手法を使いこなしていることが多い。

実際に、人を惹きつける人や、例えくだらない話でも、ついついその話に引き込まれてしまう…というような人を良く観察してみると、意外と上記のような行動をしているのに気づくはず。

人は、無意識（潜在意識）によって行動し、それを自ら選択した行動として捉える。

例えそれが外部の人が意図したことだったとしても、それに気づくことがなければ、それは“自らが下した決断”だと思うから。

人は、自分で出した答えや行動は、なかなか否定できない。
（認知的不協和）

ってことは…。

逆に、もし他人の無意識（潜在意識）をコントロールできるとしたら…。

…ぐへへっ。

…

……

………

なんて不埒なことを考えたあなたっ！

残念ながら、他人をコントロールすることなんてできませんよ。ｗ
（…正攻法では。）

そんなことを考えるくらいなら、まずは自分をコントロールできるように。

最強の「作り笑顔」の作り方。ｗ

あ、そうそう。

先ほどの「本当の笑顔」の作り方…知ってしまえば意外と簡単です。

おもしろくない、楽しくないと眼輪筋が動かずに、笑顔が引きつってしまします。

んじゃどうするか。

答えは…

「頭の中で、おもしろいことや楽しいことを考えながら相手と話す」

でっす！

目の前にいる人が、例えつまらない話をしていたり、おもしろくもないジョークを連発していたとしても、あなたの頭の中では、自分好みの「おもしろいこと」や「楽しいこと」でいっぱいにしてあげるのです。

さらに、その「おもしろいこと」に、目の前の人を絡めてみるのも効果的です。

例えば…

目の前の怒ってばかりいる部長に、イメージの中でハゲヅラをかぶせてみたり…。

人数あわせで呼ばれた乗り気じゃない合コンで、別の大好きな人のことを思い浮かべたり…。

自分自身をコントロールする方法。

「そ、それって『妄想』じゃ…。」

そうです。完全に妄想です。

けれども、目の前の人には気づかれません。

そして、そんなことを想像しながら相手の話を聞いていると…あなたは自然と笑顔になっているのに気づくはずです。

ただし、やりすぎは禁物。

なぜならば、まじめに聞かなきゃいけないときまで、ついつい笑ってしまう…なんてことになりますからね。ｗ

自分自身をコントロールする、潜在意識的アプローチ。

カンタンだけど効果絶大。

ぜひお試しあれっ！！

追記

ちなみに、あえて目を笑わせずに「作り笑顔」だと認識させて、“裏の意図”を相手に汲み取らせる…という高度（？）なテクニックもありますが、それはまた別の機会に。

定義リストのいくつかのサンプル。

通常、dtとddって一対一↓になってることが多いけど、そうじゃないといけないんすかね？
（サンプルのソースとかはけっこうそういう感じだよね。）

<dl>
<dt＞あああ</dt>
<dd＞あああの説明文</dd>
<dt＞いいい</dt>
<dd＞いいいの説明文</dd>
<dt＞ううう</dt>
<dd＞うううの説明文</dd>
</dl>

んで。

とりあえず疑問だったのが、ひとつのdtに対して複数のddってアリなのか？

たとえばこんな感じ。

<dl>
<dt>あああ</dt>
<dd>あああの説明文1</dd>
<dd>あああの説明文2</dd>
<dd>あああの説明文3</dd>
<dt>いいい<dt>
<dd>いいいの説明文1</dd>
<dd>いいいの説明文2</dd>
<dt>ううう<dt>
<dd>うううの説明文1</dd>
<dd>うううの説明文2</dd>
<dd>うううの説明文3</dd>
</dl>

また、ddの中になんかの要素…例えばul、liなんかを入れて良いのか…？

たとえばこんな↓感じ。

<dl>
<dt>はなもげら</dt>
<dd>
<ul>
<li>はなもげらに関連するテキスト1</li>
<li>はなもげらに関連するテキスト2</li>
<li>はなもげらに関連するテキスト3</li>
</ul>
</dd>
<dt>こまんたれぶー</dt>
<dd>
<ul>
<li>こまんたれぶーに関連するテキスト1</li>
<li>こまんたれぶーに関連するテキスト2</li>
</ul>
</dd>
<dt>ボンバヘッ！</dt>
<dd>
<ul>
<li>ボンバヘッ！に関連するテキスト1</li>
<li>ボンバヘッ！に関連するテキスト2</li>
<li>ボンバヘッ！に関連するテキスト3</li>
</ul>
</dd>
</dl>

結論としては…全部アリ！

んで。

いろんな人に聞いたり、さらに仕様書をチェックしたら…っつか、聞く前にチェックしろよって話ですが（汗）、上記のパターンは全部アリのようです。

W3Cの仕様によると、

W3C勧告私的日本語訳：10.3 定義リスト: DL、 DT、及びDD要素

となってました。

ちょっと注意が必要なのが、dt、dd各要素に含むことのできる要素について。

神崎さんのサイト

The web Kanzaki：リスト要素はブロックレベル

によると

「dtに含むことのできる要素はインライン要素に限られる。」
（つまり、単語やフレーズのみ。）

とあります。

逆に、ddにはインライン要素・ブロックレベル要素のどちらも含むことができるようなので、定義リスト（dl、dt、dd）を使うときは、その辺を気にしながら使うようにしよう。

まぁ、うんちくたれるほど知ってるわけじゃないので、あくまでも個人的な備忘録。
日々勉強っす。

押忍っ！！

テンプレートが壊れる！？

どうやらこの「自動保存」という機能、裏側で難しいこと（？）をしているようで、タイミングが悪いと手動で保存したときに…コケます。（汗）

保存できないぐらいならまだいいんだけど、それまで必死になって作ったテンプレートの一部分がごっそり消えてしまったり、または、管理画面のHTMLと一緒に（？）なってしまって（フィールドに管理画面のHTMLが入ってしまって）編集自体ができなくなってしまう不具合が何度かあった。

そうなるともうお手上げで、一度作ったテンプレートを削除して新たに作り直さない限り復旧は無理そう。

自動保存機能をオフにできればいいんだけど、Google先生に聞いてみたけど、現状はそれはできないみたい。...orz

ってことで、テンプレートを「手動保存（保存ボタンを押す）」するときは、まずテキストエディタとかにその内容をコピペしておいて、いつコケてもいいようにしておいたほうがいい。

…って、めんどくせーなー。

「時間」は平等。でも感じ方は違う。

本来、時間ってのは万人にとって平等なもの。
この世の中で、唯一平等に与えられたものかもしれない。

でも、その時間をどう感じるかは、僕ら“受け手”の感じ方に委ねられている。

ほら。
子供のときもあるでしょ？

フォークダンスのとき、好きな子といっしょに手をつないで踊った時間はほんの一瞬。

逆に、同じ曲なのに、人数調整のために女子列にまわされちゃった男の子と踊った時間が、どんなに長く感じられたことか…ｗ

それとか、例えば旅行。

前日まではその日が待ち遠しくて、一日一日がすっごく長く感じられて、まさに“指折り”その日を待っていたのに、旅行の最中はあまりにも楽しくて、密度が濃くて、充実していて、気づいたらもう最終日…みたいな。

「あともう一日！」
「もっとゆったりと過ごしたいっ！！」

ホントに時間の流れを速く感じる…あんな感覚…。

感情をともなった記憶は、「現実」に勝るとも劣らない。

でもね。

「一瞬」でも、ずっと胸に刻まれている記憶ってのは強い。

ふとした瞬間に、思い出したりすると、一瞬にして胸を焦がす。

常に青白くちろちろと燃えていた小さな炎が、その瞬間に酸素を取り入れて火の勢いを増すって感じで。

フォークダンスの女の子も、時間的には一瞬に感じられたとしても、感情の密度はほかの誰に対するものよりも濃いもんね。ｗ

旅行だってそう。

細かいディテールを思い出すと、感情や感覚がリアルに呼び起こされる。

目をつぶって、自分がその場にいたときのことを思い出し、そのとき触れたものに触れてみる。

例えば、ベランダの手すりや、頬をなでた風や、ホテルのふとんの質感、そのとき感じた身体の感覚なんかを、そのとき感じた感情といっしょに確かめてみる…。

耳をすまして、そのとき聞いた街の音や声に耳を傾けたり、目に焼きついた景色や顔や身体を、「記憶」と「感情」をフル活用して追体験してみる…。

…

……

………

…どう？

ただ「思い出す」よりも、ぐっとリアリティが増したんじゃない？

人の脳は「現実」と「リアルな想像」の区別がつかない。
なぜならば、どちらの情報も、同じ脳が処理しているから。

トランス状態における「時間歪曲」と「アソシエーション」。

ちなみに、催眠の技法のひとつに「時間歪曲」というものがある。

カウンセリングやセラピーでは、被験者や自分をトランス状態（変性意識状態）に誘導して、この時間歪曲を体験してもらう。

過去の苦痛やつらい思い出を短く短縮して、さらに俯瞰して見られるように…なんてときに、この時間歪曲を利用する。

また、楽しかった思い出や、もっともっと感じていたい事柄を、じっくりと体感するために時間を長く感じるようにしたり…。

辛かった1日を半日にしたり、1時間を10分にしたり、
また、1分を10分に感じたり、10分が1時間に感じたり…。

さらに、いい思い出であれば、「アソシエーション」という状態を利用する。

「アソシエーション」とは、思い描いているイメージの中で、より主観的に追体験するというようなこと。

簡単に言うと、映画をスクリーンで見たり、テレビ画面で見たりする（これは、逆にディソシエーションという状態）のではなく、自らが演者となって映画の世界を体感する…って感じかな。

トランス状態って、実は普通のことなんです。

…って、なんだかすごいことのように聞こえるけど、結局やってることは↑のフォークダンスや旅行の例と同じ。ｗ

トランス状態（変性意識状態）って、気づかないだけで、実は日常的に体感していることなんです。

つまり、それが自然に起こっているか、それとも他者（もしくは自分）が、言語や非言語を通して意図的に起こすか…っていう差があるだけ。

ってことで、今度また試してみようかな。ｗ

ちなみに、トランス誘導された状態って…すっごく気持ちいいんです。

ふわふわとして、何かとても大きなものに包まれているようで…。
（もちろん、人によって違います。）

ご希望の方がいたら、またいつか。

時間の流れを速く感じたってだけで、気づいたらプチ☆ヒプノセラピー講座に。（汗）

ついつい僕自身が“トランス状態”になってしまいました。ｗ

Spry framework for Ajaxを使ってみよう。

さて。

とはいえ、あまりに他力本願なのもどうかと思ったので、僕自身も、あのあといろいろと調べてみました。
（個人的にはどうしてもxmlで管理したいという願望もあったので。ｗ）

そしたら…ありました。
いい感じのJSライブラリが。

アドビが提供している「Spry framework for Ajax」というやつで、その中にxmlデータでコンテンツを管理するためのJSライブラリ群があります。
（サンプルにはすっごい高機能なPhoto Galleryのデモもありますが、まずはもっとシンプルなものを自分で作りたいなと。）

使用するのはJSライブラリのなかの「xpath.js」と「SpryData.js」のみ。

それと、以前自作した「controlimg.js」との組み合わせです。

実際のサンプルはこちら。

xmlでの外部管理がちょー簡単！

Spryを実装すると、HTMLの中で{hoge}という書式でxmlのノードを参照することができるようになります。
※各ノードの属性（attribute）を参照する場合は、{hoge/@attribute}と記述する。

また、repeatというSpry独自の属性（？）が使えるようになるので、あるデータを複製したり（例：ギャラリーのサムネール部分）、数を取得したりすることが容易になります。

Spryを使うために必要なのは、

名前空間の指定

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:spry="http://ns.adobe.com/spry">

と、

XMLデータセットの定義

var ds1=new Spry.Data.XMLDataSet("data.xml","pages/page");

あとは、xpath.jsとSpryData.jsを読み込む

<script type="text/javascript" src="shared/js/xpath.js"></script>
<script type="text/javascript" src="shared/js/SpryData.js"></script>

だけです。（使い方はちょー簡単！！）

今回のサンプルでは、

1. ページが表示されたときに、表示される画像の初期値を設定。
2. サムネールをxmlのノード分生成。
3. それぞれのサムネールをクリックすると実行されるJSに、idとcommentとstaffの引数を割り当て。

と、かなりシンプルなことをやってます。
（引数の渡し方とか、もっとスマートにできたら…今後の課題です。汗）

Spry自体は、XMLの読み込みに限らず、さまざまな機能を実装するためのJSがてんこ盛りです。
（正直、中がどうなってるのか理解するのは…が、がんばりやす。汗）

もちろん、ユーザー側でJavaScriptが有効でなければ利用できない、もしくはコンテンツ自体が表示されない可能性がある…というデメリットもありますが、サイトによっては導入を検討するのもアリかなと。

今回のギャラリーも、実際に使用するかどうかはまだ未定だけど、いい勉強＆サンプルができました。

※サンプルの圧縮データのダウンロードは、サンプルページの「データ一式のダウンロードはこちら」からダウンロードページに入り、「対象をファイルに保存」でダウンロードしてください。
（注意：使用、実験の際はご自身で画像を差し替えてくださいねー。）

なお、JSライブラリの内容に関してはまだまだ理解できていないので、各自リファレンスを参照してください。
（んで、僕にわかりやすく噛み砕いて教えてくらはい。ｗ）

Spry framework for Ajaxの日本語リファレンス

MovableType4（ムーバブルタイプ4）でも使えました。

結果は…

全然問題なく使えました！ｗ

そんなに複雑なことをしているわけではない（いや、プログラムだから実際すごいんだけど。）みたいなので、新しいバージョンになっても問題はないみたい。

なので、現状のMT3.3で作っているサイトのテンプレやらなんやらを、そのままMT4に移行しても問題がなさそうです。
（ということで、カスタマイズ方法は過去記事を参照。）

んが。

カテゴリーの並べ替えについては、「cutfirstchar.pl」の作者のH.Fujimoto氏がMT4専用のプラグインをすでに開発しています。（早っ！ｗ）

MT4専用版では、管理画面でカテゴリーの順番を入れ替えることができるので、MT4で新規にサイトを作る場合は、最初から新しいプラグインを使うほうがいいかも。

この新しいプラグインと、任意のカテゴリーの表示・非表示のプラグインの組み合わせができればかなり便利そうだなー。

こっちはまだ未実験なので、機会があるときに触ってみよっと。

追記：2007/09/13

…と、さっきは書いたけれど、cutfirstchar.plを使うとなると、MT4のテンプレートのいろんな部分を書き換えないといけないのでめんどくさい。

ってことで、さっそくMT4専用版を試してみた。

んで、結果は…。

これいいっ！

今までの苦労（？）がウソのようにカンタンにカテゴリーの並び替えができました。
（管理画面で並び替えができるので、操作も直感的。）

なので、ゼロからMT4で作るのであれば、MT4専用版をオススメします。

簡単ギャラリーからするする～っと移動まで…超カンタン！

Ajaxっぽいギャラリーを実現する「thickbox」（使い方はこの辺を参照）や、ページ内へのリンクへするする～っと移動するギミック、「btn」というクラスを設定するだけでロールオーバーが実現できる…など、大小さまざまな機能が盛り込まれた、すごく便利なJavaScriptライブラリになってます。
（以前だったら、それぞれを実現するには個別にがっつりスクリプトを書かなくちゃ実現できなかったもんね。）

まさに「今っぽいサイト」をカンタンに作ることができる優れものです。

かゆいところに手が届く機能もバッチリ。

さらに便利なのは、外部のサイトへのリンクのときは、自動的に新しいウィンドウを開いてそのサイトを展開してくれるところ。

通常、新しいウィンドウを開いてそこにページを表示する場合、aタグの属性に「target="_blank"」を指定しなければならない。

けれども、この「target属性」はxhtmlのバージョンによってはバリデーションに通らない。

そこでこの「yuga.js」を使うと、なにも指定しなくても、サイト内へのリンクは通常通りにページ遷移して、外部へのリンクのときのみ別ウィンドウを開く…なんてことができちゃうわけです！

うーむぅ…。まさに「優雅」だ。

今作ってるサイトでぜひ使わせてもらおう。

MovableType（ムーバブルタイプ）でリンクが効かない！？

…と、喜んでいたら、ひとつ問題が。

ページ内リンク（idを指定してそこに移動する）の場合、するする～っと移動する動きがあってすっごく心地いいんだけど、同じサイトの別ページに指定したidに飛ぶことができないらしい。

例えば、MovableType（ムーバブルタイプ）などのカテゴリーページから、個別エントリーのページの追記部分に飛ぶときに、デフォルトだと

<a href="category/hoge.html#more">続きを読む</a>

というふうに、urlの後ろに「#more」をくっつけて、そのページの該当idの部分に飛ぶようになっている。
けれども、これがうんともすんともいってくれないと。

「するする～」が効かないとかだけならいいんだけど、そうではなくてリンクが効かずにページ遷移できない状態。...orz

さらに、ドリームウィーバーのライブラリ機能を使ってサイトを作ってる場合、該当箇所は

<a href="index.html#hoge">ほげ</a>

となるので、自ページへのidにも飛べないという事態に。
うむぅー。これは困った。

でも、どうしても「yuga.js」を使いたい！優雅なウェブサイトを作りたいっ！！

ってことで、仕方がないので、とりあえず

dirPath="../";
//階層が変わるので、各htmlにて相対パスを記述

directUrl=dirPath+"category/index.html";
//飛び先のURLのパス

function jumpUrl(id){
location.href=directUrl+id;
}

というスクリプトを作って、呼び出し側のaタグは

<a href="../category/index.html#hoge" onclick="jumpUrl('#hoge');">カテゴリーのほげへ</a>
（いつか修正版ができたときにすぐに修正できるように、hrefは通常のリンクURLを指定。ｗ）

という感じにしてみました。（つまり、ふつーにジャンプするだけ。汗）

せっかくの優雅さが半減。（泣）

とりあえず「リンクが効かない」という最悪の状態は回避できたけど、せっかく「yuga.js」を使ってるのに優雅じゃなくなちゃってます。...orz

とっても残念な感じなので、勢いあまって中村さんに直接メールしてみました。
（忙しいだろうから、返事返ってくるかわかんないけど。）

しゅ、修正版ってできないのかな？
できればリリースして欲しいなー。（ザ☆願望ｗ）

追記：2007/09/11

メールを送ったら、さっそく中村さんからお返事きました！
（お忙しい中ありがとーございまっす！！）

こちら検証してみました。
原因はinterface.jsを使って実現している
ページ内リンクをアニメーションさせるスクリプトのようですね。
この機能を無効にすれば問題なく動作することを確認しました。

$("body").ScrollToAnchors(500);
         ↓
//$("body").ScrollToAnchors(500);

ということで、別ページへのidへのリンクは、yuga.js単体の場合、現状では「するする～」をあきらめるしかないということで。
（プラグイン内の実装部分なので、カスタマイズはすぐには難しいらしい。汗）

なので、とりあえず上記↑のような若干優雅じゃない方法で我慢することにしまっす。ｗ

追記：2008/03/18

現在、yuga.jsは「0.5.1」にこっそりとバージョンアップ。
利用できるjQueryも1.1xから1.2.xになってます。

さらに、これまで「するするスクロール」を実装するために利用していた「interface.js」がjQuery 1.2.xでうまく動作しないため、yuga.js 0.5.1では廃止。独自に実装したそうです。

参考記事

• あの優雅なウェブサイトを作るためのyuga.jsがこっそりと「0.5.1」にバージョンアップ！

xmlでデータを管理して、JSで切り替える方法。

なんかね。
今やってる仕事で、「ギャラリー」のページがあるですよ。

んで、現状は画像のネーミング（img1.jpgとか）を統一して、その画像のNo.と対応する配列にコメントを入れて、画像とコメントをJSで切り替える…みたいなことを。
（現状はこんな感じ。※画像＆コメントはサンプルです。）

でも、その画像やらコメントやらをxmlで外部管理して、それをjavascriptで切り替えたらいいんじゃね？

と、ちょっと思ったわけですよ。
（※単に写真のギャラリーを…というのであれば、lightBoxやThickBoxでいいんだけど、今回はそういう感じじゃないっす。）

別にお客さんに頼まれたわけじゃないので、完全に自己満足のために。

そしたら…。

…えぇ。ハマりました。

そもそも僕はプログラマーじゃなくて、フロント周りのクリエイターなわけで…（汗）
一介のウェブ屋には、難しいっす。
（まぁ、やっていて、うまくいくと楽しいんだけどね。ｗ）

っつことで、小一時間（実際には5時間程度）悩んだ末、いまだ未解決。...orz
（くっそーっ！）

でも、出来たら面白いだろうなー。

やりたいことは、

• ヘアスタイル画像の管理（本体＆サムネール）
• ヘアスタイルのタイトル
• ヘアスタイルに対するコメント
• ヘアスタイルを担当したスタッフ（複数人）

この辺をxmlデータで管理して、それを読み込んでhtml上に表示、サムネール画像をクリックすると動的に変更する…みたいなこと。

なんか、そういうライブラリとかないのかな？

たぶん、なんかありそう…。

誰か見つけたら教えてくらはい。
（時間がないので、実装するかどうかわかんないけど。）

追記：07/09/18

アドビのJSライブラリ「Spry framework for Ajax」を使って実装する方法を発見。
詳しくはこちら↓。

XMLでデータを管理して、それをJavaScriptで読み込む。（Spryにて解決）

ロリポではPerlのバージョンのバグがある。（再び。）

以前の記事で書いた、CSSが表示されちゃう件の回避方法も、バッチリ載ってます。
（「CSSが表示されちゃう件の回避方法」とは書いておらず、インストールの流れのなかでさらっと…。）

そもそもCSS（@import～）が丸見えになっちゃうのは、ロリポサーバのPerlのバージョンが5.8.0だから起こる現象（5.8.0には文字コードの扱いのバグがある）で、インストールマニュアルにそのことが書かれていないってことは…当分Perlのバージョンアップはないってことかも。（汗）

まぁ、すべてのサーバのPerlのバージョンをあげるってのは確かに大変なのかもしれないけど、ヘッダーモジュールの7行目、

<$MTInclude identifier="styles" trim_to="0"$>

を

<MTSetVarBlock name="__null__">
<$MTInclude identifier="styles" trim_to="0"$>
</MTSetVarBlock>

って書き換えるのは、Perlのバグがなければ本来必要のない作業なわけで、素人にはなぜそんなことをしなきゃいけないのかわからんちんです。...orz

そもそも、MTSetVarBlockで、htmlが吐き出されるときに該当部分（@import～）を消してるんだけど、あれって消しちゃってどっかに影響はでないんすかね？
（スタイルキャッチャー使用時とか。）

なんだか不安です。（教えて！エライ人！！byウゴウゴルーガ…古いですか？そうですか。）

なので、ロリポおじさん！

“適度なタイミング”（ｗ）で、Perlのバージョンアップをよろしくお願いしまっす！！

カテゴリーを任意の順番でソートする。

MovableType（ムーバブルタイプ）でカテゴリーを任意の順番で並べたい場合、いくつか方法がある。

例えば、MTCategoryDescriptionに日本語表記（ex.お知らせ）のカテゴリー名を入れて、MTCategoryLabelを数字を手前に持った英語名（ex.0010news）にして、使用する箇所を入れ替える方法。
メリットは、別段プラグインを入れなくても、テンプレートをいじるだけで出来てしまうのでお手軽。
デメリットは、それぞれのMTタグを本来の使い方とは違う使い方をするので、ちょっと気持ちが悪い。
（MTCategoryDescriptionは本来そのカテゴリーの説明文を表示させるためのもの。）

上記の気持ち悪さを回避するには、やはりプラグインを使うしかない。

有名なものでは、

• MovableTypeのカテゴリーソートに使える数字置換プラグイン（pm_headchanger.pl）
• カテゴリを任意の順番に並べ替える（cutfirstchar.pl）

って感じ。
どちらも、基本的にはカテゴリーの頭に数字をつけて、それによって順番を決め、プラグインの機能で頭の数字（または文字列）を置き換えたり削除したりする…という方法。

また、cutfirstchar.pl作者のH.Fujimoto氏は、いくつか別の方法でのソート用プラグインを作っている。

• カテゴリーの並べ替え・改良版
• カテゴリーとフォルダを並べ替えるプラグイン（MT4専用）

また、ちょっと変わった方法で、並べ替え用の定義ファイルを作って、

• カテゴリーを並べ替えるプラグイン（MTSubCategoriesタグ専用版）
• MTSubCategories を使ってカテゴリーを好きな順番に並べる

というのもあるみたい。

まぁ、どれも一長一短で、作るサイトや必要な機能によって、どの方法を取るかが変わってくる感じっすね。

後からプラグインを導入するのであれば、H.Fujimoto氏のカテゴリーの並べ替え・改良版がよさげなんだけど、今回は新規作成＆別のプラグインを使って、任意のカテゴリーを表示・非表示にするということをしたかったので、同じくH.Fujimoto氏のcutfirstchar.plを使うことに。

んで、何をやりたいかというと、

まずカテゴリーを任意の順番でソート。
これはカテゴリーに「001000お知らせ」「002000カリキュラム」などと、数字をつけて、これによってソートして、cutfirstchar.plによって手前の数字部分（6文字）を削除する。
具体的には、<MTCategoryLabel cutfirstchar="6">と属性を追加するだけ。（チョー簡単！）

んで、MT3.3はカテゴリーの出力ファイル名（ディレクトリ）を任意に指定できるので、それを「news」や「curriculum」と明示的に指定すればOK。

んで、次は、任意のカテゴリーを表示、または非表示にする。
これは、FilterCategoriesというプラグインで実現可能。
※特定のカテゴリーの「エントリーの表示・非表示」であれば、「category=""」という属性の「OR AND NOT」で対応できるみたいだけど、カテゴリーそのものを表示・非表示ができなかった（もしかしたら、やり方が間違っていたのかも。）ので、こちらのプラグインを使おうかと。

FilterCategoriesを入れると、<MTFilterCategories>タグが使えるようになり、特定のカテゴリーを表示したい場合「include="カテゴリ1|カテゴリ2"」と指定し、逆に特定のカテゴリーを非表示にしたい場合は「exclude="カテゴリ1|カテゴリ2"」とすればよい。
（複数指定する場合は、上記のように「|」で区切る。）
※H.Fjimoto氏の「カテゴリーの並べ替え・改良版」では、「数字|出力ファイル名|カテゴリー名」の区切りを、同じく「|」で区切るので、このプラグインの仕様とかぶってしまって使えないっぽい。

それぞれのリストタグに、任意のクラス名を自動でつけるには？

そもそも、MTをブログとして使用して、カテゴリー部分（メニュー）をテキストで作るのであれば、このふたつで十分OK。

けれども、今回はMTをCMSとして使って、さらにメニュー部分を、背景画像のリプレイス（text-indentする方法）して、見た目を変えたかったので、それぞれのリストにカテゴリーごとのクラス名を挿入する必要が。（SEO的には微妙らしいですけど。）

クラス名は、当然半角英数でなければならないので、MTCategoryLabelは日本語を含んでいるので使えない。
かといって、旧来のようにプラグインを使わない方法のときのように、MTCategoryDescriptionに英語を入れてクラス名に…というのは、やっぱり使い方としては間違っている（っつか、そうするんだったら、いちいちプラグイン使わないでタグの入れ替えだけでいいし。）ので、どうしよっかなーと。

最初はcutfirstchar.plを使って、<$MTCategoryArchiveLink$>で吐き出されたURL部分を削除しようかと思ったけど、そうするとカテゴリーのディレクトリを区切る「/」が後ろに残ってしまう。
（例：http://hoge.com/news/だったら、手前の「http://hoge.com/」は削除できるけど、残った文字は「news/」となり、不要な「/」が残ってしまう。）

うむぅ。

っと、小一時間悩んだところでMTのリファレンスを見たら一発で解決。

そもそも、3.3からは、カテゴリーの出力ファイル名（ディレクトリ）を指定することが出来るわけで、とうぜんそれを参照するタグってのもあったみたいです。（最初からリファレンスを見ればよかった。汗）

<MTSubCategoryPath>というもので、その名の通りカテゴリーのパス（というかディレクトリ名）を参照するためのものです。
この<MTSubCategoryPath>を、クラス名に指定すれば、それぞれのカテゴリーを表示するリストタグに、任意のクラス名を自動的に割り振ることができるようになりまっす！（いやー、楽チン楽チン。）

まとめとしては、

1. カテゴリー名を、「数字＋日本語カテゴリー名」で作成。
2. cutfirstchar="削除したい文字数">で、数字部分を削除。
3. MTFilterCategoriesのincludeまたはexcludeで、任意のカテゴリーの表示・非表示を指定。
4. cl