2004年01月14日 (水)
新プラグインを加えて完全版?うにょうにょ
Read More 提供開始(2/2)
前回のエントリで予告したプラグインと関連ファイルを私の
iDisk の Public
フォルダーにアップしました。今回はこれらを使ってうにょうにょ
Read More
を使えるようにするための説明をします。
iblogPatcher
が必要ですのでまずはこれをダウンロードしてインストールしてください。以下
iblogPatcher
が稼働する状態からの説明です。
ファイル群をダウンロードして所定のフォルダーに入れます。
下の表に従ってダウンロードしてください。ダウンロード元のリンクを CTL-クリック して [リンクをディスクにダウンロード] とか [リンクターゲットに名前を付けて保存...] とかをして保存します。格納先の "~" はローカルディスクのホームホルダーを表します。A フォルダーの下の B というファイルは "A/B" と表します。B がフォルダーの場合は "A/B/" と表します。URL と同じ表記法です。
iblogPatcher の Blog 定義ファイルを更新します。
Blog 定義ファイルとは iblogPatcher の中で sample というファイルからご自分の環境に合わせて変更したファイルです。README.txt では myblog.txt などとして説明しています。iblogPatcher 導入直後の状態に組み込む場合と、iblogPatcher 1.2.2 以降に公開されたプラグイン込みの場合として Blog「僕は見ていた 」の実例を記します。
導入直後からの更新
# $Id: sample,v 1.5 2003/11/30 02:35:41 okamura Exp $
%BLOG = (
# ローカルの blog プレビューディレクトリを指定してください。
'preview' => "$ENV{'HOME'}/Sites/iblog/B1234567890",
# 対応する blog の iDisk の公開ディレクトリを指定してください。
'publish' => '/Volumes/YourName/Sites/iblog',
);
%ACTION = (
'preview' => {
'before' => {
'onStart' => undef,
'file' => undef,
'onFinish' => undef,
},
'after' => {
'onStart' => undef,
'file' => sub {
VALID_XHTML::File(@_);
SJIS_BNAME::File(@_);
# ENTRIES_JS::File(@_);
ENTRYPAGE_ACTION::File(@_);
CATEGORYPAGE_ACTION::File(@_);
},
'onFinish' => sub {
VALID_XHTML::OnFinish(@_);
NOLF_FEED::OnFinish(@_);
SQUOT_CATNAME::OnFinish(@_);
SJIS_BNAME::OnFinish(@_);
# ENTRIES_JS::OnFinish(@_);
# system("cp -p '$ENV{'HOME'}/Library/Application Support/iblogPatcher/ListEntry.html' '$ENV{'HOME'}/Library/Application Support/iblogPatcher/ListEntry.js' '$ENV{'HOME'}/Library/Application Support/iblogPatcher/ValidateListEntry.js' '$_[0]'");
CATEGORYPAGE_ACTION::OnFinish(@_);
BLOGPAGE_ACTION::OnFinish(@_);
},
},
},
'publish' => {
'before' => {
'onStart' => undef,
'file' => undef,
'onFinish' => undef,
},
'after' => {
'onStart' => undef,
'file' => undef,
'onFinish' => ¥&UTF8_FEED::OnFinish,
},
},
);
以降のプラグイン込みからの更新
%BLOG = (
'preview' => "$ENV{'HOME'}/Sites/iblog/B557581052",
'publish' => '/Volumes/yuji_okamura/Sites/iblog/iSawIt',
);
%ACTION = (
'preview' => {
'before' => {
'onStart' => undef,
'file' => undef,
'onFinish' => undef,
},
'after' => {
'onStart' => undef,
'file' => sub {
# iBlog 内部処理による XHTML の間違いを補正する
VALID_XHTML::File(@_);
# 日本語のカテゴリ名や Blog 名、Blog の説明を可能にする
SJIS_BNAME::File(@_);
# 全エントリをリストアップした entries.js のデータを収集する
ENTRIES_JS::File(@_);
# ファイルのエンコーディングを UTF-8 にする
CHANGE_ENCODE::File(@_);
# エントリのデータを収集する
ENTRYPAGE_ACTION::File(@_);
# カテゴリのデータを収集する
CATEGORYPAGE_ACTION::File(@_);
},
'onFinish' => sub {
# iBlog 内部処理による XHTML の間違いを補正する
VALID_XHTML::OnFinish(@_);
# RSS Feed の item の title の中の改行を取り去る
NOLF_FEED::OnFinish(@_);
# シングルクォートをカテゴリ名や Blog 名で可能にする
SQUOT_CATNAME::OnFinish(@_);
# 日本語のカテゴリ名や Blog 名、Blog の説明を可能にする
SJIS_BNAME::OnFinish(@_);
# 全エントリをリストアップした entries.js ファイルを作成する
ENTRIES_JS::OnFinish(@_);
# entries.js 活用のための各種ファイルをコピーする
system("cp -p '$ENV{'HOME'}/Library/Application Support/iblogPatcher/ListEntry.html' '$_[0]/ListEntry.html'; cp -p '$ENV{'HOME'}/Library/Application Support/iblogPatcher/ListEntry.js' '$ENV{'HOME'}/Library/Application Support/iblogPatcher/ValidateListEntry.js' '$_[0]'");
# ファイルのエンコーディングを UTF-8 にする
CHANGE_ENCODE::OnFinish(@_);
# カテゴリの unyo.js を作成する
CATEGORYPAGE_ACTION::OnFinish(@_);
# ブロッグの unyo.js を作成する
BLOGPAGE_ACTION::OnFinish(@_);
},
},
},
'publish' => {
'before' => {
'onStart' => undef,
'file' => undef,
'onFinish' => undef,
},
'after' => {
'onStart' => undef,
'file' => undef,
'onFinish' => sub {
# RSS Feed のエンコードを UTF-8 にする
$CHANGE_ENCODE::Conf{'target'}->{'OnFinish'} = [
{
'name' => "rss.xml",
'type' => 'rss',
'toEncode' => 'UTF-8',
},
];
CHANGE_ENCODE::OnFinish(@_);
# Ping を自動送信する
$OPEN_FILES::Conf{'target'} = [
"$ENV{'HOME'}/Library/Application Support/iblogPatcher/iSawIt-PingBlogPeople.webloc",
"$ENV{'HOME'}/Library/Application Support/iblogPatcher/iSawIt-PingBulkfeeds.webloc",
];
OPEN_FILES::OnFinish(@_);
},
},
},
);
# ブロッグページのカテゴリイメージを 32x32 の大きさにする
$VALID_XHTML::Conf{'CategoryImage'}->{'width'} = 32;
$VALID_XHTML::Conf{'CategoryImage'}->{'height'} = 32;
1;
テンプレートファイルを編集します。
お使いのテンプレートセットの BlogPage.txt, CategoryPage.txt, EntryPage.txt の三つを編集します。
BlogPage.txt の編集内容
head 要素に unyo.js をロードする記述を入れます。
<head>
......
<script type="text/javascript" src="unyo.js"></script>
</head>
うにょうにょ Read More の表示のさせ方の設定をします。(オプション:詳しくは後述)
<head>
......
<script type="text/javascript" src="unyo.js"></script>
<script type="text/javascript">
ShowString = '続きを表示>>';
HideString = '<<続きを隠す';
HidePlace = 'bottom';
HideLineFeed = 1;
GotoEntryOnHide = 0;
</script>
</head>
エントリの先頭箇所にアンカーを入れます。これは「続きを隠す」ときにブラウザでの表示位置がエントリの先頭に戻るようにするためでもありますが、ブロッグページにあるエントリを拾い出すためにも必要です。スタイルシートがサポートされているブラウザではアンカーに入れた■は表示されません。アンカーの付け方は各自工夫してください。私はタイトル自体をエントリページへのリンクにすることで従来の Read More をなくすと同時にアンカーの中に何も書かないことで Another HTML-Lint などで減点されることがないようにしました。
<ForEachEntry>
<h2 class="date"><$EntryPostDate$></h2>
<div class="blogbody">
<h3 class="title"><$CategoryImage$><_ a id="<$EntryUUID$>" name="<$EntryUUID$>"><span style="display: none;">■</span></a> <$EntryTitle$></h3><br />
<$EntryAbstractOrBody$><br />
次に、うにょうにょ Read More を表示させるための JavaScript を埋め込みます。
<ForEachEntry>
<h2 class="date"><$EntryPostDate$></h2>
<div class="blogbody">
<h3 class="title"><$CategoryImage$><_ a id="<$EntryUUID$>" name="<$EntryUUID$>"><span style="display: none;">■</span></a> <$EntryTitle$></h3><br />
<$EntryAbstractOrBody$><br />
<script type="text/javascript">
WriteUnyo('<$EntryUUID$>');
</script>
CategoryPage.txt の編集内容
BlogPage.txt と全く同じように編集してください。
EntryPage.txt の編集内容
これは ENTRYPAGE_ACTION.plugin がエントリの情報を収集できるようにするための編集です。前回のこのプラグイン公開時には <$NavigationItems$> も収集するようになっていましたが、今回の同プラグインの設定ではこれは省きました。しかし前回のエントリを見て既に編集なさっている方は前回のままで問題ありません。
変更前
変更後
<$EntryAbstract$>
<!-- BEGIN EntryAbstract -->
<$EntryAbstract$>
<!-- END EntryAbstract -->
<$EntryBody$>
<!-- BEGIN EntryBody -->
<$EntryBody$>
<!-- END EntryBody -->
<$EntryPostDate$>
<!-- BEGIN EntryPostDate -->
<$EntryPostDate$>
<!-- END EntryPostDate -->
<$EntryTimestamp$>
<!-- BEGIN EntryTimestamp -->
<$EntryTimestamp$>
<!-- END EntryTimestamp -->
前回同様変更後の改行はあってもなくてもどちらでも構いません。
iBlog の Blog の [表示設定] で [blog の表示範囲] と [カテゴリの表示範囲] を [エントリの概要] に設定します。
iBlog で [Blog]-[プレビュー状態をリセット後、プレビュー] をします。
エントリが多い方はここでしばしの休憩です。
そのままプレビューすると ENTRYPAGE_ACTION.plugin が正しくエントリの情報を収集できません。必ずプレビュー状態をリセットしてください。
ブラウザでプレビューでの動作を確認して iBlog で公開します。
次に うにょうにょ
Read More
の表示設定について説明します。手順
3 の「BlogPage.txt
の編集内容」で
<script type="text/javascript">
ShowString = '続きを表示>>';
HideString = '<<続きを隠す';
HidePlace = 'bottom';
HideLineFeed = 1;
GotoEntryOnHide = 0;
</script>
と入れると書きました。この部分が設定している部分です。設定できるのはこの五つでそれぞれ次のような役割があります。
変数名
とり得る値
デフォルト値
役割
ShowString
JavaScript の文字列
a タグで囲むことができる XHTML コード
'Show content<<'
エントリの内容を表示するためのリンク文字列やイメージの記述を指定します。
HideString
JavaScript の文字列
a タグで囲むことができる XHTML コード
'>>Hide content'
エントリの内容を隠すためのリンク文字列やイメージの記述を指定します。
HidePlace
次の JavaScript の文字列のいずれか
'top'
'bottom'
'bottom'
エントリの内容を隠すためのリンクをエントリの内容の上に表示させる場合は 'top' を指定し、下に表示させる場合は 'bottom' を指定します。
HideLineFeed
真偽を表す値
1
エントリの内容を隠すためのリンクとエントリの内容の間に <br /> を挟むかどうかを指定します。
挟む場合は 1 や true を指定し、挟まない場合は 0 や false を指定します。
GotoEntryOnHide
真偽を表す値
1
エントリの内容を隠したときに、そのエントリの先頭にブラウザの表示位置を移動させるかどうかを指定します。
移動させるときは 1 や true を、移動させないときは 0 や false を指定します。
長いエントリを表示し、ブラウザをスクロールさせてからエントリの内容を隠した場合、直前まで見ていたエントリが上の方になってしまい、意味的に見ているポイントがジャンプしてしまいます。このため見ている人が今何が表示されているか混乱する可能性があります。これを防ぐための機能です。
しかし、この機能が有効になっていると現在のページの URL の後ろに #ENNNN というような付加的な指定がついてしまいます。このままブックマークをしたり BlogPeople に登録されるとこれまた、混乱の元です。この機能を無効にすることによって見ているページの URL を一定に保つことができます。
どちらのメリットを重視するかによって決めてください。
表に書いたように、これらの設定項目には全てデフォルト値が設けられています。ですから設定をしなくてもうにょうにょできますが、ShowString
と HideString
くらいは設定した方がよいでしょう。
ShowString
と HideString に img
タグを入れたい人がいると思います。例えば
ShowString = '<img src="showContent.gif" alt="続きを表示" />';
HideString = '<img src="hideContent.gif" alt="続きを隠す" />';
とすれば(多分)動作はします。JavaScript
としても全く正しいものです。しかし、これを
XHTML
の中に埋め込むのは間違いです。それはいくら
JavaScript
の文字列の中だからといっても
& や < や " や >
が入っているとブラウザが混乱する恐れがあるからです。
こういう場合は、例えば
unyoSetting.js
というファイルを作って設定内容をそこに書きます。そして
script タグの src
属性でそのファイルを指定して読み込むようにしてあげると
OK です。
Posted: 15:13
|
Comment
|
Trackback
Trackback Ping URL(U)
以下、類似エントリです。
JavaScript が有効でないと類似エントリは表示できません。
Quick Links
お知らせ
Blog コメント
個々のエントリに関するコメントでないことはこちらにコメントしてください。時々古い方から消していきます。予めご了承下さい。
カレンダー
カテゴリ
アーカイブ
月毎のエントリ一覧
旧サイト引継ぎ(抜粋)
JavaScript が有効でない場合は上の日付けによるアーカイブ を使用してください。
XML/RSS Feed
検索
最近のコメント
BlogPeople
任意のリンクサイトへジャンプ
JavaScript が有効なときのみリンクサイトからランダムに選ばれてジャンプします。リンクリストも JavaScript が有効でないと表示できません。
※最近更新の 24 サイトまで表示
JavaScript が有効でないとリンクサイトは表示できません。
.Mac Tips について
.Mac および .Mac 配布アプリケーションを利用するためのノウハウやツールを提供しているウェブログです。iBlog の諸問題を克服し様々な機能を追加するためのツール iblogPatcher とそのプラグインや iBlog のバックアッププログラム iBlogFreezer の開発と公開、.Mac カウンタなど .Mac 提供機能の流用&カスタマイズ方法の紹介などがメインコンテンツです。
各種検査結果
うっかりすると駄目になってしまいます。エラーが検出されたときは Blog コメントでお知らせください。
Service & Community
Statistics
Total entries in this blog:
Total entries in this category:
Published On: 2006-08-10 20:42
DotMac Counter: