2010年2月19日

隠居のパソコン備忘録:IE8 のソースを秀丸で開く

 IE7 では、ネットで開いた頁の HTML ソースコードを開くのは、秀丸エディタに指定しており、それで開いていた。
 指定の方法は、IE でツール→インターネット・オプション→プログラム→HTML エディタで秀丸エディタをインストールすると表示される「HIDEMARU」 を選択する。

 ところが、IE8 に変えてから同じような指定をしているのに、Miscrosoft のエディタとなる。秀丸エディタに比べれば、慣れていないせいもあるだろうが使いにくい。
それでネットをググッテみると、YOU LOOK TOO COOL というブログに解決方法を提示してくれていた。それで解決したので、備忘録として記録しておきたい。ネットでは、ほとんどのことが解決される。

  1. 事前に、Hidemaru.exe を収納したフォルダーを確認しておく。
  2. IE8 の「ツール」→「開発者ツール」をクリックして、開発者ツールを立ち上げる。ウィンドウ上部の表示は、現在開いている Window のページ表示が出るようである。Hidemaru_1.JPG
  3. ここで、メニューバーの「ファイル」→「Internet Explorer ソースの表示カスタマイズ」→「その他」を選択すると「ファイルを開く」ポップアップ画面がでるので、ここで Hidemaru.exe を収納したフォルダーを指定して、 Hidemaru.exe を指定し、開発者ツールを閉じればよい。Hidemaru_2.JPG

 このような設定にしておくと、開いたウィンドウのソースは、IE8 の「表示」→「ソース」で秀丸エディタで表示される。また、二つめのウィンドウのソースは、秀丸エディタでは、新しいタブ・ウィンドウで表示されるので、作業がやりやすい。

2010年2月11日

隠居のHTML備忘録:テーブル・セルを縦に結合する

 なんとなく週に一回しか行かない習慣になってしまって、モッタイナイので スポーツ・ジムを退会した。その代わりに、毎朝のウォーキングを再開することにした。
 1時間~2時間ほど歩くと、野鳥の撮影場所ロケハンができる。ほとんど決まった場所に行くのだが、行くたびに双眼鏡の視野に入ってくる野鳥に変化がある。
 それで、後々の記録にと思って、「探鳥日誌」とでも名付けて、下のようなWeb ページを作ることにした。

 今まで、テーブルのセルを縦方向に連結したことがなかったので、ネット・サーチをしてみると、簡単な方法は載っているが、下のような少し複雑な表のコード例は紹介されていなかった。いろいろとトライしてみたが上手くいかない。
 それで、Excel の表が Web ページにできることを思い出し、Excel でサンプル・ページを作り、そのWeb ページのソースをコピペして参考にした。ブログに使った html ソース・コードを備忘録として記録しておきたい。

探鳥メモ
dateweatherlocationNameqtty.memo
Revised on Feb. 11th, 2010
2010/2/11
7:15 - 8:15
曇天
 ときに小雨
田辺池 ヒドリガモ 26羽 3グループ
東谷池 ヒドリガモ
カイツブリ
コサギ
11羽
2羽
1羽
この池で初めて
西松尾池 マガモ 10羽 この池で初めて



<table border="1" align="center">
<thead>
<tr>
<td id="th1" colspan="6" align="middle">探鳥メモ</td></tr>
<tr align="middle"><td id="th1">date</td><td id="th1">weather</td><td id="th1">location</td><td id="th1">Name</td><td id="th1">qtty.</td><td id="th1">memo</td></tr>
</thead>
<tfoot>
<tr>
<td bgcolor="#cccccc" align="right" colspan="6">Revised on Feb. 11th, 2010</td>
</tr>
</tfoot>
<tbody>
<col span=6 > 
<tr >
  <td width="100" rowspan=3 >2010/2/11<br />   7:15 - 8:15</td>
  <td width="100" rowspan=3 >曇天<br /> ときに小雨</td>
  <td width="100">田辺池</td>
  <td width="115">ヒドリガモ</td>
  <td width="80" align="right">26羽</td>
  <td width="230">3グループ</td>
 </tr>
 <tr >
  <td >東谷池</td>
  <td >ヒドリガモ<br />カイツブリ<br />コサギ</td>
  <td align="right" >11羽<br />2羽<br />1羽</td>
  <td valign="top">この池で初めて</td>
 </tr>
 <tr >
  <td >西松尾池</td>
  <td >マガモ</td>
  <td align="right" >10羽</td>
  <td >この池で初めて</td>
 </tr>
</tbody></table>


2010年2月 7日

(続)インターネット・ラジオ Live365 を Aircheck(録音) して MP3 にする方法

 インターネット・ラジオ Live365 を Aircheck して MP3 ファイルにする方法については、以前のエントリー、「Live365 を Aircheck (録音)する一つの方法」「アナログ音源(LP, FM, Live365 etc.)からMP3ファイルを作るひとつの方法」で、かなり詳細に記載している。
 今回は後者のエントリーに記載した中から、Live365 の録音・MP3 ファイル作成に焦点を絞って、再整理してみたい。

以下の記載は、次の環境を前提としている。
  • PC に Sound Board が搭載されている。(私の場合、Sound Max digital Audio が搭載されている)
  • Sound Board の output および input は、オーディオ装置(私の場合、 Pioneer コンパクトミニコンポーネント)の line-in および line-out に接続されている。
  • PC に、マルティメディア・ソフト Roxio Easy Media Creator suite 10 がインストールされている。

 次に、上の環境で Live365 のOldies ジャンルの American Sixities Radio を録音し、MP3 ファイル化した経緯を記録しておきたい。
  1. Live365 に接続して、Oldies → 60s を選択し、American Sixities Radio をクリックし、Play ボタンをクリックすると、若かりしころの懐かしい歌声が流れてくる。録音した後聴くと、当然ながら audio quality(CD 64k 以上) の高い放送の方が音がいい。

    Feb_10_13.JPG
    Feb_10_21.JPG
  2. Roxio Easy Media Creator を立ち上げて、オーディオ →「 LP/テープを交換」を選択する。「Easy Audio Capture」 よりは、こちらの方が後の処理が楽なように思う。
    Feb_10_22.JPG
  3. 「 LP/テープを交換」をクリックすると下のような画面となる。接続がきちんとできておれば、オーディオから音が流れ、録音レベルの横バーが動いているはずである。
     録音のための接続については、「録音セットアップガイド」ボタンをクリックすると図入りで詳しく書かれているウィンドウがでるので参考になる。。
     「詳細設定オプション」ボタンをクリックして、表示されるポップアップ画面で、一時保存先のファイルやファイルフォーマット、トラック検出などを指定する。
    ファイルフォーマットの画面にあるプリセット選択ボックスでは、iPod AAC も選択することができるが、iPod は mp3 もサポートしているから、私の場合、 mp3 高品質を選択している。
    Feb_10_24.JPG
  4. そのような設定をしたうえで、「キャプチャー元」の選択はサンドボード名(選択肢に入っているはず)を、入力は「ライン入力」を選択し、録音レベルの「自動」ボタンをクリックする。自動で録音レベルの設定が終われば、録音準備完了である。
     録音ボタンをクリックすると録音が始まる。このとき自動的に、流れてくる音は停止ボタンを押すまで MP3 化して保存されている。無音部分をトラック検出指定でしてくれるし、後で部分的な削除もできるので、ズーと流し放しでいいだろう。
  5. 停止ボタンを押すと、録音されたトラック(無音部分で区切られた音声)が示される。
    Feb_10_26.JPG ページ右下の「次へ」ボタンをクリックすると音の波形画面が現れる。右上のズームイン・アイコンbtn_2.JPGをクリックすると波形の横幅が広がる。
  6. 曲の途中の無音部分でもトラック・セパレータbtn_4.JPGがはいる場合がある。トラック・セパレータの位置が間違っている場合は、削除したい部分を反転させて、左上にある「トラック・セパレータの削除」ボタンbtn_3.JPGクリックすればよい。
    また、コマーシャルなど削除したい部分を波形上で選択(波形上にカーソルを置きドラッグする)して、delete ボタンを押せば波形から削除できる。削除してもよいかなどは、左下にある再生ボタンを押して音で確認することができる。
    Feb_10_27.JPG
  7. このように整理した上で、左メニューの「タグ」ボタンをクリックすると、下のようなポップアップ画面となる。Feb_10_17.JPG
  8. ここで、「Mudic ID」ボタンをクリックすると、CDDB の Grace Note が立ち上がって波形から曲を判定するということになっているが、ほとんどヒットしない。
     そこで、曲の情報にあまりこだわらなければ、適当に曲のIDタグを入力してもよいが、曲の情報を得る方法はある。
     American Sixities Radio (録音をしている Live365 の局)のステーション・ページに、次のように Now Playing というところに、今流れている曲とその前に流された4曲(計5曲)のID タグ(Artist, Track名, Album名(シングル盤は Single で)などが表示されるので、これを メモ帳 か何かに、録音しながら(聴きながら)コピペしておく。
    Feb_10_33.JPG注:キャプチャーした時点が異なるので、上の表示とコピペしたものの内容は異なる。 Feb_10_39.JPG
    コピペした情報を上の 「オーディオ タグ 編集」の画面で入力すれば、MP3 ファイルに、タグが追加される。このようにしておけば、WindowsMedia Playerなどの音楽DB で整理しやすくなると思う。 Feb_10_31.JPG
  9. 完了ボタンをクリックすると元の波形画面に戻り、「次へ」ボタンをクリックすると、「LP/テープ アシスタント」画面は第3ステップとなる。 Feb_10_37.JPG
     ここで、「トラックをエクスポート」をクリックすると、下のようなポップアップ画面がでるので、「出力設定」に MP3 高品質 を選択し、保存先のフォルダーを指定する。なお、「出力設定」の右にある「編集」ボタンをクリックし、ファイル名/フォルダ構造→サブフォルダ構造の追加のチェックボックスを外しておいた方がよい。(デフォールトでは、チェックが入っている) Feb_10_36.JPG
  10. エクスポートすると、指定した保存先のフォルダにファイルが保存される。 Feb_10_40.JPG
  11. Live365 から録音し MP3 化したファイルは MP3Gain を使って音量を一括調整をしておく。Live365 個々の放送局から流れる音は局の方で音量は調整してあると思うが、局によって調整している音量レベルは異なるので、自分の音楽DB に収納する場合は同じレベルに調整しておいた方がよい。


 このようにして、MP3 ファイルで保存しておけば、iPod に転送して外に持ち出せるし、音楽CD に焼くこともできる。まあ、若かりし頃に、FM放送から流れてくる音楽を苦労してテープに Aircheck したことと同じ作業ではあるが、今の時代には、あらゆるジャンルの Web Radio 局から流れてくる音楽をデジタルに録音し持ち歩けるのである。すごい時代になったものだと思う。

2010年2月 2日

Radio Senboku の station page image を変更する

 突然、カナダのリスナーから "radio senboku ベストはある!" というタイトルの以下のような メールをもらった。
Hello Shuhei-san,

My name is Thomas(yoroshiku), I am 25 year old man from Canada and am a very big fan of your radio station. I am only learning about jazz music right now, but of all the stations, I definitely like your choice in music the best. I listen to it every day at work. I also love many things Japanese like sushi, anime, manga, your rich culture and history(I am very slowly learning how to understand japanese). I am a graphic designer and would love to try and design you a new picture for your radio station. I hope this email reaches you, thank you again for what you provide for me everyday and I plan on donating to support you shortly.

Thank you again.
Thomas Fullona


 どうやらgraphic designer の仕事をしながら、BGM でRadio Senboku を聴いてくれているらしい。
 たどたどしい英語で返事を書いた。チャネルを合わせてもらっていることの御礼と Radio Senboku の station page image のデザインを楽しみにしているという内容である。
Radio Senboku station page image:クリックすると大きな写真になります 翌日に、堺市の市章を使ってデザインされた右のようなイメージ画が draft だといって送られてきた。ただ、flag right を得て欲しいと言うことであった。
 堺市の広報課に送られてきたデザインを添付して許諾して欲しいとのメールをすると、休み明けに電話があった。堺市の市章と今回のデザインとは、全体としては別物であるし、市章の著作権もないし、商用でもないので問題はないと言うことであった。

 早速、Live365 の Radio Senboku station page にある長い間使ってきたイメージを差し替えた。大きさは、276x155 px と指定されているので、Fireworks と Picasa をつかって 900x600 px の元画像を調整した。

 ところで、この1月はRadio Senboku では、Swing 特集としているが、この1ヶ月間の各国別のリスナーは、下の表のようになっている。3番目の Canada は、Thomas さんが毎日聴いてくれているからかもしれない。
Live365

Radio Senboku station page image:クリックすると大きな写真になります
(追記:2010/2/3) Thomas さんは仕事が忙しかったようで返信がしばらくなかったが、昨日、先のデザインで色づけをしたものを何種類か送ってくれた。少し色づけがあった方がいいですねというこちらの要望にこたえてくれたものだ。ブルーの背景色に白字のものが気に入ったので、モノトーンのものと置き換えた。


 

2010年1月30日

隠居のMT備忘録:ソースコードを縦スクロールつきコード・ボックスで表示する

 エントリーで、HTML や Javascript , XML のソースコードを記録するときには、<pre><code>~</code></pre>という形で記述している。
 私のMovable Type でのブログは、「小粋空間」さんのテンプレートを使わせてもらっている。もちろん付属しているCSS(Cascading Style Sheets)も使っている。そのCSSでの <pre> は次のように設定されている。backgroundの色は、いじっていているが。
pre {
    margin: 15px 20px 0px;
    padding: 10px;
    background: #ffffe0;
    border: 1px solid #999;
    font-size: 83.3%;
    line-height: 1.5;
    width: 100%;
    overflow: scroll;
}

 このまま、100行、200行あるソースコードを記載すると、縦に非常に間延びしたエントリーになってしまう。
 これを避ける方法をネットでサーチしてみると余りにも普通の知識なのか適切な記述が見つからなかった。もう一度 CSS の基本に立ち返って学習してみると、CSS の pre の部分に、
pre {
  ,,,,
  height: 150px;
  ,,,,
 }
 
といれればよいことが分かった。 
 が、これでは1行のコードを表示するときでも、縦 150px のボックスができてしまう。それで面倒でも、本文のHTMLで
<pre style="height: 150px"> 
とスタイルを指定すればいいことが分かった。この方法を使えば、ボックスの縦の大きさを表示するコードの行数に合わせて変えることができる。スタイルを指定しなければ、縦スクロールがなく、全てのソースコードが表示される。余りにも基本的なことなので、ブログに載せるのは恥ずかしいが、自分自身の備忘録として残しておきたい。

 なお、、<pre><code> ~ </code></pre> の ~ 部分(ソースコード)にある < > は、特殊文字と判定されるので、&lt; &gt;  とHTML エンコードする必要がある。
私はエンコードには、HTML エンコードフォームというサービスを使わせてもらっている。これを使うと空白文字が 、&nbsp; に、" が &quot;に、& が &amp;にエンコードされるが、エンコードされたものをそのまま Copy&Paste して使っても問題はない。
 また、いろいろな場面でソースコードを整理する必要があるが、そのようなときはシェアウエアの「秀丸エディタ」を使っている。テキストを編集する様々な機能が備わっているので、非常に便利である。

2010年1月 7日

隠居のパソコン備忘録:Internet Explorer 8 をインストールする

 昨年末の投稿に記載したように、私のブログの、どのページに、どれぐらい数の方々が訪問されているかなどを分析する無料のアクセス解析サービス Artisan を導入している。

 この分析には、アクセスする方が使用されている ブラウザ、OS 、解像度なども表示される。
 昨年の12月1日からの分析をみると、それぞれのベスト5は、以下のようになっている。
Artisan による分析(2009/12/1~2010/1/5)
順位ブラウザ%OS%画面解像度%
1
2
3
4
5
Internet Explorer 8
Internet Explorer 6
Internet Explorer 7
Firefox
Safari
33.9
21.6
20.4
14.0
3.5
WindowsXP
WindowsVista
MacOSX
WindowsNT
Windows2000
65.2
21.0
4.1
3.7
1.9
1024x768
1280x1024
1280x800
1680x1050
1440x900
29.0
19.1
14.9
6.3
5.5


 少し前までは、ブラウザは Internet Explorer 7 (IE7) が一番多かったのだが、2009年3月に Internet Explorer 8(IE8) がリリースされ、5月の終わり頃から画面上に 自動更新による自動インストール通知が現れるようになってきたことが、原因していると思われる。
 IE6 から IE7 へバージョンアップしたときの不具合に懲りているので、自動インストール通知を無視してきたが、上のように Artisan の解析で、IE8 がトップを占めてきたので IE8 をインストールしてみた。
 インストールする前に、"IE8 不具合"でネットサーチしてみると、goo! のQ&A に私も導入しているスパイウエアの検索と修復ソフトである「Spybot - Search & Destroy」 で不具合が起こる場合があることが分かった。それで、回答にあるように、IE8 をインストールする前に処理しておいた。
 また、IE8 に対応していないアドオンを導入している場合などでは、動作しないことも報告されている。たとえば、講談社の「日中辞典」CD-ROM は上手く動作しないようである。
 そのような準備をしてインストールするとすんなりと動くようになっている。

 まだ、使い始めたところであるが、気がついた点を備忘録として記録しておきたい。
 IE8 では、IE7 と比較すると文字の大きさが異なるようである。Firefox(=Google Crome)と同じように大きな表示になる。こちらが標準HTMLの表示のようである。ただ、ツールバーのURL を入力するボックスの右にある「互換表示」ボタンをクリックすれば、IE7 の表示に変えることができる。互換表示については、Microsoft のページに次の解説がある。
互換表示
 Internet Explorer 8 はリリースされて間もないため、一部の Web サイトは Internet Explorer 8 に対応していない場合があります。この場合は、[互換表示] ツール バー ボタンをクリックすることで、Internet Explorer 7 で表示するのと同じように Web サイトを表示できます。これにより、テキスト、画像、テキスト ボックスの位置がずれるといった問題を解決できます。このオプションはサイトごとに設定できるので、他のサイトは引き続き Internet Explorer 8 の機能を使用して表示されます。そのサイトを Internet Explorer 8 の機能で表示するように設定を戻すには、単に再び [互換表示] ボタンをクリックするだけです。

 また、アクセラレータという機能があり、ウェブ・ページの文中にある文字を選択するとその近くにのようなマークが出る。 このマークをクリックすると「Google で検索」など検索オプションを選択するセレクトボックスが出てくるので、たとえば、「Google で検索」をクリックすると、Google で検索したと同じ結果になる。文中で選択した言葉が建造物や地名だと セレクトボックスから「Live search 地図」をクリックすると Google の地図検索と同じような結果になる。これは、今まで使ったことはなかったが、Microsft の地図検索サービスのようである。要するに、IE8 は Microsoft が iGoogle を意識したサービスになっているようだ。

 詳細は、Internet Explorer 8: ホーム ページを参照すればいい。

2010年1月 3日

隠居のパソコン備忘録:Google Maps API を使った地図ページでの文字化け対策

 皆様、あけましておめでとうございます。今年も、よろしくお願いします。
 今年も、自分用の記録のために、ブログを続けたいと思います。ネット の世界の片隅に参加していることで、世の中の変化が、少しは肌で感じられるないかと不遜なことも考えています。

 GoogleMapsAPI を使った地図ページ、例えば、Studio YAMAKO「クロアチア・スロベニア・モンテネグロを巡る旅」は、GoogleMapsAPI を使いこなすためのtutorial の中から、自分でなんとか使えそうなサンプルを参考にというか、ほぼそのままに Copy&Paste して使っている。
 このページでは、Google Map をテーブルの中に表示しているが、ここで使っている表題の日本語が、場合によって文字化けを起こす現象が起きていた。
 文字化けを起こしている場合は、画面を右クリックし、出てくるポップアップ画面でエンコード→Unicode(UTF-8) を選択すれば治るのであるが、見にきてくれる人にお願いをするわけにはいかない。 
 そこで、何か方法はないかとネットサーチしてみると、上のHTML コードのなかの<head> ~</head> 部分に、その文書に関する日本語コード情報(メタ情報)を指定していなかったために起きたらしい。 つぎのようなメタコードを挿入すると、文字化けはなくなった。(と思う。)
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">


 メールなどの文字化けについては、よく相談を受けるが原因がよく分からない場合が多い。多くは、使っているメーラーの設定によると思われるが、発信元・受信先を探らないとよく分からない。もう一つのよくある原因は、普通には使わない名前などで使われている特殊な2バイト文字が宛先とか文中に使われる場合である。また、ドイツ語のウムラクトつきu(ü)などでも、文字化けを起こすようである。

2009年12月10日

隠居のパソコン備忘録:送信先リンクでGmail を使用する

 ブログの中に送信先のボタンを表示して、それをクリックすれば、直接メールをしてもらうことができる。このリンクをブログに書くHTML コードは、例えば私の場合 
<a href="mailto:n_shuhei.net@n-shuhei.net"> n_shuhei へメールする</a> 
 となる。

 多くの方々がインターネットのブラウザは、 Internet Explorer を使い、メールは、outlook express を使用されている。そのような場合、このメール送信ボタンをクリックすると、下のスクリーンショットのように、outlook express の送信画面となり、宛先欄に例えば私のアドレスが記入されている。
view_OE.JPG


 ただ、これで全く問題はないのであるが、最近は 便利さから Gmail を使っておられる方が結構おられる。 Gmail を普段使っていると送信記録もそこに残されるから、このような場合も Gmail から発信された方が好ましい。
 WindowsXP で Internet Explorer 環境では、普段使う電子メールプログラムは、「ツール」→「インターネットオプション」→「プログラム」→「電子メール」に表示されている。ただし、Gmail は、Yahoo メールなどと同じように、web メールであるので、普段使っていても、ここには表示されない。
 そこで、 Gmail から発信できる方法をネットサーチしてみた。設定の方法は簡単であるが、設定する場所を見つけるのが難しかったので、備忘録的に記録しておきたい。
Gmail を利用されている方なら、Google 本体はインストールされているはずである。その場合、 Internet Explorer の表示で、一般的には下のスクリーンショットのように、 Google Toolbar が表示されている。表示されていない場合は、「表示」→「ツールバー」→「Google toolbar」をクリックすれば表示される。
toolbar_IE7_s.JPG


このツールバーの右の方にあるtool_google.JPGマークをクリックすると出てくるポップアップ画面で「検索」を選択し、「ウェブ閲覧ツール」で「送信先リンクで Gmail を使用する」にチェックを入れておけば、送信先ボタンをクリックしたときに下のスクリーンショットのように Gmail の送信画面が立ち上がる。
view_google.JPG


2009年11月 8日

隠居のパソコン:素晴らしい E-cards の紹介

 2006年7月にロサンゼルスに住んでいる先輩女史から送ってもらったアメリカ独立記念日のGreeting Cardがが素晴らしかったので、この E-cards を作成して有料で提供している jacquielawson と契約した。年間 $12 (2年間:$18 )で、作成されたそれぞれが素晴らしい E-cards が自由に使える。

クリックするとアニメーションが始まります 10月終わり近くになって、jacquielawson から、右のような新しい Hallowe'en(ハロウィン)の E-card をリリースしたとのメールが届いた。(メンバーになると新しい E-card が発表されるたびにメールをしてくれる)  E-cards はカードといっているが、 Flash で動くアニメーションである。余談ではあるが、このカラスはハシブトカラスだろう。
長い間 私の右サイトにボタンを置いている Season's Greeting を更新していなかったので、今回このハロウィンの E-card に置き換えた。最近作成された E-cards は、次の記述にあるように"back story"がついている。これもなかなか洒落ている。今回の "back story"は、scarecrow(かがし) について興味ある記述がつけられている。

Handy Tip!
Have you noticed how many of our recent cards include what we call a "back story" - a few extra pages of fascinating information about the subjects of the cards.
They're well worth exploring - recent cards have included hints on hunting for sunken(海底の) treasure, potted histories of the Blue Danube waltz and the Great Western Railway - and a story about hedgehogs!(ハリネズミ)

  提供されている E-cards は欧米圏の文化に基いており英語であり残念ながら年賀状はないが、誕生日・出産の祝い・結婚祝い・新築祝い・お見舞いなどもあるので年間1000円少しほど払って使ってみられたらいかがだろうか。(念のために言っておくが、私はこの jacquielawson のアフリエートをしているわけではない。) こういうものが容易く手にはいるようになったのも、インターネットの発展のおかげである。ネットの暗い部分ばかりに疑心暗鬼にならずに、sunny side を上手く活用すれば生活はもっと便利に潤いのあるものになるだろう。行動範囲の狭くなってきている私のような高齢者でも、パソコンの前に座ることによって若いときよりずっと世界が広がってきていると感じている。

2009年10月18日

隠居のパソコン備忘録:IE7 で新しいタブにウィンドウを開く方法(2)

 ブログなどで、関連URL をリンクして参照してもらうことが多い。その場合、私は本文とは別に新しいページを開いた方がいいのではないかと思う場合は、HTML コードの中でリンク先 URL の後ろに target="_blank" を指定している。
 (私のサイトの場合、DOCTYPE宣言は、よく分かっていないのだが、MovableType3.1 のものを使っており、
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 

となっている。これは、2000年1月26日のW3C勧告のようである。)
 IE7 では、新しいウィンドウではなくて新しいタブに開くこともできる。その方法については、先のエントリー(隠居のパソコン備忘録:IE7 でLink 先を新しいタブにWindow を開く方法)で記録している。

 W3C の最新のコード体系では、target="_blank" を使うことは推奨されていない。その理由はいろいろあるようだが、リンク先のページを別のウィンドウに開くかどうかは個人の選択に任されるべきで、強制的に新しいページに開くことはお節介だというのが主な理由である。

 最近、私が運営するサイトで、友人の「蝶の写真集」を新たに更新した。蝶の科と種によるリスト・テーブルを作り、科名をクリックすると該当科のテーブルにリンクし、種名をクリックするとその種が属する科のサムネイル・ページにある種の写真を集めたサムネイルがある個所に直接リンクするようにしている。
 科別ページそのものへのリンク HTMLコードは、以下のように書くとリンク先のページは新しいウィンドウか、新しいタブに開かれる。
<tr><td id="th1"><a href="http://home/studio_yamako/butterfly_ageha.html" target="_blank"><span style="color:#ffffff" >アゲハチョウ科</span></a></td>
<td id="th1"><a href="http://home/studio_yamako/butterfly_sirochou.html" target="_blank"><span style="color:#ffffff" >シロチョウ科</span></a></td>
<td id="th1"><a href="http://home/studio_yamako/butterfly_jyanome.html" target="_blank"><span style="color:#ffffff" >ジャノメチョウ科</span></a></td>
<td id="th1"><a href="http://home/studio_yamako/butterfly_sijimi.html" target="_blank"><span style="color:#ffffff" >シジミチョウ科</span></a></td></tr>

 種名をクリックするとその種が属する科のサムネイル・ページにある種の写真を集めたサムネイル個所に直接リンクする場合には、次のようにHTML コードを書けば、新しいページが開く。
リンク元
<a href="http://home/studio_yamako/butterfly_ageha.html#aosujiageha" target="_blank">アオスジアゲハ</a>
リンク先
<a name="aosujiageha">アオスジアゲハ</a>


 target="_blank" の使い方を調べるネットサーチで知ったことであるが、target="_blank" が指定されていないリンク先を新しいウィンドウで開くには、Shiftキーを押しながらクリックすれば良いことが分かった。
 それにヒントを得て、 Ctrl キーを押しながら、クリックすると新しいタブにウィンドウが開くことが分かった。この場合、「ツール」→インターネットオプション→「全般」→タブ→「設定」で 「新しいタブの作成時には常に新しいタブに移動する」 を選んでおくと新しいタブでウィンドウを開いてくれる。
 最新のW3C コードで作られたページの場合、target="_blank" を使っていないようである。たとえば、私のページ右メニューに置いている Amazon ボタンを単純クリックすると本文のページと入れ替わるように設計されている。これを上の方法でクリックすると新しいページに開くことができる。
 target="_blank" コードがある場合も、この方法は有効であるので、新しいウィンドウまたはタブにリンク先を開きたい場合は、ShiftキーまたはCtrl キーを押しながらクリックすることに慣れておくのがいいかもしれない。

2009年10月 7日

隠居のJazz:Live365 の Link Widget をブログに組み込む

 アメリカのWeb Radio サイト Live365 に、2007年2月から年金の小遣いを捻出して有料でインターネット・ラジオ放送局を開いている。このブログで何度も紹介しているRadio Senboku である。古いLP や CD 、eMusic からのダウンロードなど、いろいろな方法で収集した Jazz を10時間・100曲ぐらいの Playlist に編集して流している。更新は1ヶ月半に1回くらいの割合である。自分自身がパソコンなどの作業をするときの BGM が目的であるが、世界の20カ国ぐらいのJazz 好きが聴いてくれているようだ。

 先日、Live365 のホームページを見ていたら、ウェブページに貼り付けられる Link Widget が提供されていることが分かった。ブログのヘッダーにも、リンクボタンを置いているが、早速右メニューにRadio Senboku へアクセスするリンク・バナーを置いてみた。

 ここに表示されるプレイボタンをクリックすると、Live365 にユーザーとして登録(無料)していない人は登録を求められるが、既に登録している人は、 Radio Senboku につながり Jazz を聴くことができる。有料(月¥500ほど)であるが、VIP 登録するとコマーシャルなしで10,000 以上あるどの局でも連続的に聴くことができる。
 このリンク・バナーは、下のように現在流れている曲を収納しているCDジャケットが表示され、Artist と Track 名が出てくる。演奏を中止するには、バナーの上にカーソルを持っていくと現れるストップ・マークをクリックすればよい。
 その下に [Radio Senboku Playlist]ボタンを置いた。クリックすると、現在放送している曲の Excel リストが表示される。先日、「和泉の国ジャズストリート」で聴いたテナーサックス奏者 高橋知道さんの [Luis] というオリジナル曲(演奏も)も入れてみた。 Jazz が嫌いでなければ一度クリックしてみてください。ヘッダーのリンクボタンよりアクセスするより簡単です。

   

2009年4月 2日

隠居のHP:ページへのアクセス制限を .htaccess で設定する

 著作権の問題などで、以前にアクセス制限をかけたページを作成していた。
今回、公開したくないページを自分用につくりたかったので、以前に設定したときの方法を歳をとって衰えた記憶を頼りにたぐってみたが、細かい点までなかなか思い出せない。
再学習して新たにアクセス制限を設定したので、備忘録として記録しておきたい。
 今回参照させていただいたのは、ChamaNet というサイトが無償で提供しているベーシック認証である。詳細はこのページに詳しいが、記録はリンク切れになったときの用心のためである。

 アクセス制限は、.htaccess ファイル内に記述する。 .htaccess はMovable Type のバージョンアップにともないブログのURL を変更したときにも使った。詳しくは、<.htaccess で移転先URLページへ誘導する:MT4.1 >にアップしている。

 ページにアクセス制限をかける方法は、FTP を使い慣れておればそれほど時間はかからない。
Chamanet が提供してくれている次のようなテキスト・ファイルを Notepad かなにかで(私の場合は、秀丸を使っている)作成し、htaccess.txt とする。(FTP に FFFTP を使っている場合は、.htaccess というファイル名もOKである)
AuthUserFile /home/xxxxxx/n-shuhei.net/public_html/xxxxxxx/.htpasswd
AuthGroupFile /dev/null
AuthName "Input ID and Password."
AuthType Basic
require valid-user
<Files ~ "^.(htpasswd|htaccess)$">
    deny from all
</Files>

/home/xxxxxx/n-shuhei.net/public_html/xxxxxxx/ の部分はサーバーのルートディレクトリからアクセス制限をするディレクトリまでのフルパスである。

 .htpasswd は、ID(ユーザ名)とパスワードを:で区切った1行のファイルである。例えば、次のような表現になる。
nshuhei:KRQF6dfVUaeqo
パスワードは、base64 で暗号化されている。パスワードを base64 で暗号化するサービスは、上のベーシック認証のようないろいろなページで提供されている。
この .htpasswd ファイルをアクセス制限をしようとするディレクトリー(フォルダー)に、.htaccess ファイルとともに置けばよい。

 このような設定をしたあと、私がレンタルしているサーバーの Xserver を覗いてみると、ユティリティとして「アクセス制限」が提供されていることが判明した。自分が設定したフォルダー名一覧が表示され、フォルダー毎のアクセス制限の on off を切り替えるだけでアクセス制限を設定できる。この方法で上で設定したフォルダーのアクセス制限を on にして .htaccess ファイルの中味をみると 上述したコードが重複して書かれていた。
 レンタル・サーバーも、どんどん進化しているようである。このような作業をする場合には、先ず第一にレンタル・サーバーのユティリティを覗いてみる必要がある。

2009年3月31日

隠居のHP備忘録:mp3 streaming file(.wax) をウェブ・ページからリンクさせる

 レンタル・サーバーの容量に少し余裕があるので、自分用に Jazz 以外の mp3 ファイルをストリーミング化して、サーバー上におき、ウェブページからリンクボタンをクリックすると音楽流れるようにすることを試みた。
 もちろん、そのようなファイルを公開することは著作権に触れるので、そのファイルへは .htaccess を使って ID とパスワードがなければアクセス出来ないようにした。この方法については、別にエントリーを UP したい。

 以前に<MP3 のストリーミング・ファイルの作成>という記事をエントリーしているので、これを参考に同じようなストリーミング・ファイルを作成して試してみたが、うまく動かない。
 このとき、参考にさせてもらった英語のページがリンク切れになっている。それで新たにググッテいると、STREAMING MEDIA FILES ON THE WEB というページを見つけた。ここに示されている meta file (.wax) のコードは以前に使っていたコードと同じである。
<ASX VERSION="3.0"> 
      <Title>xyz</Title> 
      <ENTRY> 
      <REF HREF="http://www.example.com/xyz.wma" />
      </ENTRY> 
      </ASX> 
 だが、上手くいかない。以前に使っていた wax ファイルの中で、ひとつだけ動いてくれるファイルがある。よくよく見比べてみると、うまく動いてくれる wax ファイルは単純で<Title>xyz</Title> のタグがない。試しに、以前には動いていた wax ファイルから、<Title>xyz</Title> タグをはずしてみると動くようになった。どうやら、Webページの head 部分の <Title>abcdefg</Title> と競合しているためらしい。そこまでは分かったが、避ける方法が見つからないので、 wax ファイルから <Title>xyz</Title> タグをはずした。

  <Title>xyz</Title> をはずしても WindowsMediaPlayer では、曲名や Artist, 作曲者を表示してくれる。元となっている mp3 ファイルがそれらを属性として持っているためらしい。Title タグは是非とも必要ではないので、これで運用しようと思う。
 ただ、Internet Explorer、WindowsMediaPlayer という Microsoft の取り合わせでないと動作しない。

2009年3月19日

(続)LogMeIn で友人のPC をリモート操作する

 ときどき Logmein でヘルプ操作してい友人のたデスクトップ・パソコンが不調になったので、新しいパソコンに買い換えた。
 新しいパソコンは以前のWindowsXP から Vista に変わって、Internet Explorer(IE) 6 も IE7 にバージョンアップした。それで慣れていた操作が変化し、戸惑っている。IE7 のタブ機能など新しい機能がよくわからないという。それで、また Logmein でヘルプすることにした。

 彼の場合、以前に Logmein にアカウントを登録しているので同じEメールアドレスでは、全くの新規ユーザとして Logmein Free はインストールできないようだ。また、 Logmein にアカウントを持っている場合でバージョンアップなどをする場合は、前に紹介した順序(隠居、友人のPCを LogMeIn でリモート操作する)では上手くいかない。

 そのような場合のリインストール方法について、備忘録的に記録しておきたい。
  1. リモート操作先のパソコンに、LogMeIn が既にインストールされている場合は、これを削除する。
    削除は、一般的な方法で 「スタート」→「コントロール・パネル」→「プログラム・コントロール(Vista の場合)、プログラムの追加または削除(XP,2000の場合)」→「LogMeIn 」を見つけて、削除する」→コンピュータを再起動する。
  2. クリックすると大きくなります
  3. リモート操作先のパソコンから、LogMeIn のホームページにアクセスする。
    右上の入力Box に前に登録しているEメールアドレスとパスワードを入力して、ログインする。
  4. すると右のスクリーンショットのような「マイ・コンピュータ」画面が現れるので、右上のコンピュターを追加をクリックする。
  5. 次に出てくる「コンピュターの追加」画面で、 LogMeIn 製品は Free を選択する。
    すると自動的に LogMeIn Free のダウンロードが始まる。
  6. クリックすると大きくなりますクリックすると大きくなります
  7. ダウンロードの途中で、 LogMeIn への接続画面が現れる。利用規約条項への同意を求めてくるので、これに同意するとインストール・オプションの画面に変わるので、「標準」を選択して、「次へ」ボタンをクリックするとインストールするパソコンの名前を設定する画面が出てくる。
    ディフォールトでは、パソコンを設定したときにつけた名前が表示されているので、そのままで「次へ」ボタンをクリックすればよい。名前を変えたければ、好きな名前に変更できる。
  8. クリックすると大きくなります
  9. 次にコンピュータ・アクセスコードを設定する画面が、なぜか説明が英語で出てくる。
    友人のパソコンに導入しようとしたときに、この画面が出てこない場合があることが分かった。当然ながら、このアクセスコードがないとリモート操作をするパソコンとの接続ができない。
    FAQ にそのような場合の設定方法が掲載されていたので、後ほど記載する。その方法でアクセスコードを設定する前に、インストール終了しておく必要がある。
  10. 次にインストール先フォルダーを聞いてくるので、ディフォールトの C:¥Program Files¥LogMeIn¥で問題はないであろう。もちろんインストール・フォルダーを変更もできる。
  11. クリックすると大きな写真になります
  12. インストールが成功すると、LogMeIn へログインしたときのマイコンピュータ画面に先ほどのコンピュータ名(リモート操作先のコンピュータ名)が表示される。
  13. そこまでいくと、今度はリモート操作するコンピュータで、 LogMeIn にアクセスしてログインする。このときのログイン名は、リモート操作先(友人)のEメールアドレスとパスワードである。「LogMeIn」ボタンでログインするとリモート操作先(友人)のコンピュータ名が表示されるので、これをクリックし接続すると、アクセスコードを要求してくるので、聞いておいたコードを入力すると接続が確立される
    この場合、リモート操作先(友人)のパソコンもLogMeInが有効になっている必要がある。有効になっているかどうかは、画面右下のアプリケーション・アイコンの LogMeIn アイコンをダブルクリックすると確認できる。


コンピュータ・アクセスコードを設定する画面が出てこない場合の処置
  1. 「ファイル名を指定して実行」で control userpasswords2 と入力し、OKボタンをクリックする。
    「ファイル名を指定して実行」ボックスは、Vista の場合 「スタート」→「すべてのプログラム」→「アクセサリ」を開くと出てくる。XP の場合 「スタート」ボタンをクリックすると出てくる。
  2. クリックすると大きくなります
  3. OKボタンをクリックすると「ユーザ・アカウント」ポップアップ画面がでてくる。
    このコンピュータのユーザ ボックスにLogMeInRemoteUser が表示されていると思うので、これを選択して反転させると下の「パスワード・リセット」の表示が「 LogMeInRemoteUser のパスワード」となるので、これをクリックする。
  4. クリックすると出てくる空白の入力ボックスで、英数字 8 字以上のアクセスコードを新たに設定する。このアクセスコードをリモート操作する側が入力することになる。


 因みに、LogMeIn の「サポート」→「LogMeIn Free 」のFAQ に下のような記述がある。
What if I forgot the Access Code to my computer?
If you have forgotten the access code, or it is not working, you should change it. In order to do this, you should be physically sitting at the computer with LogMeIn installed. To change the access code, please go to Start, then Run and then type the following (if you are using Vista, go to Start > All Programs > Accessories > Run): control userpasswords2 (for Windows XP and Vista) or control userpasswords (for other versions of Windows) Then, click on LogMeInRemoteUser one time so that it is highlighted. You can then select Reset Password. If the access code still does not work, you may need to hit "More..." on the blue LogMeIn logon screen and enter the username as LogMeInRemoteUser. Also ensure that next to "Log on to," you choose "XXXX (this computer)," if the domain box appears.

2009年2月25日

隠居のパソコン備忘録:IE7 でLink 先を新しいタブにWindow を開く方法

 Internet Explorer 7 (IE7)になってから、「タブ」という新しい機能がついた。Mozilla Firefox 3 ではかなり前からこの機能がある。
 このタブは、一度開いた同じウィンドウに新しいウィンドウをひらくことができる機能である。
 MoZilla 系の Google Chrome は、新しいタブのURL入力ボックスは、検索ボックスも兼ねている。ブラウザーも覇権争いでどんどん進化する。

 ところが、このタブ機能がブラウザによって異なる動きをする。
 Firefox 3 では、HTMLコードでリンク先のページを新しいウィンドウに表示する指定が、以下のように target="_blank" という指定があると同じウィンドウに「Radio Senboku」という新しいウィンドウが開かれる。
 <a href="http://www.live365.com/stations/nshuhei" target="_blank">Radio Senboku</a>
 
クリックすると大きくなりますクリックすると大きくなりますTab_01.jpg ところが、IE7の初期設定では、また、右のスクリーンショット(左)のように新たにブラウザが開く。 
 ブラウザに「タブ」という新しい機能ができたから、HTML コードに新しいタブ・ウィンドウに表示させる target="_blank" というようなコードがないかとサーチしてみたが、ないようだ。
そのかわり、IE7 では初期の設定を変えることで、Firefox 3 と同じく、右のスクリーンショット(右)のように新しいタブ・ウィンドウに新しいページを開くことができることがわかった。


クリックすると大きくなりますクリックすると大きくなります IE7 の「ツール」→「インターネット・オプション」のポップアップ画面下にある「タブ」設定ボタンをクリックする。でてくるポップアップ画面で、右のスクリーンショットのように、
ポップアップの発生時は、「ポップアップを開く方法を InternetExplorer で自動的に判定する」を選択し、
他のプログラムのリンクを開く方法で「現在のウィンドウの新しいタブ」を選択しておくとよい。
 ここで表示しているようなポップアップ画面は、新しいタブの表示とはならない。

2009年2月23日

隠居の写真整理:Picasa Web Album

 前回は Picasa の操作について記録したので、Picasa が導入されていることを前提に Picasa を使ってネット上に仲間へ写真を公開する操作について記録しておきたい。写真を公開するためには、Google のアカウントを作成しておく必要がある。
 
  • Google のアカウント作成は、Google のいろいろな画面ででてくるが、ここではホームページの下部にある「写真管理」をクリックする例で記録しておきたい。
  • クリックすると大きくなります
    1.  クリックすると出てくる Picasa ウェブアルバムの画面で、「アカウントを作成」ボタンをクリックする。
    2. するとアカウントを作成するために右のような必要な項目の入力画面がでてくるので、指示通りに入力する。
    3. 入力が求められるキャプチャーの英字は判別しにくいようだが、一字一字確認すれば大丈夫である。失敗しても、再度やり直せば新しいキャプチャーが表示される。
    4. アカウント作成が上手くいくと早速「Picasa ウェブアルバムの使用開始」の画面が表示される。


  • ウェブアルバムに写真をアップロードするのは、すこぶる簡単である。
  • クリックすると大きくなります
    1. 先ず Picasa を起動 する。
    2. 左のフォルダー表示から、共有したい写真のあるフォルダーを選択し、サムネイルを表示する。そのフォルダーにある写真をすべて掲載(アップロード)する場合は、フォルダー名を反転させて(選択して)、画面下のツールアイコンのアップロードをクリックすればよい。写真を選択してアップロードする場合は、サムネイルから写真を選択してアップロード・アイコンをクリックすればよい。
    3. すると「ウエブアルバムにアップロード」というポップアップ画面が出るので、右上の新規ボタンをクリックする。すると右のような画面に変わるので、適切なアルバム名と説明を入力する。
    4. クリックすると大きくなります
    5. 「アップロードするサイズ」は推奨の1600ピクセルでよいのではないかと思う。元の写真がこれより小さいサイズの写真であれば、そのサイズでアップロードされるようだ。
    6. 「このアルバムの可視性」では「非公開」を選んで、アップロードボタンをクリックするとアップロードが始まる。
    7. Picasa の画面の右上にある「ウェブアルバム」をクリックすると、先ほどアップロードした写真の1枚目が表示されたアルバムが現れる。
      このときのブラウザーは、Firefox となる。
    8. アルバムを Google サーバーにフリーで置けるのは、1GB までのようである。
    9. クリックすると大きくなります
    10. このアルバムの写真をクリックするとアルバムのサムネイルがでて、スライドショーなどで全ての写真を見ることができたり、「編集」ボタンを選択すると写真の並べ替えができたり、アルバムのカバー写真を変えたりできる。




    11. クリックすると大きくなりますalbum_18.jpg
    12. このアルバムを仲間に見てもらうときは、「共有」タブをクリックすると右のようなメールの送信フォームがでるので、送信先のメールやメッセージを付け加えて送信すればよい。メールを受け取った側(受信者)は、「アルバム表示」をクリックすると送信したときと同じ画面があらわれる。極めて便利にできている。
    13. この画面の右にある「このアルバムへのリンク」をクリックすると、下にURL を表示するボックスが現れるので、この中味をコピーして仲間へのメールに貼り付けて、メールを送信することもできる。


 Google が提供するソフトはフリーだし、ファイルも Google で預かってくれるので便利ではあるが、なんとなく Google に取り込まれているような気がしないでもない。

2009年2月19日

隠居のパソコン:ファイル名を一括で変換する

 時として、同一フォルダー内にあるファイルの名前を一括して変更したいことが出てくる。
デジカメ写真のファイル名は、カメラが自動的にファイル名をつけてくれるから、全て同じような名前になってしまう。
例えば、Nikon D70 の場合、デフォールト設定では DSC_1555.JPG というようなファイル名になる。 フォルダー名を工夫したり、ファイルを「縮小版」で見るとか、Picasa で閲覧すれば写真の区分はそれほど難しくはないが、ブログに複数枚の写真を掲載したりするときは、日付を入れたり連番にしたりした方が処理がやりやすい。
また、ソフトによっては、拡張子が大文字 JPG では具合の悪いときもある。

 フォルダーでファイルを右クリックすれば、ひとつずつのファイル名の変更はできるが一括にはできない。
フリーの Renamin というソフトを使うと、簡単にファイル名を一括で変更できる。
このソフト、私が音ファイルの編集などで重宝している SoundEngine というソフトを発表している Cycle of 5th という札幌のチームが作ったものだ。

rename_1.JPG 上のような画像ファイルを Renamin の指示通りに入力し、「Rename 開始」ボタンをクリックすると一括変換してくれる。結果、下のようにファイル名が変換される。すこぶる簡単である。

rename_3.JPG

rename_2.JPG
 結果として、 DSC_1555.JPG というファイル名は、 090214_001.jpg となっている。

 

2009年2月16日

隠居のデジカメ写真整理:Picasa で取込・編集・送信する

 同窓会の写真や友人との旅行したときの写真、あるいは会食時に撮った写真を、プリントアウトするのはもちろんCD に焼いたりすることも面倒なので、Google が提供する写真管理サービスPicasa を使って Web 上にアルバムを作成し、それを見てもらうことにしている。それらの方法について同世代の老人(といっても失礼ではない歳と思うが)からよく質問されるので、自分の学習も含めて Picasa の操作方法をあまりパソコンが得意ではない同世代の人向けに整理してみたいと思う。

 最近は写真を撮るのはデジカメだから、整理は楽になっている。だが、ほとんどの人は購入したデジカメに付属してついてくる、そのメーカ固有のソフトを使って写真を整理しておられるようだ。

 たとえば、私のパソコンにも Canon ではZoomBrowser EX, Panasonic では Lumix Simple Viewer, Nikon では PictureProject といったソフトが入っている。ほとんどのソフトは、該当するメーカーのデジカメを USB 接続すれば自動的に立ち上がるようになっている。
これが便利なようでたちが悪い。カメラを変える毎に該当するソフトが立ち上がり勝手に保存するフォルダーを作成したりするので、その操作方法を覚えなければならない。歳とった頭ではいささか面倒くさい。

 そこで私はデジカメの写真の取り込みや整理・発信などは、Google がフリーで提供してくれている Picasa に特殊な場合を除いて統一している。Picasa は写真修整のできるフォトレタッチ機能も持っているので、写真管理のほとんどは Picasa ですんでしまう。Picasa の現在のバージョンは、Picasa 3 となっている。

 まずはじめに、Picasa を使った写真の取り込み・整理・編集から、記しておきたい。
 説明のスクリーンショットは、クリックすると大きく表示されます。screenshot_2screenshot_1
  1. Google のホームページ の下の方にあるサービス一覧にある写真管理ではなく、 サービス一覧>> をクリックすると表示される詳細の右列下方に、picasa があるのでこれをクリックすると Picasa3 ダウンロードボタンを表示する画面が出てくる。
    ダウンロードボタンクリックすると自動的にダウンロードが始まる。ただし、IntertExplorer の場合、セキュリティのため一時的にブロックする表示が出るが、ダウンロードを許可すると screenshot_1 のような画面がでてくるので、「実行」ボタンをクリックするとセキュリティ上の注意メッセージがでるが、これを「OK」とすると、ダウンロードが始まり、ライセンス契約書に同意を求めてくる。これに同意すると Picasa を保存するフォルダーを指定する画面がでるので、私の場合、"Program Files" フォルダーではなく、写真用のフォルダーの下にサブフォルダーを作って、そこに保存した。(screenshot_2)
    好みの問題であるが、"Program Files" フォルダーには知らない間にどんどんソフト・サブフォルダーができてしまい、あとで見つけるのに苦労することがあるからだ。
    私は、外付けのHDD も取り入れて写真を中心としたドライブ(D:)、音楽ファイルを中心としたドライブ(E:)というようにドライブを区分している。
  2. screenshot_3
  3. この画面の「インストール」ボタンをクリックするとインストールが始まり、セットアップが終わると screenshot_3 のような完了画面が出てくる。
    ここでは、デスクトップ画面にショートカットができているかどうかを確認するために、「Picasa を実行」のチェックをはずしているが、もちろんチェックをつけておいても問題はない。
    デスクトップ画面には、Picasa のアイコンができているはずである。
  4. screenshot_4
  5. このアイコンをクリックすると、screenshot_4 のようにパソコンに持っている写真(画像)のスキャンを問いかける画面が出てくる。
    マイピクチャーにしか写真を保存していない場合は下のボタンのチェックでよいが、いろいろなデスク(USB接続しているものも)のフォルダーに写真を保存している場合、上のボタンをチェックして「続行」ボタンをクリックする。


  6. このスキャンというのは、パソコンのどのデスクに・どのようなフォルダーに・どのような画像ファイルがあるかを探して、データーベースを作っている作業と考えれば理解しやすい。
    私の場合、音楽ファイルのデータベースは WindoesMediaPlayer であり、写真(画像)ファイルは Picasa ということになる。
    スキャンが完了するには、パソコンのスペックも影響すると思うが、写真の枚数が多いとかなりの時間がかかる。スキャンの途中で、「フォトビューアの設定」という画面が出てくると思うが、設定をしておけばエクスプローラなどで写真を表示するときに、私のブログで写真を表示するときに使っている lightbox のような表示(画像の背面が黒くフェードアウトする)がされる。ファイル形式の指定はデフォールトのままでいいであろう。
  7. screenshot_5
  8. スキャンが完了すると screenshot_5 のように、デフォールトでは撮影(作成)日付降順にフォルダーが表示される。写真ファイルが持っている日付データを読んでいるようだ。
    この表示をお馴染みのフォルダー構造に変えるには、画面上部にあるツールアイコンの左から4つめ「フォルダーのツリー階層が表示されるように表示を設定」をクリックするとが出てくる。
    一度スキャンを完了しておけば、あとは写真(画像)を追加するたびに、データベースに追加される。
  9. screenshot_6
  10. デジカメからの取り込みは、デジカメをパソコンにUSB接続(カードリーダーからのとりこみでも同じ)する。接続して電源をONにすると大抵の場合そのカメラに付属していたソフトが立ち上がるが、これをすべて終了させ、Picasa を立ち上げる。
    画面の左上のツール・アイコンの「インポート」→「デバイスの選択」でリムーバブル・ドライブをクリックするとデジカメにつながり、デジカメに保存されている写真のサムネイルが表示される。(screenshot_6)
  11. screenshot_7
  12. 取り込む写真を選択して(連続して選択する場合は Shift キーを、とびとびで選択する場合は Ctrl キーを押しながら)、その画面の左下にある「選択したアイテムをインポート」ボタンをクリックすると screenshot_7 のようにインポート先(保存先)を聞いてくる画面がでるので、「参照」ボタンをクリックして保存先メイン・フォルダーを選ぶ。一番上の入力欄「これらの写真のフォルダー名を入力してください。」に、新しいフォルダー名(私の場合、090215 というような日付にしている)を入力するとサブホルダーとなり、下の「写真の保存場所」に、フルパスが表示される。
    「終了」ボタンをクリックするとインポートがはじまり、保存されたフォルダーは左のフォルダーツリーの一番上部に表示される。
  13. screenshot_8
  14. 取り込んだ写真を編集(広い意味のレタッチ)するには、サムネイルで表示されている写真をダブルクリックすると screenshot_8 のように、左に編集する項目が表示されるので、編集したい項目を選択する。


    screenshot_10screenshot_9例えば、写真の切り抜きをするときには、
    1. 切り抜きボタンをクリックする。
    2. 切り抜きしたい部分の左上のポイントをクリックして、そのまま右下にドラッグして大きさを決める。
      このとき切り取ったあとの写真の縦横比を下の選択ボックスにある 10X15 しておけば、イチデジで撮った写真の縦横比となる。
    3. screenshot_10 は切り抜きをした後の写真である。このようにすれば、大きいサイズで写真を撮りトリミングすれば拡大した写真にすることもできるようである。

    写真にテキストを表示する場合には、screenshot_12 screenshot_11
    1. screenshot_8 の画面で「テキスト」ボタンをクリックする。
    2. すると右の screenshot_11 のような画面になるので、テキストのフォントや大きさ、色などを指定して、画面上のテキストを表示したい位置にカーソルを置き、文字を入力する。日本語の場合、画面の左下ボックスに文字変換が表示される。
    3. テキストの位置などはあとで修正できるのでいろいろと試してみるとおもしろい。

    I'm Feeling Lucky ボタンをクリックするとコントラストや明るさを自動調整してくれるので便利である。
    その他にもいろいろな修正ができるので、いろいろと試してみればいいと思う。

  15. 次に、画像のサイズを小さくする方法について記しておきたい。
    ほとんどの方は、デジカメで写真を撮るときのサイズはかなり大きく設定されている。私の場合、イチデジでは 3008X2000 ピクセル(約2.7MB )で撮っている。このくらいの大きさで撮っていると先に紹介した写真の切り抜き(サイズが小さくなる)に耐えられる。
    ただ、写真をそのままメールで送ると一度に送れるメールの容量が制限されている(Gmail の場合20MB )ので、サイズを小さくしておきたい。
    ブログに載せる写真などは、幅700 ~ 800 ピクセルでいいと思う。これだと写真にもよるが、200 KB 程度になると思う。
  16.  screenshot_13
    1. 私は、ブログに載せるために Picasa で写真のサイズを圧縮するときは、サムネイル表示画面の下にあるツール・アイコンで「エクスポート」を選んでいる。
    2. ブログに載せる写真をクリックして「エクスポート」アイコンをクリックすると、右の screenshot_13 ような画面が出てくるので、保存するフォルダーを指定して、「画像のサイズオプション」で「サイズの変更」を選択し、私の場合 800 ピクセルを指定している。この数字は、画像の横幅を指定しているので、縦長の写真では 600 ピクセルにする。
    3. 画質は元の画質を保存する「自動」で「OK」を押すと、新しいフォルダーに 800X600 ピクセルにリサイズした写真が保存される。エクスポートは、複数枚の写真でも一度に保存できる。
      リサイズした写真は元に戻せないので、オリジナルとは異なるフォルダーに保存するのがよいだろう。
    4. (追記:2009/2/19)新しく作成したフォルダーにあるファイル名は、Renamin というソフトを使えば、一括してファイル名を変更できる。

  17.  このように保存した写真を送信するときは、サムネイル画面で送信する写真を選択し(複数OKである)、サムネイル表示画面の下にあるツール・アイコンで「メール」を選べばよい。screenshot_14
    1. 「メール」アイコンをクリックすると、右のようなポップアップ画面( screenshot_14 )が出てくる。
      Google のアカウントがない方は、「アカウント作成」をクリックして作っておけば、Google が提供する他のサービス(Web Album や自分向けのポータル画面を作る iGoogle など)を利用するにも便利である。
    2. 私は、最近は専ら Gmail を使っているので Gmail をクリックすると Gmail のアカウントを入力する画面が出てくるので、これを入力し Gmail にログインする。2回目からは省略できるようだ。
    3. screenshot_15
    4. ログインするとようやく写真を貼付してメールを送信するフォームが出てくる。
      普通のメールと同じように、複数の宛先を指定できるし、表題も変えられる。
      送信文も変更挿入できるし、送付する写真のファイル名が出ているので、その横に説明を挿入すればより親切である。
    5. ただ、ひとつ落とし穴がある。「ツール」→「オプション」→「メールアドレス」→「出力オプション」で、「元のサイズ」を事前に選択しておかないと、初期設定では 460x380 ピクセルぐらいになっているので、折角リサイズしておいても、460x380 ピクセルで送信されるので気をつけたい。
      元の大きなファイルからリサイズせずにメールをするときは、上の「出力オプション」で、たとえば 800 ピクセルを事前に選択しておくと、送信するファイル(写真)はリサイズして送信される。
    6. なお、ⅰで記したメールプログラムの設定もこのポップアップ画面で設定できる。
    7.  

  18. その他にも、Picasa には数多くの機能がある。
    このうち、写真を仲間内で共有する方法(ウェブアルバム)については、別の機会に記録しておきたいとおもう。


 この記録をまとめることで、今まで知らなかった Picasa の新しい機能を発見したり、進化していることを学習した。
ブログを書くことは、よい学習の機会である。

2009年1月 7日

PCにある音楽ファイルのデーターベース:WindowsMediaPlayer Library

 昨年12月になってから、Jazz のコレクション方法を変えた。
 今までは、曲名を検索対象にして、主に eMusic でヒットしたファイルをダウンロードしてきた。
 それを Artist を検索対象にすることにした。そろそろ思いつく曲名も払底したきたことと、やっぱり Jazz の面白さは、どのような Artist がどのような improvisation で演奏するかにあると思うからである。

 ただ、闇雲に思いつく Artist で検索することはやめて、「後藤雅洋」といジャズ喫茶のおやじの著書『新ジャズの名演・名盤』にでてくる Artist を頼りに集めることにした。生半可な Jazz の知識よりも、プロの先達を尊重したいと思う。
 このように収集方法を変えると、兄貴がくれた結果として形見になった古い LP や自分が買っていた CD もファイル収集の対象となってくる。

 どんどん発展している IT 技術は、このような収集方法に非常に役に立つ。
 まず、以前にも記録したが LP を MP3 ファイルにすることが非常に容易になった。
 音楽CDの MP3 ファイル化はもっと簡単である。Windows Media Player(WMP) の 音楽CDからの「取り込み」を利用するか、Roxio の Easy Media Creator 10 suite に入っている CDリッピングを使えば簡単である。
 最近になって分かったことであるが、CDリッピングの方がファイル名などの認識は正確なようである。WMPは、CDDBにAMG(All Music Guide) を使っており、CDリッピングは Gracenote というDBを使っているらしい。

 お恥ずかしい話であるが、最近になって、WMP V11 の Library は、収集した MP3 ファイルのアーカイブ・データベースとしての機能を持っていることを知った。(Roxio の Easy Media Creator 10 suite にも 「JukeBox ディスクを作成」に同様の機能を持っている)
 この機能を使う方法は、以下の通りである。
クリックすると大きくなります
  1. WMP を「表示」→「フルモード」で開くと右の screenshot のような画面になる。 


  2. 「ライブラリ」タブをクリックすると出てくるプルダウンメニューから「音楽」をクリックしたときが、右の screenshot である。




  3. クリックすると大きくなります
  4. このとき F3 キーを叩くか、「ライブラリ」タブをクリックすると出てくるプルダウンメニューから「ライブラリに追加」をクリックすると、右の ポップアップ・ウインドウが出てくる。






  5. クリックすると大きくなります
  6. 監視するフォルダに「自分の個人用フォルダ」にチェックを入れ、具体的な「監視するフォルダ」リストで 音楽ファイル(MP3 ファイル)を収納しているドライブのフォルダ(親のフォルダで良い)を指定して、データベース化するフォルダを追加してOK ボタンを押すと、それらのフォルダーに収納されているファイルが取り込まれる。
     私の場合、このエントリーを書いている時点で 9143 ファイルが確認された。一応DVD にバックアップはとっているが、ディスクが安くなっているので外付けのHDD などにファイルをそのまま置いている。その方が、このようなデータベースを利用するには便利である。
  7. クリックすると大きくなります
  8. このデータベースとしてのライブラリに収納されるファイルは、右の screenshot で表示されているような属性を持っている。ただし、音楽ファイルが持つ属性は、次の6つである。
    • タイトル (曲名)
    • アルバム (曲が表示されるアルバムの名前)
    • アルバム アーティスト (アルバムに関連する主要アーティストの名前)
    • 参加アーティスト (曲を演奏したアーティストの名前)
    • ジャンル (音楽の種類)
    • 評価 (ユーザーやデータ プロバイダが曲を評価した星の数)

     ファイルのこの属性を、WMP はインターネットを通じて自動的に補う機能を持っている。WMP の「ツール」→「オプション」→「ライブラリ」タグで開く画面下部の[ファイルのメディア情報の自動更新] 領域で [インターネットから追加情報を取得する] チェック ボックスがオンになっておれば自動的に補完される。ただし、その下の、[不足している情報のみを追加する] を選択しておかないと自分で編集した部分が全て書き換えられそうだ。
     Jazz の分類には、『新ジャズの名演・名盤』で採用されているように、メインとなる楽器があった方がよい。このような情報項目を増やすには、「ジャンル」の属性を Jazz(sax) とでもして編集すればよい。
  9. 編集の方法などについては、WMP のヘルプにある「デジタル メディア コレクションを整理する」に詳しく書いてある。


 この WMP のライブラリ機能を使って、今まで収集してきたファイルを整理していき、Radio Senboku の playlist 作成などに応用していくつもりである。

ジャズの名演・名盤
ジャズの名演・名盤 (講談社現代新書)
後藤 雅洋
講談社
売り上げランキング: 75081
おすすめ度の平均: 4.0
1 著者は、権威を否定しているようだが、実は権威が大好きなのでは?
5 ジャズ喫茶のおやじの蘊蓄が満載
5 この本からジャズの高峰を目指すべし。
5 初心者に最適の入門書です。


2008年11月10日

隠居のブログ備忘録:MovableType4.1 での Captcha 設定

 スパム・コメント対策のために、MovableType(MT)3.3 の時には Scode というランダムに発生させた6桁の数字をいれないとコメントできない仕様にしていた。
 MT4.1 にバージョンアップして、この Scode プラグインが使えなくなった。MT4 以降になって、Captcha がデフォールトで取り入れられたためかもしれない。

 しかし、これを機能させるためには、サーバーに Image::Magic という CGI スクリプトがインストールされている必要がある。私がブログを置いているレンタル・サーバー Xserver には当初見あたらなかったので、他のプラグイン(reCaptcha)を試してみたが上手くいかなかった。仕方なく、MovableType か TypeKey に登録してもらうことを推奨して認証できる方のみがコメントできるようにしていた。

 最近になって、ブログにあまり詳しくない友人からコメントをいただくことがでてきたので、再度MovableType 既定の Cpatcha の利用を調べてみると、Xserver に Image::Magic がインストールされていることが判明した。MT4 のガイドに従って、Captcha を active にしてみるとすんなりと機能するようになったので、手順について備忘録として記録しておきたい。

  1. 環境:Windows XP, Vista
       MovableType 4.1
       レンタル・サーバー:Xserver
       テンプレート・セット:「小粋空間」
  2. http://userdomain/cgi/mt/mt-check.cgi で、 Image::Magic がインストールされていることを確認する。
    「確認中: オプションモジュール」の項に「サーバーに Image::Magick がインストールされています(バージョン 6.0.7)。」とある。
  3. クリックすると大きくなりますNinsho_1.jpgMovableType 4 のドキュメント「コメントに CAPTCHA 認証を利用する」のガイドに従って、「ブログの設定: 登録 / 認証設定」を行う。
     右のスクリーンショットのように、該当ブログ管理画面→設定→ブログの設定→登録/認証 で「認証なしコメントにチェック」、私の場合「メールアドレスを要求」にもチェックをいれた。
    なお、MovableType または TypeKey の認証はそのままコメントが表示されるようにしている。
  4. 同じブログの設定→コメント で「コメントポリシー」→「即時公開する条件」 で「認証サービスで認証されたコメント投稿者のみ」にチェックをいれ、「表示オプション」→「CAPTCHAプロバイダ」 で「MovableType 既定」を選択している。
  5. 「テンプレートモジュール」の「コメント入力フォーム」でコメントをいただくときの注意事項をいささかくどいと思ったが、挿入した。


 MT4.1 での CAPTCHA の設定は、以上のように非常に簡単である。ネットサーチをしてみると MT4.0 ではいろいろとトラブルがあったようであるが、MT 4.1 では解消されている。先人に感謝しなければならない。

  

2008年11月 3日

隠居、MovieMaker でデジカメ AVI ファイルを編集してブログに載せてみる

 最近手にいれた Canon IXY900IS は、このごろのコンデジには普通になっている動画が撮れる機能がついている。この機能を使って簡単な動画を編集し、ブログMT4.1 にエントリーしたので記録として残しておきたい。

 メタボ管理のために最近始めた早朝ウォーキングはただ歩くだけではつまらないので、このコンデジを小さなウエストポーチに入れていき、新しい発見を記録することにした。
 泉北ニュータウンに30年以上住んでいるのに東西南北がいまだによくわからないが、自宅を中心にして、往復1時間~2時間、歩数計にして 6,000--10,000 歩ほど、なるべく車が走らない道を選んで歩くと、今まで気づかなかった新しい発見が待っている。

 川がそちらの方向に流れているので、阪神間で育った人間にはとても北とはおもえないが、今まであまり歩いたことのない北部を歩いてみることにした。ニュータウンができる前からの地元で、小さな田畑や建設会社の資材置き場や工場などが散在しているゴミゴミしているところという印象であった。それに比べれば、ニュータウンは公園・緑道が整備され草刈りや樹木の剪定など税金が沢山使われている。ちょっと本題から離れた。

 この泉北ニュータウンの北部地域には、昔からのため池がたくさんあるようだ。その中でも大きな「小田之池」に農家(?)の間の細い道を辿っていくと、なんと水鳥が群れている。 動画を試してみることにした。Canon IXY900IS を取り出し、モードダイヤルを動画に設定して、池の中央あたりに群れている水鳥にズームした。コンデジの動画撮影は、ほとんどがカメラ任せである。

 自宅PCで、動画ファイルの拡張子を確認すると AVI ファイルになっている。写真(jpg ファイル)のPCへの取り込みは、カメラ購入時に付属しているソフトは使わずに、Google の Picasa でしているが、 AVI ファイルを取り込む機能はない。そこで、「マイコンピュータ」でフォルダー表示を行い、USB接続でつないだカメラのフォルダーに表示される AVI ファイルをPC のディスクにコピーして取り込んだ。
 avi ファイルは、Windows Media Player で再生できる。ただ単純にこのファイルをブログにUPするだけではつまらないので、タイトルをつけるなどの編集をすることにした。

 「 AVI ファイルの編集」でググッて見るとたくさんヒットするが、検索結果の一番に表示される "動画編集 ソフト - k本的に無料ソフト・フリーソフト"に多くの動画ファイル編集ソフトが紹介されている。そのなかの、WindowsXP に付属するMicrosoft の「Windows ムービー メーカー」で編集することにした。この MovieMaker というソフトは、Program Files → Movie Maker フォルダーの中にある moviemk.exe を実行すれば起動できる。

 先のエントリーにも紹介した題材をもとに左のような動画を作成した経験をメモしておきたい。初めての経験なので、多分もっと良い方法があったり多彩な編集ができたりすると思うが、今後経験を積んでいけば書き加えていきたい。
 画像をクリックするとWindows Media Player が立ちあがり、ファイルがダウンロードされるはずである。ファイルは 10MB ほどあるのでダウンロードに少し時間がかかる。
 これを再生するには、Windows Media Player の「ツール」→「オプション」→「ファイルの種類」で、Windows Media ビデオファイル(wmv) にチェックが入っている必要がある。
クリックすると大きくなります
  1. moviemk.exe を実行すると右の screenshot のような画面になるので、ツールアイコンの「作業」をon状態にする。画面の下部の作業ウインドウのツールバーの右端が「ストーリーボードの表示」となっておれば、それをクリックすすると screenshot のような画面になる。この画面の上部は、新しいビデオを編集するための素材を提供し、下部はそれらを利用して新しいビデオを作成する画面と考えると分かりやすい。
  2. 上部3分割画面の左欄「ムービー作業」の 「1.ビデオの取り込み」 「ビデオの読み込み」 をクリックすると読み込むファイルを指定するポップアップ画面がでるので、デジカメからコピーしたAVI ファイルを指定し、「読み込み」ボタンを押す。読み込んだファイルは、中央の作業画面に表示される。異なるファイルを異なるフォルダーから読み込むと新しい画面に表示され、個々に異なる「コレクション」ファイルとして保存される。コレクションとは編集するためのライブラリーと考えればいいだろう。上部ツールアイコンの「コレクション」をクリックすると上部3分割画面の左欄に表示される。コレクションのひとつをクリックすれば、それに付随するファイルが上部3分割画面の中央部に表示される。なお、読み込んだファイルは「クリップ」と呼ばれる。
  3. クリックすると大きな写真になります
  4. 撮影してきたAVI ファイル(クリップ)が長かったので、半分程度をトリミングして短くすることにした。
    トリミングを行うには、作業ウインドウのツールバーの右端アイコン「タイムラインの表示」をクリックする。表示は「ストーリーボードの表示」となる。
    コレクションからトリミングするファイルを選択し、作業画面にドラッグする。
    トリミング部分はクリップの開始部分からか終了部分からかのどちらかからしか指定できない。screenshot のようなマークがでるので、トリミングする部分までドラッグする。中間をトリミングするには、はじめにクリップの分割が必要である。分割の方法については割愛するが、ヘルプを見れば分かる。
  5. クリックすると大きくなりますクリックすると大きくなります
  6. 次にクリップを連結した。クリップを連結するには、連結するクリップがあるコレクションを開き、連結するクリップを連結する位置にドラッグする。ドラッグするとストーリーボードは右の screenshot のように表示され、再生ボタンをクリックすると2つのクリップが連続して再生される。
  7. このままでは愛想がないので、タイトルや効果を入れることにした。
    1. クリックすると大きくなります画面上部のツールアイコンで「作業」を選択する。
    2. ムービー作業欄の「 2. ムービーの編集」→「タイトルまたはクレジットの作成」をクリックするとタイトルを入れる場所を聞いてくるので、この場合、「タイムラインで選択したクリップにタイトルを追加する」を選んだ。
    3. するとタイトルを入力する画面が現れるので、タイトルを入力する。
    4. クリックすると大きくなります
    5. 下の「詳細オプション」→「タイトル・アニメーションを変更する」をクリックするとタイトルの表示方法(アニメーション)やタイトルの字の大きさや色などを変更することができる。ここでは、アニメーションを変更で「新聞」を選んだ。「終了、タイトルをムービーに追加する」をクリックしてセーブするとクリップの頭に取り込まれる。アニメーション「新聞」では、字の大きさや色などを変更することはできないようだ。
    6. クリックすると大きくなります
    7. クリップのつなぎ目をすこし格好良くするには、下部のビデオ編集を「ストーリーボードの表示」にして、「作業」画面→「ムービーの編集」→「ビデオ切り替え効果の表示」をクリックすると出てくるビデオ切り替え効果から好みのものをクリップのつなぎ目にドラッグすればよい。



    8. クリックすると大きくなります
    9. 編集したムービーの最後に、撮影日・場所などを表示する画面(クレジットと言われる)を追加することができる。
      クレジットの作成は、ムービー作業欄の「 2. ムービーの編集」→「タイトルまたはクレジットの作成」をクリックすると出てくるポップアップ画面で、「ムービーの最後にクレジットを追加する。」を選択する。
      入力画面が出てくるので、表示したい情報を入力し、「終了、タイトルをムービーに追加する」をクリックしてセーブすればよい。
    10. クリックすると大きくなります
    11. BGM として何か音楽を流したい場合には、BGM にする曲(mp3でOK)を「ムービー作業」→「ビデオの取り込み」→「オーディオまたは音楽の読み込み」で表示されるポップアップ画面でファイルを指定し、「取り込み」をクリックすると、開いているコレクションに読み込まれる。
      このファイルをタイムライン画面にある「オーディオ/音楽」欄にドラッグすればよい。
      BGM とするファイルは、あらかじめ Sound Engine をつかって、ムービーの長さにトリミングしたり、フェードイン・フェードアウトをほどこしておいた。
  8. これらの作業は「プロジェクト」と呼ばれ、作業途中でも「ファイル」→「名前をつけてプロジェクトを保存」すれば、あとで続けることができる。
  9. 作成したムービーは、作業画面の「ムービーの完了」→「コンピュータに保存」でブログにアップできるファイルを保存できる。保存後のファイルの拡張子は、wmv となる。


 このエントリーを投稿するには、ずいぶん時間を要した。初めての経験を確認しながら、再度作業をし、screenshot などを用意したためである。
 このようにして記録しておかないと老人のぼけた頭ではすぐに再現できないし、記録にすることで復習することができる。

2008年9月21日

隠居のMT備忘録:lightbox 2.0 の背景 overlay が黒くならない

 lightbox 2.0 の最新バージョン 2.04 の導入は失敗した。導入の手順を間違ったものと思うが、サイトそのものにアクセスできないという致命的な障害がでるので、すぐに元のバージョン 2.03 に戻した。

 そのときのドサクサにまぎれてテンプレートなどをいじったせいか、次の条件のときに、画像が現れるポップアップ画面の背景 overlay が黒くならないという現象がでた。
  • Windows XP SP2
  • Internet Explorer 7
  • MovableType 4.1 テンプレート:小粋空間:two-column-liquid-right メインページ
 アーカイブページやWindowsVista Mozilla(Firefox) では起こらない。
 上記は私の環境で、それ以外については確認していない。

 lightbox2.0 のページの support では、overlay については次の説明がある。

The shadow overlay doesn't stretch to cover full browser window.
Remove the default margin and padding from the body tag. Add body{ margin: 0; padding: 0; } to your stylesheet.

 スタイルシートでは、この設定は既に以下のようになっており、問題はなさそうである。
/* すべて */
* {
    margin: 0;
    padding: 0;
    font-family: Verdana, Arial, sans-serif;
    word-break: normal;
    line-break: strict;
}


 ネットサーチもしてみたが、的確な示唆はヒットしなかった。見当はずれであるが、「小粋空間」さんの「Lightbox JS の Movable Type での不具合を修正する」のエントリーに、コメントとして質問を投げかけてみた。親切に以下のような返事をいただいたが、結局原因不明である。
>n_shuheiさん
こんばんは。ご返事遅くなってすいません。
事象は確認できましたが、現在のところ原因不明です。

もし何か分かりましたら別途エントリーしたいと思います。
それではよろしくお願い致します。


 アクセス解析サービスの Artisan の分析では、私のサイトへの訪問者は、WindowsXP IE6/7 でのアクセスが最も多いから、早く修復したいと思ったが方途がない。

 運営している友人の2つのブログのひとつを見ていると、なんと上の条件でも、lightbox で拡大画像表示されるポップアップ画像の背景overlay が黒くなっていることが分かった。いじっているうちに偶然うまくいっていたらしい。

 このブログも同じ小粋空間:two-column-liquid-right のテンプレートを使っているので、lightbox 表示に関連していると思われるテンプレートモジュールの「ヘッダー」を子細に見てみると、正常に表示されるブログのテンプレートの<div> タグを閉じる </div> タグがひとつ少ないことを見つけた。
 どうやら、テンプレートモジュールの「ヘッダー」で<div> タグを閉じる </div> タグを余計にひとつつけたことが原因らしく思われた。テンプレートの構成上テンプレートモジュールの「ヘッダー」の<div> タグのひとつは、テンプレートモジュールの「フッター」で閉じられることになっていたのだ。

 「ヘッダー」の余計な </div> タグを削除すると上手く背景overlay が黒くなった。原因は、まったくそのせいと思っていたが、再現性を確認するために、「ヘッダー」テンプレートに余計な </div> タグをつけても、背景overlay は黒くなる。再現性はないのだ。
 どうやら修復は不可逆性だったようで釈然としないのだが、うまく表示されるようになっているので、まあ、いいか という気分である。
 ブラウザーに依存する障害は、いつもよく分からない。

2008年9月 2日

野鳥の写真集を変更しました

 野鳥の写真サムネイルは、Kinarie&May さんの Flash MT用のフォトサムネイラーを使ってきた。このプラグインは、エントリーのカテゴリー(例えば birds )ごとに掲載されている写真をサムネイル化してくれる。

 非常に有用であるが、欠点は各エントリーに掲載されている1枚の写真かすべての写真を選択してサムネイルすることである。私のように、一つのエントリーにいろいろな写真をのせていると雑音の多い野鳥の写真サムネイルができてしまう。
 それとサムネイル化するファイルの拡張子は、小文字の jpg でなければなければならない。大文字の JPG ファイルも結構あり、修正するのは大変である。
 それで、DIY作品集のようにテーブルを利用して web page 作ることにした。

 ひとつづつのセルに写真ファイルを納めていくことは時間のかかる作業であるが、プラグインの lightbox が使えたり、録音したさえずりを再生するプレイ・ボタン を設置できたりするので自由度が高い。

 右サイドメニューに置いていた「野鳥の写真サムネイル」ボタンのリンク先を作った写真集へ付け替えた。興味のある方は、一度覗いてみてください。

 野鳥ばかり追っかけている人のブログなどに出てくる写真と比較すると余りにもお粗末であるが、それぞれの写真のリンクをたどるとその写真を撮ったTPO が分かるので懐かしい。 早い時期にデジスコの体制を整えて、もう少しましな写真集に撮りたいと思っている。 

2008年8月24日

隠居のBlog備忘録: MT4.1 で エントリー部分のみを印刷する

 友人から、ブログのヘッダー部分や右サイドメニューを外して、エントリー部分のみを印刷できないかの質問を受けた。確かに、ヘッダー部分や右サイドメニューが印刷されるのは少々うっとうしい。

 方法をググッテみるといつもテンプレートを使わせてもらっている「小粋空間」さんに、「印刷用スタイルシート」というカストマイズがあることが分かった。このカスタマイズは、印刷をするときには、スタイルシートを切り替える仕様になっている。MT4.1、「小粋空間」さんのテンプレート(layout-two-column-liquid-right )の私のブログ環境に導入してみたので備忘録として書き留めておきたい。
 
  1. 印刷用スタイルシート追加を追加する。
     管理画面のデザイン→テンプレート→インデックス・テンプレートの表示で「インデックステンプレートを作成」クリックして、以下のように新しいインデックス・テンプレートを作成する。
    • テンプレートの名前:ForPrinting(なんでもよい)
    • 出力ファイル名:print.css
    • 再構築オプション:チェックを外す
    • このテンプレートにリンクするファイル:(空白)
    • テンプレートの中身:スタイルシート(styles-site.css)の中身を丸ごとコピー
  2. 印刷用スタイルシートの修正
    コピーしたスタイルシートで本体のヘッド部分と右サイドメニューが印刷プレビューで表示されないように、該当スタイルのID属性、クラス属性をいじった。
     私の場合、具体的にはスタイルシートの次の項目を青字で書いた部分を付加した。
    #header 
        {
         /* padding: 15px;
        border-bottom: 1px solid #669;
        color: #999;
        background-image: url("http://n-huhei.net/Libraly/Image/Wood_ipe_01.gif");   
        background: #8fabbe; 
       text-align: left;     */
       display: none;
    }
    
    #links-left-box dl,
    #links-right-box dl {
      /*  margin: 0;
        padding: 0;   */
          display: none;
        }
    
    /* 2カラムリキッドレイアウト(右サイドバー) */
    .layout-two-column-liquid-right #content {
        /* margin: 0 250px 10px 0px;  */
        margin: 0 10px 0px;    
       /* border-bottom: 1px solid #669;
        border-right: 1px solid #669;
        background-color: #ffffff;  */
        border-style: none; 
    }

  3. テンプレートに link 要素追加
     次に、モジュールテンプレートの「ヘッダー」 <head> 部にあるスタイルシートを呼び出している部分を次の青字部分を追加した。
    実際には、この部分を先に付加しておいて、ブログのエントリーを表示し、ブラウザーのツールバー「ファイル」→「印刷プレビュー」で確認しながら print.css をいじる試行錯誤をした。
    
       <link rel="stylesheet" href="<$MTLink template="スタイルシート"$>" type="text/css" media="screen,tv" />
       <link rel="stylesheet" href="<$MTBlogURL$>print.css" type="text/css" media="print" />


  4. カスタマイズの結果
    ForPrintCSS.jpgForPrintCSS_2.jpg 左のスクリーンショットは、このカスタマイズをしていない場合とカスタマイズした後との印刷画面の比較である。
     カスタマイズした後は、ヘッダーと右サイドメニューが印刷画面に出てこないので、エントリー部分のみを印刷できる。




2008年8月18日

隠居のBlog備忘録:MT4.1 での lightbox による画像の挿入を簡略化する

 最近、友人の海外旅行の写真集をブログ Studio YAMAKO に作成していることもあって、画像の挿入する機会が増えた。MT4.1 で写真を掲載することは、MT3.3 のときに比べれば少し楽になっているが、まだいろいろと操作をしなければならない。

 私の場合、写真はブログ本文にサムネイルを掲載し、これをクリックすれば画面全体がブラックアウトして、ポップアップ的に原寸の写真が表示される lightbox というプラグインを使用しているので、その分も操作が多い。そこで、私の知識でもう少し手を抜くことはできないかググッテみた。

 MT4.1 で画像の挿入操作をしたときに自動的に貼り付けてくれるHTMLコードは下のようなコードである。
<form mt:asset-id="227" class="mt-enclosure mt-enclosure-image" style="display: inline;">
<a href="http://n-shuhei.net/studio_yamako/xxxxxx/080818_001.jpg">
<img alt="080818_001.jpg" src="http://n-shuhei.net/studio_yamako/xxxxxx/080818_001-thumb-200x132.jpg" width="200" height="132" class="mt-image-right" style="float: right; margin:  0 0 20px 20px;" /></a></form>

今までは作成してくれたコードを、次の青字のように数カ所属性を追加したり、手を加えたりしていた。
<form mt:asset-id="227" class="mt-enclosure mt-enclosure-image" style="display: inline;">
<a href="http://n-shuhei.net/studio_yamako/xxxxxx/080818_001.jpg" title="ABC" rel="lightbox[aa]">
<img alt="クリックすると大きな写真になります" src="http://n-shuhei.net/studio_yamako/xxxxxx/080818_001-thumb-200x132.jpg" width="200" height="132" class="mt-image-right" style="float: right; margin: 5px;" /></a></form>


 このように手を加えることは挿入する写真が多くなると結構な手間になる。
 「モバイルタイプ備忘録」の関連ページなどを参考に、perl なんてこれから晩学するつもりで全く分からないが、画像の挿入時に使われるソース・プログラムを覗いて、「秀丸」でいじってみた。
 ソース・プログラムは、/cgi/mt/lib/MT/Asset フォルダーにある Image.pm である。この320行目あたりにある行を青字のように変えた。
# '<a href="%s"><img alt="%s" src="%s" %s %s /></a>',
'<a href="%s" title="" rel="lightbox[]"><img alt="%s" src="%s" %s %s /></a>'

 私の場合、lightbox は 2.0 を使っているので、グループ表示のための [] とキャプション挿入の title="" を付け加えた。日本語文字列の「クリックすると大きな写真になります」を入れようとしたが、これは上手くいかなかった。 perl の勉強が必要のようだ。この挿入は、「だい」→「クリックすると大きな写真になります」とIME に単語登録して簡単化することにした。
 初期値では、サムネイル写真を表示するボックスの周囲に余白を作る style の margin が私の場合適切ではないので、この部分も先ほどのソース・プログラムで見つけて(279・282行目あたり)、次のように改定すると上手くいった。
# ' $wrap_style .= q{style="float: left; margin: 0 20px 20px 0;"};
    $wrap_style .= q{style="float: left; margin: 5px;"};

# ' $wrap_style .= q{style="float: right; margin: 0 0 20px 20px;"};
 ' $wrap_style .= q{style="float: right; margin: 5px;"};

 ソース・プログラムが少しいじれるようになったので、ブログつくりも面白みが増えたが、リスクとは隣り合わせのようだ。しっかりとバックアップをとってからいじるようにしたいと思う。それにしても、学習しなければならないことが多いので、もうちょっとの間はボケの進行が止まっていて欲しいと祈念している。

2008年8月16日

MT4.1 での迷惑トラックバックの阻止:asciiTBPingfilter

 MT3.3 のときに、JunkTrackbacks の絨毯爆撃に悩まされて、「小粋空間」さんの ASCII TBPing Filter というプラグインを入れて阻止したことをエントリーしている。

クリックすると大きくなります MT4.1 では、MT3.3 のときに「迷惑トラックバック」にフィルタリングされていた spam trackback は、screenshot のように「スパム指定されているトラックバック」としてフィルタリングされてあまり気にとめていなかったが、開いてみると英語のSpam TB が1000 以上溜まっていた。JunkTrackbacks の絨毯爆撃は相変わらず続いていたのだ。

 それで、MT4.1 での迷惑トラックバックの阻止の方法を探ってみた。ヒントを得るために、上記の「小粋空間」さんの ASCII TBPing Filter というプラグインを訪ねてみると、"asciiTBPingfilter.zip(MT4.x用)" が用意されていた。早速、このプラグインを導入した。
 導入は、すこぶる簡単である。上のファイルをダウンロードして解凍して出てくるフォルダー asciiTBPingfilter を Movable Type の plugins ディレクトリにアップロードするだけである。
 「システム・メニュー」→「プラグイン」で "ASCII TBPing Filter Plugin 2.0" が表示されれば(多分一番上に) OK である。これをクリックすると
ASCII 文字のみのトラックバックをフィルタリング(スパムとしても保存しない)
との説明がある。

クリックすると大きくなります 各ブログの「設定」→「プラグイン」でも "ASCII TBPing Filter Plugin 2.0" が表示されている。ここの「設定」ボタンで「フィルタリングされたトラックバックをログに出力する」にチェックをいれると screenshot のように、フィルタリングされたトラックバックがリスト表示される。 JunkTrackbacks の絨毯爆撃は相変わらず続いているようだ。
 チェックを外せば、ログも表示されなくなる。




2008年8月 3日

隠居のお勉強:JavaScript(13) onerror

 梅雨明けから酷暑の日が続き、屋外での活動はほとんどできない。特に、ここ大阪堺市は全国的に見ても暑い都市で連日最高気温が35℃を超えている。老齢を自覚して、クーラーの効いた部屋で過ごすようにしている。

 幸いウェブを開いておれば退屈することはない。JavaScript の学習がおろそかになっていたので、例によって W3Schools の tutorial で再開することにした。今回は、前回に続いてエラー処理の script である。

 onerror イベントハンドラーは、エラーをキャッチしてメッセージを出す古くからの標準的な方法である。

 次はその使い方サンプルである。
<html>
<head>
<script type="text/javascript">
onerror=handleErr;
var txt="";

