> >

完全 JavaScript オンリーの UnderDone さん方式のうにょうにょ Read More を入れました。この Blog ではなくこっちです。入れるにあたって、.Mac Tips というかその実験場としての「僕は見ていた」のポリシーに従って手を入れたのでその紹介です。

で、どういうポリシーかと言うと

できる限り Valid でそしてアクセシビリティ指針に適合したサイトにする

というポリシーです。.Mac Tips と違って内容に一切ポリシーを持たない反面、形式にこだわっているわけです。とはいえまだまだ道半ばで、特に iBlog の GUI を使って設定するボールドとかのインライン要素の物理的スタイル指定タグや、イメージのタグに付かない alt 属性などに対応しきっていないので偉そうなこと言えません。

【うにょうにょ本体の JavaScript 関数】
まず、これを XHTML 埋め込みから外部 JavaScript ファイルにしました。その理由は条件判断のところに & や < が入ってくるのですが、これらの文字は XHTML の特殊文字ですから直接入れないほうがよいからです。HTML の場合 JavaScript コードは <!-- --> で囲ってコメントにしてしまう選択肢がありますが、XHTML ではコメントは本当にコメントになってしまいます。< " > & が入る JavaScript コードは外部 JavaScript ファイルとした方が安全です。

外部 JavaScript ファイルにするにあたって、私のコーディングスタイルに合わせてしまったのでオリジナルと互換性がなくなっています。以下を実施される方はその JavaScript ファイルをダウンロードして使用してください。

【テンプレートの内容】
上の外部ファイル化に伴い、head 要素の中(一番最後が無難)に次を入れます。

<script type="text/javascript" src="<$BlogBaseURL$>ToggleEntryBody.js"></script>

そして、iBlog オリジナルのテンプレートで

<$EntryAbstractOrBody$> <br />

となっていた箇所は BlogPage.txt では次のようにします。

<div id="<$EntryUUID$>">
    <$EntryAbstractOrBody$>
</div>
<div id="Hide_<$EntryUUID$>" style="display: none;">
    <_a href="<$EntryCategoryUUID$>/<$EntryUUID$>/index.html" onclick="return !ToggleEntryBody('<$EntryUUID$>');" onkeypress="return !ToggleEntryBody('<$EntryUUID$>');">&lt;&lt;<span style="display: none;"><$EntryUUID$>の</span>続きを隠す</a>
</div>
<div id="Show_<$EntryUUID$>" style="display: block;">
    <_a href="<$EntryCategoryUUID$>/<$EntryUUID$>/index.html" onclick="return !ToggleEntryBody('<$EntryUUID$>');" onkeypress="return !ToggleEntryBody('<$EntryUUID$>');"><span style="display: none;"><$EntryUUID$>の</span>続きを表示&gt;&gt;</a>
</div>
<script type="text/javascript">
    ToggleEntryBody('<$EntryUUID$>');
</script>

CategoryPage.txt では次のようにします。

<div id="<$EntryUUID$>">
    <$EntryAbstractOrBody$>
</div>
<div id="Hide_<$EntryUUID$>" style="display: none;">
    <_a href="<$EntryUUID$>/index.html" onclick="return !ToggleEntryBody('<$EntryUUID$>');" onkeypress="return !ToggleEntryBody('<$EntryUUID$>');">&lt;&lt;<span style="display: none;"><$EntryUUID$>の</span>続きを隠す</a>
</div>
<div id="Show_<$EntryUUID$>" style="display: block;">
    <_a href="<$EntryUUID$>/index.html" onclick="return !ToggleEntryBody('<$EntryUUID$>');" onkeypress="return !ToggleEntryBody('<$EntryUUID$>');"><span style="display: none;"><$EntryUUID$>の</span>続きを表示&gt;&gt;</a>
</div>
<script type="text/javascript">
    ToggleEntryBody('<$EntryUUID$>');
</script>

エントリの本文がブロッグページに入ってきてしまったのでトップが Another HTML-Lint で完全無欠の 100 点だったのが減点されてしまい、iBlog が吐く未解消の Invalid な XHTML コードが露呈してしまいました。悔しいので HaloScan のコメントへのリンクをアクセシビリティ指針に合わせました。これについては後で紹介エントリを書きます。また、iBlog が吐く未解消の Invalid な XHTML コードにも手を打って紹介エントリを書くつもりです。

Trackback Ping URL(U)