TopMovable Type > バージョン別 > 3.0D > 2004年8月
2004年8月31日

QRコード設定

August 31,2004 1:38 AM
Tag:[]
Permalink

QRcodeMagic WhiteさんのQRコードつけてみた。経由のurl2QRcodeで生成したQRコードをサイドメニューにつけました。QRコードにはblogの携帯用URLを変換したものが設定されています。そしてこの画面に表示されたQRコードを携帯で認識させればURLをわざわざキーで打ち込まなくても携帯用のサイトにいくことができます。使用頻度は明らかに低いと思いますがQRコードの幾何学的デザインが気に入っているので。
本当はMTQRcodeをつけてみたいのですがWindows自宅サーバ者にはかなりハードル高そうでとりあえず変換した画像を貼り付けてます。

で、「これつけても読み込めないしなー」と思っていましたが、先日購入した携帯に「バーコードリーダ」というのがあり、起動すると真四角の枠が出たので試しにQRコードを認識させたところ、見事読み込めました(マニュアル読んでない)。
Magic WhiteさんのQRcodeも正常に読み込めました。

Comments [6] | Trackbacks [3]
2004年8月29日

カレンダーの文字サイズ修正

August 29,2004 12:45 AM
Tag:[]
Permalink

公開中のスタイルシートですが、カレンダーのリンク以外の日付の文字サイズが設定されていませんでした。設定されてないとエントリーされていない日の文字サイズが大きく表示されてしまう不具合が発生する場合があります。
現在テンプレートをご利用頂いている方は下記のスクリプトを styles-site.css の .calendar の下辺りに追加することで不具合は解消します。

.calendar td {
    font-size:9px;
}

なお公開版の方は修正済です。ご迷惑おかけして申し訳ございませんがよろしくお願い致します。

Comments [4] | Trackbacks [0]
2004年8月27日

コメントスパム対策(その2)

August 27,2004 1:00 AM
Tag:[]
Permalink

半角英数のみのコメントをエラーとする対処にしていましたが、本文に「オンラインカジノ」と書かれたコメントスパムを3件頂きました(削除済)。
という訳で現在新たな対処を盛り込んでいます。不具合等ございましたらお許しください。

Comments [0] | Trackbacks [0]
2004年8月24日

サイドメニュー折りたたみ(改)

August 24,2004 11:55 PM
Tag:[]
Permalink

2004.12.06 追記
サイドメニュー折りたたみのエントリーを書き直しましたので

サイドメニュー折りたたみスクリプト(cookie等改善版)

を参照ください。


我楽さんのサイトにあるサイドメニューの折りたたみが気に入り、あらかたできたので、ぼちぼちエントリー追加。経由で

JUGEMカスタマイズ講座ナビゲーションの折り畳み

に随分前から取りかかってましたがようやく陽の目を見ることになりました。苦労した点はあとで書くとして、とりあえずメモ。
なお関連記事もございますのでよろしければ後ほど参照ください。

この機能は文字のごとくサイドメニューの折りたたみです。メニューのタイトル部分は常時表示で、タイトル横にある[+]/[-]でメニューリストの表示・非表示を切り替えられます。またメニュー単位に表示・非表示の初期状態を設定できます。
私の場合はリストが長いものに折りたたみをつけ、さらに利用度が低いと思われる「Monthly Archives」と「Recent Entries」を折りたたんだ状態にしてみました。またメニューのリスト合計数をタイトル横に表示できます。そのままの流用では正常に表示されませんでしたが若干のスクリプト修正で有効になりました。以下設定方法です。

1.テンプレートのサイドメニューにid属性を付与
下記の要領で折りたたみたいサイドメニューのタイトルに「id=xxname」、リストの方に「id=xxlist」を付与します。"name"と"list"は固定、"xx"の部分はメニュー毎に異なる名称を付与します(例えばカテゴリーリストは"category"、エントリーは"entry"等)。

<div class="sidetitle">
Categories
</div>
 
<div class="side">
<MTCategories>
<a href="<$MTCategoryArchiveLink$>">
<$MTCategoryLabel$></a>  [<$MTCategoryCount$>]<br />
</MTCategories>
</div>
<div class="sidetitle" id="categoryname">
Categories
</div>
 
<div class="side" id="categorylist">
<MTCategories>
<a href="<$MTCategoryArchiveLink$>">
<$MTCategoryLabel$></a>  [<$MTCategoryCount$>]<br />
</MTCategories>
</div>

2.JavaScriptファイルの作成
下記の内容を丸ごとコピーして"menufolder.js"という名前のファイルを作成します。作成したファイルはここではmt.cgiが配置されているディレクトリに配置することにします。赤および青字はオリジナルのスクリプトとの差分を示しています。
オリジナルではスクリプトをテンプレートに直接記述されていますが、他のテンプレートで同機能を持ちまわることを考え、ここでは独立したファイルにしてみました。注:ファイルの文字コードはBlogの文字コードと一致させてください。またMac+IEの場合は、後述の「テンプレートにJavaScriptファイル読み込みの設定」で示された位置に、本スクリプトを直接埋め込むようにしてください(jsファイルを正常に読み込めない報告を頂いております)。

function InitFoldNavi() {
  FoldNavigation('newentry','off',false); // new entry
  FoldNavigation('entry'   ,'on' ,true);  // entry
  FoldNavigation('comment' ,'on' ,false); // comment
  FoldNavigation('tb'      ,'on' ,false); // trackback
  FoldNavigation('archive' ,'off',true);  // archive
  FoldNavigation('link'    ,'on' ,true);  // link
  FoldNavigation('profile' ,'off',false); // profile
}
function FoldNavigation(idName,initMode,viewNum) {
  var openMark = '[+]'; // open mark
  var closeMark = '[?]'; // close mark
  var preMark = true; // position of mark
  var idTitle = Array(idName,'name').join('');
  var idList = Array(idName,'list').join('');
  var objTitle = this.document.getElementById(idTitle);
  var objLists = this.document.getElementById(idList);
  if (!objTitle || !objLists) return;
  var dispMode = objLists.style.display;
  if (!dispMode) {
    var tmpText = Array('FoldNavigation(',"'",idName,"','chng','');return(false);").join('');
    var insMark = new Array();
    var insText = new Array();
    insMark[insMark.length] = Array('<a class="foldmark" href="#" onclick="',tmpText,'" onkeypress="',tmpText,'">').join('');
    insMark[insMark.length] = (initMode == 'off') ? openMark : closeMark;
    insMark[insMark.length] = '</a>';
    if (preMark) insText[insText.length] = insMark.join('');
    //    insText[insText.length] = objTitle.innerHTML;
    if (viewNum) {
      var objItems;
      objItems = objLists.getElementsByTagName('a');
      var counter;
      if (idName == "link") { // delete 3Link
        counter = objItems.length - 3;
      } else {
        counter = objItems.length;
      }
      insText[insText.length] = '&nbsp;&nbsp;' + Array(' <span>',counter,'</span>').join('') + ' ' + objTitle.innerHTML;
    } else {
      insText[insText.length] = '&nbsp;&nbsp;' + objTitle.innerHTML; 
    }
    if (!preMark) insText[insText.length] = insMark.join('');
    objLists.style.display = (initMode == 'off') ? 'none' : 'block';
    objTitle.innerHTML = insText.join('');
  } else if (initMode == 'chng') {
    var objMarks = objTitle.getElementsByTagName('a');
    for (i=0;i<objMarks.length;i++) {
      if (objMarks[i].className == 'foldmark') {
        objMarks[i].firstChild.nodeValue = (dispMode == 'none') ? closeMark : openMark;
      }
    }
    objLists.style.display = (dispMode == 'none') ? 'block' : 'none';
  }
}
InitFoldNavi();

以下スクリプトの説明です。上部にある

FoldNavigation('newentry','off',false); 

ですが、()内のパラメータの意味はそれぞれ

FoldNavigation('id属性名','初期状態',リスト数表示);

です。id属性名が先の"category"や"entry"に対応します。つまり折りたたみをしたいメニュー分、この行を作ります(注:全角文字(空白など)が混入しないように気をつけてください)。その右の初期状態はページを開いた時の折りたたみ状態です。onは開いた上体、offは閉じた状態です。最後のリスト数表示はタイトル横にそのメニュー内のリスト数(例えばカテゴリーメニューにカテゴリーが10あれば"10")を表示します。'true'と記述すれば表示、'false'は非表示です。

青色部分はオリジナルから変更した部分です。以下主な変更内容です。
まず、"[+]"、"[?]"はメニュータイトル横に表示される折りたたみ切り替え用のリンク文字です(好きな文字を設定できます)。
このスクリプトは前述の通りタイトル横にリストの合計数を表示してくれます。オリジナルは"li"のタグ数を計算して表示していますが改造版では<a href="?">タグの数を計算するようにしています(リスト表示に<li>タグを使っていないため)。またオリジナルではリストの合計数をタイトル右側に"()"で表示していますが、このスクリプトではタイトルの左側に表示するようにしてみました。BlogPeopleのリンク数についてはバナーと登録用リンクの計3つが余分なので、その分を減算しています(エレガントさに欠けますが…)。
さらに折りたたみ用マークをつけることでタイトルの位置が若干左にずれるため、タイトル左に全角空白を1文字挿入して微妙に位置調整しています(ただしマークをタイトル右側に挿入することが前提)。

3.テンプレートにJavaScriptファイル読み込みの設定
テンプレートの一番最後の方(</body>の直前等)に、先に作成したJavaScriptファイルを読み込むためのタグをを挿入します。

<script type="text/javascript" src="http://xxx/menufolder.js"></script>

"xxx"の部分には任意のURLを設定してください。JavaScriptファイルをmt.cgiと同じディレクトリに配置した場合、私のblogを例にとるとxxxの部分は"www.koikikukan.com"になります。

4.スタイルシートの追加
styles-site.css の .sidetitle の下に下記を追加します。

.sidetitle a {
    float: right; /* マークを右側に配置 */
    width: 1.8em;
    text-decoration: none;
}
.sidetitle a.foldmark {
    font-size:7px; /* マークのフォントサイズ */
    padding-right:3px; /* マークの位置調整 */
}

このスタイルシートは適切な指定でないかも知れませんがとりあえず正常に動作しています。

設定方法は以上です。当初マークが右側に配置されなくて悩みましたがオリジナルのサイトにかなりの質問コメントが寄せられており、そちらを参照しました(スタイルシートのfloat: rightの設定とJavaScript上部にある「マークの挿入位置」がきちんと指定できていれば大丈夫みたいです)。
マークは右側に無事配置されたのですが今度はタイトル右端にくっついてしまうのが気になるので、これはpaddingで調整しました。blogの中にblogを作っている気分です。この時スタイルシートを変更しても変更が反映されずまたしても悩みましたが、ブラウザのキャッシュに古いデータが残っているのが原因のようでした。IEであればブラウザの「更新」をクリックするかキャッシュを削除しましょう。

ちなみに「Recent Comments」等もリスト数を取得できる筈なのですが動作確認できていないので保留にしています。できるようになりました。↓追記参照ください。

2004.08.31追記
上記2.の青色部分を下記のスクリプトの青色部分と入れ替えれば「最近のコメント」も件数表示が可能になります。これは「最近のコメント」にあるURLのaタグの"#"を計数しています。

if (viewNum) {
  var objItems;
  var href;
  var commentCounter = 0;
  objItems = objLists.getElementsByTagName('a');
  if (idName == 'comment') {
    for (i = 0; i < objItems.length; i++) {
      href = objItems[i].getAttribute("href");
      if(href.indexOf("#") == -1){
        commentCounter++;
      }
    }
  }
  var counter;
  if (idName == "link") {
    counter = objItems.length - 3;
  } else {
    counter = objItems.length - commentCounter;
  }
  insText[insText.length] = '&nbsp;&nbsp;' + Array(' <span>',counter,'</span>').join('') + ' ' + objTitle.innerHTML;
} else {
  insText[insText.length] = '&nbsp;&nbsp;' + objTitle.innerHTML;
}

2004.09.20追記
BlogPeople以外にリンクを増やす場合は

if (idName == "link") { // Linkは不要な3リンク分を減算
  counter = objItems.length - 3;
} else {
  counter = objItems.length;
}

の部分を

if (idName == "link1") {
  counter = objItems.length - 3;
} else if (idName == "link2") {
  counter = objItems.length - 2;
} else {
  counter = objItems.length;
}

のように、link名を適宜対応した属性名のものに変更して条件文を必要な分だけ追加してください。追加するのは減算が必要な場合だけです。

2004.10.01追記
コピー後、";"のある行は途中で折り返しがないかご確認ください(折り返しがあるとsafariで正常に表示されないようです)

2004.11.01追記
サイドメニュー折りたたみ状態保持スクリプトおよびサイドメニュー折りたたみの動作遅延対処へのリンクを本文に追加しました。

2004.11.02追記
JavaScriptの日本語コメントを半角英数に修正しました。またMac+IEの場合はmenufolder.jsを正常に読み込めないようですので、スクリプトを直接テンプレート内に埋め込む記述を追加しました。

Comments [77] | Trackbacks [26]
2004年8月21日

Movable TypeでTrackback文字化けを対処する方法

Trackbackの文字化けを対処しました。遅くなってすいません > いつもTB頂いているMagic Whiteさん

これは文字コードの異なるBlog(例えばサイトAがUTF-8、サイトBがShift_JIS等)同士でTrackbackを行うと文字化けが発生(サイドメニューのRecent Trackbackの部分)し、これに対する対処です。Trackbackを受信するサイトが対処します。ちなみに現在このサイトはMT3.0Dなのですが、MT3.01D-jaでUTF-8とShift_JISの試験サイトをそれぞれ作ってUTF-8側をTrackback受信サイトとした場合、この対処なしでも文字化けは発生しませんでした(間違ってたらすいません)。

という訳でいつもの手順メモ。

Jcode.pmのダウンロード
Comprehensive Perl Archive NetworkよりJcode-0.86.tar.gzをダウンロード(現在はこのURLにあり、0.83/0.86/0.87があったので0.86を選択)。

Jcode.pmの配置
ダウンロードしたファイルを解凍し、その中の Jcode.pm と Jcode フォルダを extlib フォルダ直下に配置。

TrackBack.pmの編集
lib/MT/App/TrackBack.pm を任意のエディタで開き、下記に青色部分のコードを追加。

sub no_utf8 {
    require Jcode;
    for (@_) {
        next if !defined $_;
        $_ = pack 'C0A*', $_;
        $_ = Jcode->new($_)->utf8;
    }
}

"utf8"の部分は自blogの文字コード("euc"、"sjis"等)を設定。

動作確認
自サイトの任意のエントリーに表示されているTrackback URLをブラウザに設定して、下記のXMLが表示されればOKみたいです。

 <?xml version="1.0" encoding="iso-8859-1" ?>
-<response>
   <error>1</error>
   <message>Need a Source URL (url).</message> 
 </response>

参考サイトは下記です。ありがとうございました。

2004/09/15追記
2004/09/11に Movable Type 3.01D-jaにしたため、この対処は現在使用しておりません。

Comments [3] | Trackbacks [4]
2004年8月20日

追記文章の折りたたみ用スクリプト(改)

August 20,2004 1:31 AM
Tag:[, ]
Permalink

#「追記折りたたみスクリプト」で再び隠した時に表示がずれるのが気になる方へ。
Movable Type のエントリーの「追記」部分に書いた文章は、エントリー本文の最後に「続きを読む」というリンクが現れ、それをクリックした時に読めるようになります。
ところがデフォルトの設定ではこのリンクをクリックすると個別アーカイブのページにジャンプしてしまい、さっきまで読んでいた箇所まで探さないといけなくなります。感覚的には「続きを読む」をクリックしたらそのまま下に続きを表示して欲しいところです。

そういう訳で、このスクリプトは今読んでいるページを動かさずに本文下に追記を表示してくれるというスグレモノです。これも以前から導入したかった機能でようやく実現できました。「追記」に文章書いたことは一度もないのですが(笑)。
スクリプトは色々なサイトに転がっており、オリジナルはScriptygoddessさんのサイトみたいです。

タイトルの(改)ですが、オリジナルのスクリプトでは続きを再び隠した時に画面がビクッとなり(=アンカー指定の位置にずれる模様)、それが起きないようJavaScriptをちょっと修正しました。それからオリジナルはコメント部分にも使える仕様ですが本文でしか使わないと思い、コメント関連のコードも削除してます。
とりあえずソースと手順を載せておきます。

1.テンプレートにスクリプト追加

リスト1のスクリプトを <head>~</head> の間にコピーしてください

<script type="text/javascript">
function showHide(entryID, entryLink, htmlObj) {
  extTextDivID = ('Text' + (entryID));
  extLinkDivID = ('Link' + (entryID));
    if( document.getElementById ) {
    if( document.getElementById(extTextDivID).style.display ) {
      if( entryLink != 0 ) {
        document.getElementById(extTextDivID).style.display = "block";
        document.getElementById(extLinkDivID).style.display = "none";
        htmlObj.blur();
      } else { 
        document.getElementById(extTextDivID).style.display = "none";
        document.getElementById(extLinkDivID).style.display = "block";
      }
    } else {
      location.href = entryLink;
      return true;
    }
  } else {
    location.href = entryLink;
    return true;
  }
}
</script>

リスト1:折りたたみ用スクリプト

2.テンプレートタグの修正

リスト2の赤字部分をリスト3の青字に入れ替えます(緑色部分は隠した時に表示がずれないための改造箇所)。

<MTEntryIfExtended>
<span class="extended">
<a href="<$MTEntryPermalink$>#more">続きを読む "<$MTEntryTitle$>"</a>
</span><br />
</MTEntryIfExtended>

リスト2:追記表示用MTタグ(修正前)

<MTEntryIfExtended>
<div id="Link<$MTEntryID$>">
<a href="<$MTEntryPermalink$>" name="<$MTEntryID pad="1"$>" onclick="showHide(<$MTEntryID$>,'<$MTEntryPermalink$>',this);return false;">続きを読む ≫</a>
</div>
<div id="Text<$MTEntryID$>" style="display: none">
<$MTEntryMore$>
<a href="<$MTEntryPermalink$>" name="<$MTEntryID pad="1"$>" onclick="showHide(<$MTEntryID$>,0,this);return false;">≪ 続きを隠す</a>
</div>
</MTEntryIfExtended>

リスト3:追記表示用MTタグ(修正後)

Category Archive/Date-Based Archiveも同様です。<MTEntryIfExtended>~</MTEntryIfExtended>で括られた部分を適宜入れ替えてください。個別エントリーアーカイブについては「個別アーカイブに続きを読むを導入」をごらんください。

2006.04.04 追記
リストから language 属性を削除しました(HTML4.01/XHTMLで非推奨あるいは廃止されているため)。

以上です。↓「続きを読む」をクリックするとこんな感じで追記が表示されます。

Comments [54] | Trackbacks [71]
2004年8月19日

コメントスパム対策

August 19,2004 1:31 AM
Tag:[]
Permalink

ようやく取りかかりました。

  • コメントスパムを削除する手間が面倒
  • コメンターの方への入力文字制限をしない

というポリシーで、当初我楽さんのコメントスパム、補足というか・・・。経由で女子十二月号さんのMovableTypeコメントスパム対策をと思いましたが、コメントプレビューテンプレートでユーザ定義のhiddenタグが引き継げない(スキル不足?)ことが発覚し、今のところMagic WhiteさんのTypeKey対応などなどスパム対策経由できままにポロポロさんの続々コメントスパムを参考にさせて頂いて、半角英数のみのコメントをエラーとする対処にしています。

Comments [17] | Trackbacks [2]
2004年8月 9日

TypeKeyサインインで「The validation failed.」というエラーになる件について

August 9,2004 2:16 AM
Tag:[]
Permalink

は正常に動作していません。サインインをしても「The validation failed.」となります。調べたところ、Individual Entry Archive の

<$MTSignOnURL$>&amp;<MTIfNeedEmail>

<$MTSignOnURL$>&amp;v=1.1&amp;<MTIfNeedEmail>

に変更すれば良いということでやってみたのですが同じ現象でした。まあこれはアップグレードの方用の対処であって、私は3.0Dで無理矢理やってますからね…(よく調べきれてないので勘違いしているかも知れませんが今日のところはここまで)。

あとこのエラー画面ってなかなか出ないのでこの際テンプレートを直しておこうかと(負け惜しみ)。

2004.10.04 追記
現在はMovable Type 3.01D-jaで運用しておりますのでTypeKey機能は正常に動作しています。

Comments [2] | Trackbacks [1]
2004年8月 7日

カレンダーのリンク修正

August 7,2004 1:30 AM
Tag:[]
Permalink

月別アーカイブのページ分割後、カレンダーからクリックしたページのジャンプが思い切りおかしくなってました。デフォルト状態でのカレンダーからのリンクは、月別全体のページ+aタグのname属性でジャンプするのですが、ページ分割をしてしまうとその機能が無効になります。

ということで、再びMagic Whiteさんのカスタマイズメモその3からからIllustrations "choco*choco"さんの「アーカイブの名前を変えたよ」へ(最後までよく読んでなかったですね…)。
手順は以下の通りです。

「アーカイブファイルのテンプレート」修正

管理メニューの「ウェブログの設定」→「アーカイブの設定」でアーカイブの「日別」にチェックして「アーカイブファイルのテンプレート」に

<$MTArchiveDate format="%Y/%m/%d"$>-index.php

を設定。変更を保存。

テンプレート修正

カレンダーを使っているテンプレートで赤色部分を青色部分のように変更

<MTEntries lastn="1">
<a href="<$MTEntryLink archive_type="Monthly"$>#<$MTEntryID pad="1"$>">
<$MTCalendarDay$></a>
</MTEntries>
<MTEntries lastn="1">
<a href="<$MTEntryLink archive_type="Daily"$>">
<$MTCalendarDay$></a>
</MTEntries>

サイトの再構築

以上です。日別でジャンプしたところのサイドメニューも少し修正したいのですがとりあえずここまで。ちなみにテンプレートを持っていかれた方は元々下の設定になっていました。2ヶ月表示に変更した時のテンプレートが上の設定になっていたようです(無知)。

非常にすっきりしましたが再構築時間がちょっと心配。

Comments [6] | Trackbacks [2]
Now loading...
ギターに入った猫
掲載広告募集
Styles
Font Size
Default
For defective color vision
Gray Scale
RGB Color
Search this site

このブログをメールで購読する by:FeedBurner

AMN
Categories
Monthly Archives
2019年
2018年
2017年
2016年
2015年
2014年
2013年
2012年
2011年
2010年
2009年
2008年
2007年
2006年
2005年
2004年
2003年
BlogPeople
Syndicate this site
FeedBurner(RSS1.0/RSS2.0/Atom)
Counter
これまでのアクセス
Powered by
Movable Type 6.0.3