function handleErr(msg,url,l)
{
txt="There was an error on this page.\n\n";
txt+="Error: " + msg + "\n";
txt+="URL: " + url + "\n";
txt+="Line: " + l + "\n\n";
txt+="Click OK to continue.\n\n";
alert(txt);
return true;
}

function message()
{
adddlert("Welcome guest!");
}
</script>
</head>

<body>
<input type="button" value="View message" onclick="message()" />
</body>

</html>



上のスクリプトは、alert("Welcome guest!"); とすべきとろころが、adddlert("Welcome guest!"); となっているので、下のボタンをクリックするとスクリプトがエラーとなり、onerror イベントハンドラーが働き、エラーが表示される。



この間違ったスクリプトを訂正すると、"Welcome guest!" と本来のメッセージが表示され、エラーは表示されない。次のボタンをクリックしてみてください。



2008年7月27日

隠居のお勉強:JavaScript(12) throw

 MT のバージョンを 3.35 から 4.1 へアップグレードするのにずいぶん時間をとられて、続けていた JavaScript のお勉強がほったからしになっていた。
 過去の JavaSCript のエントリーを見直していると、 4.1 へアップグレードによってリンク切れを起こしていたり、必要なスクリプトがサーバーにアップされていなかったりしていた。それらを修復しながら復習することができた。

 W3School tutorial の続きで、今回は throw の勉強である。
  throw statement によって、例外処理ができる。前回の try....catch と一緒に使うと適切なエラー・メッセージによってプログラムを流すことができる。
 以下の例では、変数x に値を求め、x が 0 より小さかったり、10 より大きかったり、数字以外の文字がインプットされた場合に、それぞれにあったエラーを表示する。
 
<html>
<body>
<script type="text/javascript">
var x=prompt("Enter a number between 0 and 10:","");
try
{ 
if(x>10)
  {
  throw "Err1";
  }
else if(x<0)
  {
  throw "Err2";
  }
else if(isNaN(x))
  {
  throw "Err3";
  }
}
catch(er)
{
if(er=="Err1")
  {
  alert("Error! The value is too high");
  }
if(er=="Err2")
  {
  alert("Error! The value is too low");
  }
if(er=="Err3")
  {
  alert("Error! The value is not a number");
  }
}
</script>
</body>
</html>


 上の例を実行するボタンを作ってみた。Script は外部化し<head> 部で呼び出している。 

 

 ボタンをクリックしたときに、上の js を実行するためには、関数化しておかねばならない。作った関数は以下である。
// throwEx sample
function throwEx()
{
  ・
  ・
(上の青字部分)
  ・
  ・
}


これを<body> で実行するボタン(上のボタン)を置く、HTML は、次のコードである。
<input type="button" onclick="throwEx()" value="throw statement Sample" />


2008年7月22日

隠居のBlog備忘録:MT4.1 で TagCloud ページをつくる

 MT3.3 のときに、はじめて TagCloud を設置したときはかなり苦労した。

 MT4.1 では「小粋空間」さんのテンプレート・セットの "two-colomn-liquid-right" を使わせてもらっている。TagCloud は右サイドメニューの中で表示する仕様になっている。Msajii's Blog のようにタグ(キーワード)が多いと「小粋空間」さんの「タグクラウドの折りたたみ for Movable Type 4」を使わせてもらって、折りたたみができる。ただ、私の場合はメッシュを細かくしてタグ(キーワード)をつけたので700 ちかくになっているから、全てを表示すると縦に長くなってしまう。

 それで、MT3.3 のときのようにページで表示できないかネットをググッテみたが、適切なインストラクションがヒットしなかった。それでもいろいろなページを参考に、MT3.3 のときに使っていた「小粋空間」さんの「Movable Type 3.3 エントリー・タグ詳説」のコードを使って、TagCloud ページを作るとうまくいったので備忘録的に書き留めておきたい。

 わかってみれば設置は簡単である。
  1. インデックステンプレートのメインページをまるまる C&P して、新しく名前は何でもいいのだが、TagCloud とでもし、出力ファイル名はこれも名前は何でもいいのだが tagcloud_page.php として保存する。
  2. このテンプレートページの下記の部分を削除し、
    <MTEntries>
       <$MTEntryTrackbackData$>
       <$MTInclude module="ブログ記事の概要"$>
    </MTEntries>
    

    「Movable Type 3.3 エントリー・タグ詳説」の下方にある次のコードを挿入する。
    <div class="module-tagcloud module">
        <h2 class="module-header">Tag cloud</h2>
        <div class="module-content">
            <ul class="module-list">
                <MTTags>
                    <li class="module-list-item taglevel<$MTTagRank$>">
                        <a href="<$MTTagSearchLink$>"><$MTTagName$></a>
                    </li>
                </MTTags>
            </ul>
        </div>
    </div>
    <h2> Tag Cloud </h2> の部分には、TagCloud の説明などに変更できる。
  3. スタイルシートには、次のCSS を追加する。
    /* (タグクラウド用) */
    
    .module-tagcloud .module-content a {text-decoration: none; }
    .module-tagcloud .module-content {text-align: left; }
    .module-tagcloud .module-content .module-list { list-style: none; }
    .module-tagcloud .module-content .module-list .module-list-item { display: inline; }
    .module-tagcloud .module-content .module-list li.taglevel1 { font-size: 32px; }
    .module-tagcloud .module-content .module-list li.taglevel2 { font-size: 28px; }
    .module-tagcloud .module-content .module-list li.taglevel3 { font-size: 24px; }
    .module-tagcloud .module-content .module-list li.taglevel4 { font-size: 20px; }
    .module-tagcloud .module-content .module-list li.taglevel5 { font-size: 16px; }
    .module-tagcloud .module-content .module-list li.taglevel6 { font-size: 12px; }
    
    .module-tagcloud .module-content .module-list li.taglevel1 a{ color: #000000; }
    .module-tagcloud .module-content .module-list li.taglevel2 a{ color: #0000ff; }
    .module-tagcloud .module-content .module-list li.taglevel3 a{ color: #000000; }
    
    表示するフォントの大きさや色は、ここでいじれる。ランクの区分は6段階が初期値である。
  4. 作ったページへのパス(私の場合:http://n-shuhei.net/atelier/tagcloud_page.php )でブラウザに TagCloud ページが表示できれば成功である。
  5. あとは適当な位置に TagCloud ページへのリンクボタンを設定すれば終わりである。右サイドにボタンを置いたので、サンプルはそちらをみて欲しい。


2008年7月 4日

.htaccess で移転先URLページへ誘導する:MT4.1

 MT4.1 で「小粋空間」さんのテンプレート・セットに移行したときに、ブログ名を変更した。とりあえず、元のメイン・ページ( http://n-shuhei.net/blog/ )へ訪問された方には、以前 ISP のホームページを移転するときに使っていた次のようなメタ・タグをメイン・ページの<head> ~ </head> においた。
<meta http-equiv="REFRESH" content=" 5;URL=http://user-domain/new-blog/">

 これは、ページの移転の知らせを発信されている方のソースから、何も分からないままいただいたものである。この方法については、「.htaccessを活用する方法(6)」に詳しい。

 このメタタグをおくことで、元のメインページに訪問された方を新しいメインページに誘導できるが、Google search などで個別のアーカイブへ直接訪問される方は新しいページには誘導するには、全ての個別のアーカイブにメタタグを設置しなければならないから大変な作業となる。

 そこで、上の記事にも紹介されている .htaccess を使って誘導(redirect)する方法を試してみることにした。以前に、この .htaccess を使ってページへのアクセス制限を設定したことがあるが、redirect を使うのは初めてである。

 説明通りに、次のコードを元のブログ:http://n-shuhei.net/blog/ と同じフォルダーにある .htaccess ファイルに追加した。{私の場合、FTP ソフトは FFFTP を使っているが、いったんローカル側で、テキスト・エディター(私の場合は、秀丸)でコードを追加したファイルを作り、これを元の位置にアップロードしなければならない。}
Redirect permanent /blog/index.php http://n-shuhei.net/atelier/index.php

 このコード追加では、先ほどのメタタグの挿入と同じような効果が得られるだけである。

クリックすると大きくなります
 アクセス解析にはアクセス解析サービスの Research Artisan を使っているが、その解析のひとつである先月のページ別訪問は、screenshot のように、ほとんどが元のブログ(頭に Atelier Shuhei Weblog: とある。新しいブログは、頭に単に Atelier: とあるもの)のアーカイブへの訪問である。また、少ないがカテゴリー・アーカイブへの訪問もある。MT3.3 を単純に MT4.1 へバージョンアップした元のブログ・アーカイブはそのままおいているので、ページが見つからないということはないが、コメント入力などが不備な(実はそのために新しいテンプレート・セットを導入した)ページへの訪問となっている。
 図中にある 「Atelier Shuhei Weblog: 001DIY アーカイブ」への訪問を redirect するには、次のようなコードを .htaccess に追加する。
RedirectPermanent /blog/001diy/ http://n-shuhei.net/atelier/001diy/


 数が少なければ、上のようなコードを追加していけばよいのだが、個別アーカイブごとにコードを追加するのは大変な作業となる。そこで、「小粋空間」さんに紹介されている「.htaccess によるリダイレクト」を参考に、.htaccess に追加するコードを作成することにした。

方法は、
  1. この記事の 3.1 項にあるコードの次の個別アーカイブ部分を
    <MTArchiveList archive_type="Individual"> RedirectPermanent /blog/archives/<$MTArchiveDate format="%Y/%m"$>/<MTEntries><$MTEntryLink$></MTEntries> <$MTBlogURL$>archives/
    <$MTArchiveDate format="%Y/%m/%d_%H%M"$><MTEntries>.php</MTEntries> </MTArchiveList>
    下のようなコードに書き換え、説明通り「リダイレクト」(出力ファイル名:htaccess.txt)という名前でインデックス・テンプレートを作成した。
     <MTArchiveList archive_type="Individual"> RedirectPermanent /blog/archives<$MTArchiveDate format="/%Y/%m/%d-%h%m%s"$>.php  http://n-shuhei.net/atelier/<$MTArchiveDate format="%Y/%m/%d_%H%M"$>.php </MTArchiveList>
    ここでの $MTArchiveDate format= は、元のブログ(blog)のものは「アーカイブ・テンプレート」→「エントリー・アーカイブ」(MT3.3 ではこのような名称である)の「アーカイブ・マッピング」のパスで使っているフォーマットである。新しいブログ(atelier) では、「アーカイブ・テンプレート」→「ブログ記事」「アーカイブ・マッピング」のパスで使っているフォーマットである。
  2. 新しく作成したインデックス・テンプレート「リダイレクト」を保存・再構築すると、FFFTP のサーバー側に次のようなファイル(htaccess.txt)が表示される。
    RedirectPermanent /blog/archives/2008/06/10-110702.php  http://n-shuhei.net/atelier/2008/06/10_1107.php
    RedirectPermanent /blog/archives/2008/06/04-102457.php http://n-shuhei.net/atelier/2008/06/04_1024.php
    RedirectPermanent /blog/archives/2008/06/03-194435.php http://n-shuhei.net/atelier/2008/06/03_1944.php
    .
    .
    .
    .

     この作成されたコードをコピー&ペーストで、.htaccess に約400 のエントリー分コードを追加した。
     一見、上手くコード生成していると思われたが、うまく機能しない。
     先ほどのResearch Artisan に表示されるページのURLと作成したコードを子細に照らし合わせてみると元のアーカイブURLの分表示(%M)が月表示(%m)になっている。
    2008/06/04-102457 が正解なのだが、参照にいっているURLの表示では、2008/06/04-100657 となっているのだ。どうやら、MT3.3 から MT4.1 にバージョンアップしたときに、アーカイブ・マッピングの指定を間違ったらしい。 小文字の %m は月表示であり、大文字の %M は分表示なのだ。2~3の例で .htaccess に追加するコードを間違った方にしたら、上手く機能するようになった。
  3. この作業を作成したファイルをテキスト・エディターの秀丸にコピー&ペーストして行った。単純な作業だが、400近くの修正は結構なアルバイトであった。
  4. 修正したファイルを、ローカル側の.htaccess にコピー&ペーストして、サーバー側にアップロードすると、うまくリダイレクトしてくれるようになった。



(追記:2008/7/4)元のカテゴリー別のアーカイブにも訪問が割合あるので、上と同じような方法で、.htaccess に追加するコードを「小粋空間」さんの記事を参考に作成した。数が少ないので、マニュアルにいじってもそれほどの作業ではない。ただ、バージョンアップしてから、カテゴリー名を変更している場合は、特別なひもつけが必要である。
(追記:2008/7/8) Research Artisan をつぶさにみると、数は少ないが元の月別アーカイブに訪ねて来る人があるようなので、先ほどの「リダイレクト」インデックス・テンプレートを次のコードに書き換えて、.htaccess に追加するコードを作成した。月別アーカイブについては、コードの修正は全くなかった。
 この「リダイレクト」インデックス・テンプレートは、コードを生成するためのテンプレートなので、書き換えても問題はない。
 これで、元のブログはサーバーから削除しても大丈夫と思うが、まだ容量にゆとりがあるのでしばらくおいておくことにしている。
<MTArchiveList archive_type="Monthly">
RedirectPermanent /blog/archives/<$MTArchiveDate format="%Y/%m"$>/index.php http://n-shuhei.net/atelier/<$MTArchiveDate format="%Y/%m"$>/index.php
</MTArchiveList>

 Monthly Archive の後尾には、index.php をつけないと、individual archive のリダイレクトに不都合が起こる。