どう知らそう？
Movable Type の編集画面を横にひろげる
Category：[管理画面]
Tag：[CSS, Customize, ManagementPage, MovableType, Width]
Permalink
テンプレート編集画面のテキストエリアおよび、エントリーのテキストエリアの横幅をひろげるカスタマイズです。画像はテンプレート編集画面の変更前と変更後です。
 |
| ↓ |
 |
変更方法は、styles.css （インストール時、mt.cgi と同じディレクトリにあります）の下記の部分を検索して赤色から青色の値にそれぞれ変更してください。例は 150px ひろげる場合です。
.body-wrap {
width: 750px900px;
}
：
#edit-template textarea.wide {
width: 618px768px;
}
：
#edit-entry textarea.full-width {
width: 577px727px;
}.body-wrap はエントリー・テンプレートいずれにも適用される最大幅です。#edit-template textarea.wide はテンプレートのテキストエリア用の幅を設定します。.body-wrap で増加した分を超えるとカラムが折り返してしまうのでご注意ください。#edit-entry textarea.full-width はエントリーのテキストエリア用の幅を設定します。
縦幅をひろげる場合はMovable Type の編集画面をひろげるをご覧ください。
小粋なユーザーコミュニティ100人突破
当サイトのテンプレートユーザさんを中心とした mixi のコミュニティ「小粋なユーザーコミュニティ」が先日100人を超えました。参加くださっている皆様、ありがとうございます。
下記のエントリーでTB企画も行われてますので、興味のある方は奮ってご参加ください。
テンプレートご利用400サイト達成
また今回もmixiの「小粋なユーザコミュニティ」メンバーの方々がサイトのテンプレート利用状況チェックをお手伝いくださいました。サイトの紹介も含めお礼に代えさせて頂きます。お忙しい中、どうもありがとうございました。
-
[k]kazunoblog：kazさん
我楽：Border.さん
Magic White：みよたんさん
やむやむ：さえらさん
ぷちぷちつづり：みゆこんさん
うだうだうだ：わっちゅさん
Daily note：miaowさん
今日の覚え書き：もそさん
Orbium -そらのたま-：としさん
う・わ・き・も・の：真希さん
LOVE×LOVE!?：さっちん。さん
私立大学職員の情報オフィス：yassyさん
- ( ・ω・)Shinのぼやき
- * お気楽で行こう *
- **つれづれなるままに**
- **Silver Heart**
- + 馬グナカルタ +
- +++ Trash can +++
- +++お気楽な日々+++
- ++お花ダイスキ！++
- ++Open My Heart++
- +みゅみゅうさ+
- -CROSSIDE MANIA-
- -h@tezone-
- /PEN/
- /var/tmp/blog
- 05
- 137g
- 4REAL
- 5587.chan.com
- 7colors
- 84xx.daa.jp
- : : useful days* ? : :
- :: Figaro_express ::
- ::::fuumblog::::
- ::flowblog::
- a n i
- Aloalo Palekaiko
- AMBITION&DESIRE
- AmitoMidnight
- angeli-x ++ monologue
- 『ブタネコのトラウマ』 Ｂｌｏｇ版
- ?風を追いかけて?
- あそび
- あっぷるじゅ?す
- あどべがの館
- あふなびブログ
- あらぐさ
- うたたね ひつじ
- うだうだうだ
- えてぽんの部屋
- お取り寄せ大好き.com
- お気楽草紙
- かわさき life
- しゅがーはーと・ぶろぐ
- ちっちっち
- ちとGo!Go!
- つのとカブいっしょに
- とも。日記
- とりとめなき日記
- どうでもいいこと
- どらむすめ.com
- にゃ?ごろ
- のんべサラリーマン
- はいねぶ
- ひばり座ブログ
- ひびのつぶやき
- ふたつとない日常 ?Azumy's Standard Daytime
- ふんわり堂
- ぶーくろぐ
- ぷちぷちつづり
- へたれラボラトリー
- ほげほげ情報ブログ
- ほたるすたいる
- ぼくたび BLOG
- ぼけぼけ☆こむ
- まんがboo(漫画部)
- ものづくり日記
- やしめしや
- やっつけWeb
- やむやむ
- ゆきのきもち
- よろずブログ
- らいぶろぐ(β)
- りとるこっと。blog
- るしゃなーず・ごーすとうぃすぱー
- わいるどで行こう
- わたあめすもも
- わたしのヒトリゴト あさきぬ工房
- アイドルの草鞋
- アルファ道場2005
- オナカン
- ギャンブル三昧！
- グル研日記
- コハルビヨリ。
- チカチカの羅針盤
- チョコチッブログ
- チョーオンパホーソーキョク
- ツキヘノトビラ
- デジタルカメラ.com
- ドール・ヒステリア
- ナリモノイリ
- ネットショップ・オペレーション・マニュアル
- ハルニレの木の下で
- ヒビノキロク
- ボクはちゃんとビジネス本読んでます！
- ポポタム！
- ヤタさんの気まぐれ日記
- ユートピアンのディストピア
- ヨーキーな日々♪
- ラパンdeドライブ宙-ケータイ大好き-
- レジェンダロッサの独り言
- ■やさしい生活■
- ■□ WAY OF LIFE □■
- ▼■▼■● Vivid-style.com
- ○△□ たど船
- ★ひとりごと日記★
- baddreamfancydresser
- BEAT ZONE
- beeカメラ
- BLAN*CAFE
- Blog
- blog::made in SAGA
- Blog@Peaceman
- Blogのような日記のような
- Blue Mint
- BLUE PALETTE
- bo-peep.net/web
- BOBUTEJE
- bublog
- c+
- Cafe*Blog
- camera verde blog
- candy-2 BLOG
- Carefree Field
- Centree's Blog
- ch@yalog
- Cherry-Radio
- cider@home
- Cococcino Days*
- CocoNuts Days
- COLOR NO.A
- comi☆Log.
- cookietale
- Cool Gaming weBlog
- CU*Chu!
- 無線LANテック
- 猫派の読書空間
- 碧影想 -GreenShadowBlog-
- 社会分析的ブログ
- 秀丞写文庫
- 私立大学職員の情報オフィス
- 立夏黄経45度
- 糸博士の人力研究所 別館
- 紅玉日誌
- 縁側talk
- Daily note
- Dans le destin malheureux
- DB blog
- DxD
- D'sDinner@Blog
- Страх Кино
- eizo slash blog
- ELECTRICSHEEPdogs!
- emo.com
- Eternal Forest ?悠久の森?
- Exist a Reason
- existence Uhheri Edition
- EXPECT THE UNEXPECTED
- 適宜更新
- 職人カタギ
- 脳内物質大流室inBLOG
- 重箱のスミ
- 銀座フワラーガーデン
- 長靴をはいたシステムエンジニア
- 閑話日和
- 藤丸
- 蘭のきまぐれblog
- 雑貨*Zakka*サーチねっとMEMO
- 零式改
- 青い自転車とどこまでも。
- 螺子式少年
- 馬に蹴られて
- 黒スムチの親バカ日記
- 黒鱒 - weblog
- fang-lang.net
- Final One's Essence
- flatcrew.net : column
- FootPrint
- forever and a day
- formless room
- Fourseasons
- FreeStyle
- g-type-log
- gaw
- gの徒然Blog
- GF*days
- Grip Blog
- groovecube ver.3
- grumble
- Harry's Blog
- HENO HENO
- hilari blog
- HiMAT
- HONGKONG+fish Hyper×2
- Hot cocoa
- hotmilk
- I LOVE NAVY
- IdeOnline
- INSIDE ADORE
- iRodoRi@BLOG
- is life delisious?
- ITOH STYLE
- ＊だらだら雑記＊
- ３足のわらじ
- ：： monamona* ：：
- ：：： Sweet days ：：：
- ＭＴおぼえがき
- ＭａｋｋｙののほほんDiary♪
- Ｐｅｔｉｔｅ＊Ｍａｉｓｏｎ
- ＳecretＢａｓｅ Of ワンｓ
- ＳＥと呼ばれている奴の気ままなブログ
- Just myself
- K-Jirow BLOG
- karleksounds
- kazunoblog
- KeiBlog
- KG
- KH Weblog
- KillerPierce
- kitchen
- Kitchen * Box
- KoreanLanguage*
- Kuro:Neko Diary
- K'S GARDEN
- land2go!!
- langsam
- L・E・L・S
- Lounge
- love
- Love is Blind.
- LOVE SWIMMING Blog
- LOVE×LOVE!?
- LUNCH BOX note*
- M*C?B Version?
- M*s Cafe-Blog-
- Magic White
- Magic#32のMT日記
- MAHALO
- Maio's Weblog
- maki's space
- mama's blog
- Mami's note
- MandraChips
- Marginalsky
- mattari-blog
- mazdayaspeedおんらいん
- Memo log
- MetLog
- Minologue
- Misty Night
- Mo-jah's Blog
- mobilepcclub
- monochrome green
- Monochrome Recollections
- MONOLOGUE
- MS.CANDY
- my style*
- My Sweet Moana
- Myth Online
- N-blog
- Nachtigall
- NaOHの迷宮
- Natural High
- neko no 肉球＠BLOG
- nekoの部屋
- niigata-boro.net daily-r
- NO DOUBT
- nobubu Eyes
- Nonsence?
- NOP DAYS
- Orbium
- Ordinary Person Monologues::
- Other Lives
- Out of Nowhere
- patapata:blog
- PCと戯れる日々
- Peco Net
- petit*asterisk@お買い物日記
- PHAT∴LOVESICK
- PICNIC!
- PORNOGROOVE.COM
- Postposition.Net Blog
- Press-code.net
- Pubsonal パブソナルを考えるブログ
- P's Blog
- qnux weblog
- Rabbit's Room
- Rain road
- Release Candidate 2
- RELISH Cafe
- Routinework Blog
- S.O.O.S.blog
- SAKSAK RECORDS WEB SITE
- Sampei's Private Room
- sands2kの諸々
- Sans-Souci
- Sanssouci
- se a vida e
- Search the happy way
- SEYA.ORG
- Shout!!
- SHO's**My...Day...**
- skyimage / Blog
- sleepyblog
- Slip-on Way
- solgel.info::そるじぇるどっといんふぉ
- Sono's Every day
- SOYGRAPH
- SR ** P i c k U p **
- STARLIT SKY
- Suzie World
- SWEET WATER Web Server
- swimmer's blog ver. 2.0
- TAKE IT EASY. つれづれブログ
- teaspoon
- TENERE
- the end
- The Simple Outdoor Life
- THE TRENDYLINE
- ti-web.net "Blog"
- TOKYO Runabout
- TOY COZY MUSEUM 別館
- Treasure
- TsBlog
- Ui-ed
- Un duex trois
- Unknown
- vanilla_cafe*
- vvhappy-roadvv
- WAY TO GO
- weblog@nigiyakana jikan
- Whisper
- White*Dwarf
- WhiteжButterfly
- WInds of Cemetery
- wobb.jp
- WORK NOTE BLOG
- World without Words.
- YBC-time
- Yellow Heart
- Yggdrasill.
- YUIHARU DIARY
- zerothree.blog
- zora*
- [ Slow ”UO” Life ]
- [美]Musabi Diary - a-bit-
- [EF] Electric Flower
- 倖 *Happiness Blog*
- 出張生活
- 出来るだけ、更新です。
- 初心者のためのデジカメ活用入門
- 匠悟録
- 南茶亭
- 和道楽日記 - Kazulog -
- 和尚の南無ログ
- 喜怒哀楽
- 夏のクラクション
- 夏海の恋愛事情。
- 天上月苑
- 学ばない女
- 宵待小桜餅
- 寝言、戯言、独り言。
- 居宅介護支援事業所このみ
- 山吹の風
- 己でサイトジャック
- 帰宅部大学生のblog
- 店主のつぶやき・・・「プロの道具屋さん」
- 弁慶の舞台裏
- 弁慶の舞台裏
- 彫刻道-ドイツ・彫刻・日記-
- 後藤真希 ワオワオ記念日
- 徒然なるままに･･･（?はるかなる日々）
- 恵司日記
- 我楽
- 改訂★裏赤玉号[改]日誌
- 日々のつぶやき
- 日々一歩-裏-
- 時は流れても・・・
- 暮らし＊カフェな節約生活
- 暮らし快適！ナチュラル家事のススメ
- 月夜の浜辺
- 本日のおすすめ !!
- 東北の巨匠：：雑記
- 東京ディズニーリゾート裏技完全攻略検定 情報局 Blog
- 東京西郊日誌
- 樹問Jumon
- 気ままな旅人になれたなら
- 洒落のひとり言
- 海苔部落
- 深い雪
- 三十路スマッシュMTBLOG
- 中年サラリーマンの日記
- 湘南より愛を込めて♪
- 人間万事塞翁が馬 で行こう
- 今日の行方
- 今日の覚え書き
- 会社と社員のための就業規則活用法
- 体験手記レポート部
- 激安！サーフショップ
- 信海忠如どっとこむ
- || UTAGAME ||
<script language="javascript" type="text/javascript" src="http://rpc.blogrolling.com/display.php?r=2102d144aab85284beaa02142f672f72"></script>リストの文字コードはUTF-8ですのでご注意ください。またリストにあるご自身のサイト情報を更新させる場合は
- http://rpc.blogrolling.com/pinger/
テンプレートご利用者の方にお役立て頂ければ幸いです。
テクノラティジャパン・バージョンアップ
先日の Technorati.com のリニューアルに続いてテクノラティジャパンもリニューアルしたようです。
 Technorati はブログ検索サービスのひとつで、Movable Type をお使いの方は設定画面にある更新ping を送信するデフォルトサイトとしてご存知と思います（途中のバージョンから追加されました）。自分のサイトURLやサイト名を設定して検索すると、関連サイトを表示してくれまして、以前はこれで結構楽しんでいました。今回のリニューアルではトップCD、トップDVD、トップゲームのランキングコンテンツが追加されているようです。すでに提供されているトップ100は先ほど初めて見ましたが24位に登場していて（画像）、ビックリです。 |
アンダースコア・ハック
CSSで設定したプロパティ（width/font-color等）の前にアンダースコア "_" を付与すると、WinIEではそれを正常なプロパティとして読み込み、他のブラウザでは無視される（=定義されていないプロパティとして認識される）ことを利用した「アンダースコア・ハック」を紹介します。Mozilla 系のフォントサイズが小さくなる問題で、以前 JavaScript によってサイズを変更するエントリーを公開しましたが、それをCSSで実現することができます。
参考サイトは下記です。ありがとうございました。
ということで、利用方法です。公開テンプレートのサイドバーのフォントサイズを、IEではデフォルトのサイズ（9px）を、NetScapeやFirefox等、WinIE系以外のブラウザで 10px を指定する例を挙げておきます。
.side {
font-family: Verdana, Arial, sans-serif;
color:#666666;
background: none;
font-size:10px;
_font-size:9px;
font-weight:normal;
line-height:150%;
padding:2px;
margin-bottom:25px;
}動作の仕組みですが、まず上の「font-size:10px;」を全てのブラウザが読み込みます。そして次の「_font-size:9px;」で、WinIE系のブラウザだけが正常なプロパティとして読み込みます（つまりこちらが有効になる）。結果としてWinIE系とそれ以外のブラウザで異なるサイズを指定することができます。記述の順番を間違えないように気をつけましょう。
いくつかのサイトを見てまわるとこのハックを利用した場合、CSSが valid にならないことが問題として挙げられているようですので、JavaScript によるプロパティ値修正も策としては妥当ではないかと思います。
サイドメニューの折りたたみに画像を使用する
サイドメニューの折りたたみ（v4.0）でブロックレベル要素指定による折りたたみをご紹介しましたが、タイトル部分の背景やロールオーバーした時に任意の画像を配置するカスタマイズです。簡単です。
まず、タイトル部分に通常表示で使用する画像（hogehoge1.gif）とロールオーバー時に使用する画像（hogehoge2.gif）の2つを用意します。例えば下記のようなものです。
：通常表示用（hogehoge1.gif）
：ロールオーバー用（hogehoge2.gif）
次に、前述のエントリーにある、３項のスタイルシートの設定を下記のように変更します。
/* 通常 */
.sidetitle2 a:link,
.sidetitle2 a:visited {
display: block;
padding: 2px;
border: 1px solid #999999; /* 枠線 */
color:#666666; /* 文字色 */
background-color:#f6f6f6; /* 背景色 */
font-family: Verdana, Arial, sans-serif;
font-size:10px;
text-decoration: none;
background-image:url(images/hogehoge1.gif);
}
/* マウスポイント時 */
.sidetitle2 a:hover {
padding: 2px;
border: 1px solid #999999; /* 枠線 */
color:#ffffff#666666; /* 文字色 */
background-color: #999999; /* 背景色 */
font-family: Verdana, Arial, sans-serif;
font-size:10px;
text-decoration: none;
background-image:url(images/hogehoge2.gif);
}これで下記のような動作をするようになります（サンプル表示用に設定は若干変えています）。
上記は配置する画像のサイズがタイトル部分と同じ大きさの場合です。次のように細い縦長の画像（hogehoge3.gif：みにくくてすいません）
を繰り返し表示する場合は、
background-image:url(images/hogehoge3.gif);
background-repeat:x;とします。これで
という表示になります。ロールオーバー用の画像も同じ方法で作れます。この方法は横方向のサイズが可変になる場合に便利です。
MySQLでエントリーのフィールドサイズを拡張する
Category：[MySQL]
Tag：[Customize, Database, mediumtext, MovableType, MySQL]
Permalink
MySQLではエントリーのデータ型に「TEXT型」というものを用いており、最大65535 バイトまで格納することができます。で、このサイズを超える場合、当然のことながらDBに適正に保存することができません（最大長に入らない部分が切り捨てられます。）。実は当サイトを Berkeley DB から MySQL に移行した際、テンプレートデータを記したエントリーが途中で途切れてしまい、調べているうちに上記の原因であることが判明しました。
ということで、MySQLでのフィールドサイズの拡張方法です。インストール前での実行方法ですので、その点は予めご了承ください。
Movable Type インストールアーカイブに含まれている schemas/mysql.dump を任意のエディタで開いて下記のように修正します。
create table mt_entry (
entry_id integer not null auto_increment primary key,
entry_blog_id integer not null,
entry_status tinyint not null,
entry_author_id integer not null,
entry_allow_comments tinyint,
entry_allow_pings tinyint,
entry_convert_breaks varchar(30),
entry_category_id integer,
entry_title varchar(255),
entry_excerpt text,
entry_text textmediumtext,
entry_text_more text,
entry_to_ping_urls text,
entry_pinged_urls text,
entry_keywords text,
entry_tangent_cache text,
entry_created_on datetime not null,
entry_modified_on timestamp not null,
entry_created_by integer,
entry_modified_by integer,
entry_basename varchar(50) not null,
index (entry_blog_id),
index (entry_status),
index (entry_author_id),
index (entry_created_on),
index (entry_basename)
);mediumtext は最大長 16777215 バイトです。ちなみに longtext というものもあり、こちらは最大長 4294967295 バイトです。
テンプレートのフィールドサイズを拡張する場合は、同じファイル内の下記の部分を変更します（多分）。
create table mt_template (
template_id integer not null auto_increment primary key,
template_blog_id integer not null,
template_name varchar(50) not null,
template_type varchar(25) not null,
template_outfile varchar(255),
template_rebuild_me tinyint default 1,
template_text textmediumtext,
template_linked_file varchar(255),
template_linked_file_mtime varchar(10),
template_linked_file_size mediumint,
template_created_on datetime not null,
template_modified_on timestamp not null,
template_created_by integer,
template_modified_by integer,
template_build_dynamic tinyint,
unique (template_blog_id, template_name),
index (template_type)
);修正した後、Movable Type をインストールすることで指定したサイズでDBが作成されます。
Movable Type のディレクトリ
Category：[テンプレートタグ, 管理画面]
Tag：[MovableType, MTBlogArchiveURL, MTBlogSitePath, MTCGIPath, MTStaticWebPath, VariableTag]
Permalink
カスタマイズする際の外部ファイル（JavaScript等）のアップロードで配置するディレクトリに戸惑う方が少なくありません。「どこにアップロードすればよいのでしょうか」という質問も時々頂きます。
その問題が解消されるかどうか定かではありませんが、改めてディレクトリについてまとめてみました。文中でパスとディレクトリの表現が混在していますがあまり気にしないでください。厳密にはファイル名を含むのが「パス」のようですが、Movable Type の画面ではディレクトリを「パス」と表現しているようです。
CGIPath
適切な名称がありませんので mt.cfg の名称を使います（記事の中でも好んで用いています）。端的に言うと、各CGIスクリプトを配置するディレクトリです。レンタルサーバでは cgi-bin というディレクトリ名が付与されています。
このディレクトリには cgi ファイル（mt.cgi/mt-comment.cgi/mt-tb.cgi 等）と、CGIスクリプトを実行するために必要なライブラリのディレクトリ（下記）が配置されます。
- extlib/
- lib/
- php/
- plugins/
- schemas/
- search_templates/
- tmpl/
- tools/
ブラウザから閲覧できるファイルはここには存在しません。JavaScript 等の外部ファイルをここに配置することはありません。また CGIPath は Typekeyの登録URLとしても使われます。index.html があるURLを Typekey登録画面で登録されても Typekey は正常に動作しませんのでご注意ください。
このディレクトリはMT変数タグで
<$MTCGIPath$>と表現されます。
ローカル・サイト・パス
index.html が配置されるディレクトリです。「ローカル・サイト・パス」は管理画面の基本設定の項目名で使われているので、当サイトではこの名称を好んで使っています。各インデックス・テンプレートを再構築した際に生成されるファイル（index.html/styles-site.css 等）がこのディレクトリに配置されます。カスタマイズ等で外部ファイルをアップロードする際には必ずこのディレクトリにアップロードしてください（プラグインファイルは除外）。
このディレクトリはMT変数タグで
<$MTBlogSitePath$>と表現されます。これをURLにしたものが
<$MTBlogURL$>です。
レンタルサーバではCGIスクリプトを特定のディレクトリでしか実行できないように制限していますが、そのような環境設定でない場合、例えば自宅サーバ等ではこのディレクトリにCGIスクリプトを配置して動作させることも可能です。とういか私は当初そのような使い方をしていたため、レンタルサーバご利用者の方に随分わかりにくい説明をしていました。
アーカイブ・パス
管理画面で「ローカル・アーカイブ・パス」と書かれているディレクトリです。再構築されたアーカイブ・テンプレート（カテゴリー・アーカイブ/日付アーカイブ/個別エントリーアーカイブ等）がここに生成されます。デフォルト設定では、ローカル・サイト・パスに archives というディレクトリを作るように仕組まれています。
このディレクトリのURLはMT変数タグで
<$MTBlogArchiveURL$>と表現されます。
StaticWebPath
これもいい名称がありませんので mt.cfg の名称を使います。これは管理画面の表示に使われる
- styles.css
- mt.js
- images/
- docs/
を配置するためのディレクトリです。mt.cfg で設定する際はドキュメントルートからの指定になります（かつ前後を "/" で括る）のでご注意ください。
このディレクトリが必要な理由ですが、そもそも CGIPath は Apache の ScriptAlias で設定されたディレクトリで、このディレクトリに配置されたファイルは常にCGIスクリプトとして認識されるため、他のファイルやディレクトリを配置しても正常に振舞うことができないためです。ローカル・サイト・パスに配置しても構わないのですが、本来の使用目的から考えると専用のディレクトリに置いた方が好ましいでしょう。
このディレクトリはMT変数タグで
<$MTStaticWebPath$>と表現されます。
html 要素に lang 属性・xml:lang 属性を追加
XHTML では html 要素に対し、拡張要素である xmlns 属性が続きます。
<html xmlns="http://www.w3.org/1999/xhtml">xmlns 属性は「XML名前空間」で、当サイトを彷彿とさせるネーミングです。The Web KANZAKI：XML名前空間の簡単な説明が大変参考になります。
この後に、書かれている言語の種類と書かれているXMLの言語の種類を追加することがXHTML1.0に記載されています。いずれも日本語であることを明示する場合は下記のようになります。
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">ただし The W3C Markup Validation Service ではこの記述がなくても valid になります。
カレンダーを XHTML 1.0 valid にする
Category：[テンプレート]
Tag：[Bug, Calendar, MovableType, WebStandards, XHTML]
Permalink
公開中のテンプレートに表示させているカレンダーを XHTML 1.0 valid にする方法です。
valid にならない原因は、カレンダーの日付部分に span 要素を付与しているのですが、空きの日（1日より前、月末より後）にも span 要素を付与していたためです（すいません）。
ということで、下記のリストのように
- <MTCalendar> ? </MTCalendar>
のタグを修正することで valid になります（赤色を削除して青色部分を追加）。
<MTCalendar>
<MTCalendarWeekHeader><tr></MTCalendarWeekHeader>
<td align="center" <MTCalendarIfToday>bgcolor="#ffffe0"</MTCalendarIfToday>><MTCalendarIfBlank><MTElse><span class="calendar"></MTElse></MTCalendarIfBlank>
<MTCalendarIfEntries>
<MTEntries lastn="1"><a href="<$MTEntryLink archive_type="Daily"$>"><$MTCalendarDay$></a></MTEntries></MTCalendarIfEntries>
<MTCalendarIfNoEntries><$MTCalendarDay$></MTCalendarIfNoEntries>
<MTCalendarIfBlank> <MTElse></span></MTElse></MTCalendarIfBlank>
</span></td><MTCalendarWeekFooter></tr></MTCalendarWeekFooter></MTCalendar>なおデフォルトテンプレートでは span 要素が付与されていないので問題ありません。公開テンプレートは追って修正致します。
固定3カラムのIE6・後方互換モード対処方法
公開中の固定3カラムテンプレートをXHTMLに適用させる場合、1行目にXML宣言、
<?xml version="1.0" encoding="utf-8"?>
をテンプレートに記述する場合がありますが、この時IE6では強制的に表示モードが「後方互換モード」、つまり古いブラウザへの互換性を保とうとするモードになります。
「後方互換モード」は「標準モード」と解釈の違いがあり、その中のひとつに width プロパティに padding / border プロパティのサイズを含む・含まないの解釈の違いがあります。後方互換モードでは width に padding / border のサイズを含むため、含まないサイズ指定を行っている公開テンプレートでXML宣言を行うと左右のカラム幅が画像のように崩れてしまうという問題がありました（というかそもそも私の解釈誤り）。
1行目にXML宣言を記述しなければこのような問題は発生しないのですが、ウェブスタンダードに準拠して運用される場合の制約となってしまいます。
ということで、3カラム固定の公開テンプレートについて、いずれの表示モードにも依存せずに表示させる修正方法を提示します。具体的には、両者のプロパティを同時にひとつのブロックに記述しなければ回避できる問題ですので、新しいブロックを追加します。
なお、text-align:プロパティを追加しないとセンタリングされないという問題もありますのでそれも併せて記述します。
本記事の参照元は下記です。ありがとうございました。
１．スタイルシート修正
styles-site.css の左右カラム指定のIDセレクタについて、下記リストのように赤字部分を削除し、青字のIDセレクタを新たに追加します。
#links-right-box {
float: left;
width : 185px ;
}
#links-right{
float: left;
width : 155px ;
padding-top : 15px;
padding-left : 15px;
padding-right : 15px;
color: #ffffff;
}
#links-left-box {
float: left;
width : 185px ;
}
#links-right{
float: left;
width : 155px ;
padding-top : 15px;
padding-left : 15px;
padding-right : 15px;
color: #ffffff;
}また3カラム全体をセンタリングさせる場合は、body 要素に青色の text-align プロパティ を追加してください。
body {
margin: 0px 0px 20px 0px;
background:#8FABBE; /* 背景色 */
text-align:center;
}２．テンプレート修正
3カラム化しているテンプレート全てについて、下記リストのように links-left、links-right のタグの外側を括る形で青字のタグを追加します。
：
<!-- 左サイドバー開始 -->
<div id="links-left-box">
<div id="links-left">
：
</div>
</div>
<!-- 左サイドバー終了 -->
<!-- 中央コンテンツ開始 -->
：
<!-- 中央コンテンツ終了 -->
<!-- 右サイドバー開始 -->
<div id="links-right-box">
<div id="links-right">
：
</div>
</div>
<!-- 右サイドバー終了 -->
：３．もう少しきれいに
実は左右のセレクタの内容は全く同じ内容ですので、
.links-box {
float: left;
width : 185px ;
}
.links{
padding-top : 15px;
padding-left : 15px;
padding-right : 15px;
color: #ffffff;
}というまとめた指定も可能です（妥当かどうかは別として）。テンプレートのid 属性は class 属性に変更してください。
 上記の修正によって標準モード・後方互換モードのいずれでも画像のような表示になります。なおIE6のみの対処ですので他のブラウザについて適正な表示をするには別の方法が必要かも知れませんので予めご容赦ください。公開中の固定3カラムのテンプレートは修正済みです。 |
おさいふケータイ
label 要素を用いてトラックバックURLを1クリックで選択状態にする
Category：[トラックバック, ユーザビリティ]
Tag：[Customize, JavaScript, label, MovableType, TrackbackURL, Usability, XHTML]
Permalink
個別エントリーアーカイブに表示されたトラックバックURLを、ドラッグせずに1クリックで選択する方法は既にスタンダードなカスタマイズとして確立していますが、label 要素を加えてさらに取得しやすくしてみました。label 要素は、それで括られた説明文をクリックした時やアクセスキーを押した時、本来の部分をクリックした時と同じ動作をさせる働きをもっています。
デフォルトテンプレートにおけるトラックバックURL表示のHTMLタグは下記のようになっています。
<h2 id="trackbacks">トラックバック</h2>
<p class="techstuff">このエントリーのトラックバックURL:<br />
<$MTEntryTrackbackLink$></p>このタグでは下のような表示になり、トラックバックURLをコピーする場合、マウスでドラッグする必要があります。
- トラックバック
- このエントリーのトラックバックURL:
- http://www.koikikukan.com/cgi-bin/blog/koikikukan/mt-tb.cgi/1216
このタグに対してURL表示部分を input 要素に変更し、さらに onfocus イベントを加えて1クリックでURL全体が選択できるようにします。
<h2 id="trackbacks">トラックバック</h2>
<p class="techstuff">このエントリーのトラックバックURL:<br />
<input tabindex="1" accesskey="x" name="tb_url" value="<$MTEntryTrackbackLink$>" readonly="readonly" onfocus="this.select()" /></p>ここまでが従来のカスタマイズで、テキストエリアのURLを1クリックで選択状態にすることができます。ここでは省略していますがIEのみ有効なコピーボタンをつけるというカスタマイズもあります。
- トラックバック
- このエントリーのトラックバックURL:
input 要素には name 属性が必要です。また tabindex 属性と accesskey 属性の付与が推奨されています。
ここからさらに input 要素に任意の id 属性を追加し、その id 属性を指定する label 要素で説明文「このエントリーのトラックバックURL:」を括ります。
<h2 id="trackbacks">トラックバック</h2>
<p class="techstuff"><label for="tb_url">このエントリーのトラックバックURL:</label><br />
<input tabindex="1" accesskey="x" name="tb_url" id="tb_url" value="<$MTEntryTrackbackLink$>" readonly="readonly" onfocus="this.select()" /></p>これで「このエントリーのトラックバックURL:」の部分をクリックしても選択状態にできるようになります。
- トラックバック
URLの周囲に他の説明文を加えている場合はそこに label 属性を付与することでさらにマウスでURLを狙う精度を低くすることができます。
label 要素に accesskey 属性を付与することで、ALT キー+「accesskey属性で指定した値」で選択することもできます。Movable Type ではデフォルトテンプレート・メインページの検索部分にこのテクニックを用いていますので、そちらも参考にされると良いと思います。
2005.06.17 追記
typo がありました（誤：lable→正：label）ので修正しました。すいません。
Musical Baton
Ogawa::Memoranda さんより Musical Baton が来ましたのでお答えします。
Musical Baton というものが先月辺りより海外からまわってきているようです。ルールは、バトンが回ってきたら自分のブログ上で以下の5つの質問に答え、また5人の方を指名します。一番下に次に回す5人の方を勝手ながら挙げさせて頂きました。
ろくな回答でなくてすいません。
今パソコンに入ってる音楽ファイルの容量
5937.6MBでした。ちなみに練習音源しか入ってません。
最後に買ったCD
最近買ってないので、記憶にありません…。
あ、思い出しました、白い軌跡。
今聴いている曲
聴いてません…
よく聴く曲、または自分にとって特に思い入れのある5曲
折角なのでクラシックギター曲で固めてみました。
- 舞踏礼讃／L.ブローウェル キューバが生んだ世界的ギタリスト（指を壊して今は作曲家）、ブローウェルの名作。1964年の前衛的な作品で、「静」と「動」が対比します。ギター界では「現代曲の古典」と言われています。
- 祈祷と舞踊／J.ロドリーゴ 「アランフェス協奏曲」で有名なスペインの作曲家、ロドリーゴのギターソロ曲。1961年の作品で、パリ国際作曲コンクール1位。ファリャへの讃歌。
- サウダージNo.3／R.ディアンス フランスの現代作曲家、ディアンスの作品で「儀式」「踊り」「祭りと終曲」の3部からなります。サウダージは「郷愁」を意味します。
- フリア・フロリダ／A.バリオス 20世紀初頭、パラグアイの作曲家兼ギタリスト、バリオスの作品。とても美しいバルカローレ（舟歌）です。
- アクアレル／S.アサド スーパーギターデュオ・アサド兄弟の兄、S.アサドの作品。快速なテンポの1・3楽章と美しい2楽章で構成されています。全音階を基本としたモチーフでギターの可能性を極限まで追求した秀逸の楽曲。
5人の方々へバトンをお渡しします。
- caramel*vanilla：lomoさん
- CEFA::Blog：COLDさん
- Luna's*PaPa：Takeさん
- The blog of H.Fujimoto：壱さん
- できる！CSSを使いこなす：y-iwebさん
ご近所さんでつぶしあいが始まっているようなのでテンプレートユーザさんは外しました。そしたら結構冒険的お願いになってしまいました（アルファベット順です）。
もしこのエントリーご覧になられましたらどうぞよろしくお願い致します（シカトOKです）。
リストマークの画像のずれを修正する
サイドバーメニュー等の先頭のマーク（マーカー）表示に画像を使われている方は少なくないと思いますが、img タグをテンプレートに直接記述するのは、ウェブスタンダードでいうところの「構造とデザインの分離」という面よりあまりお勧めできません。またリストの量が増えると img タグの指定も増えることになり（テンプレートでは数ヶ所の指定で済みますが）、ページサイズにも影響します。
ということで、マーク表示にはCSS・リスト形式（li）の画像指定で表示すること好ましいですし、リスト先頭のマークに画像を使われている方も大勢いらっしゃると思いますが、list-style-image プロパティで
li {
list-style-image: url(hogehoge.gif);
}と画像を指定した場合、下のようにマークが微妙にずれて表示されてしまうのが悩ましいところです（サンプル１）。
サンプル１
これを背景画像で表示させる方法に変更すれば位置を揃えて表示させることができます。
li {
padding-left: 12px;
background: url(hogehoge.gif) no-repeat 10px 0.5em;
list-style: none;
}padding-left は画像を配置する分の余白です。
url の後ろの指定は順に
- background-repeat（画像の繰り返し表示）
- background-position-x（X軸方向の開始位置）
- background-position-y（Y軸方向の開始位置）
です。サンプル２が background 指定で表示した場合です。
サンプル２
ちなみに左上の「最近のエントリー」で使っている地味な画像のHTMLとCSSは下記のような指定を行っています。
HTML
<ul class="list">
<li>～</li>
：
<li>～</li>
</ul>CSS
ul.list {
list-style: none;
margin: 0px;
margin-left: 0px;
padding: 0px;
}
ul.list li {
margin: 0px;
padding: 0px 0px 0px 12px;
background: url(hogehoge.gif) no-repeat 3px 0.4em;
list-style: none;
}HTMLの ul 要素に class 属性を与えているのは、ul - li を適用する場所によって異なるスタイルを与えることを想定しています。全ての ul - li 要素に同じスタイルを与える場合、HTMLの class 属性や CSS の class セレクタは不要（ul.list → ul）です。
2005.08.21 追記サンプルのHTMLを追加しました。
シマダヤ 韓国風冷麺
味は、そばと冷麺を足して2で割って、それを辛口にした感じです。シマダヤのサイトではひっそりと紹介されているだけですが、そば粉を配合した、ほどよい弾力のある細麺と、これまた程よい辛味のあるスープが癖になる味で、以来何回か食してます。 2食入ですが西友では3食入りに変わってました。また当然のことながら賞味期限の長い方が美味しいです。 |
ごはんの支度を
Designing with Web Standards
Category：[書籍]
Tag：[Amazon, Book, CSS, JavaScript, WebStandards, XHTML]
Permalink
「Web Standards（ウェブスタンダードまたはWeb標準）」という言葉を最近耳にするようになりました。ウェブスタンダードとは「Webで標準的に利用される技術の総称」で、ウェブスタンダードに準拠したサイト製作を行うことで、モダンブラウザやデバイス（PDAや携帯電話等）に等しく対応でき、また通信データ量を削減するといった恩恵を享受することができます。
XHTML・CSSを利用してWebページを製作することでウェブスタンダードへの準拠になります。他にも言語としてDOM・ECMAScript、数式としてMathMLが挙げられます。文書構造（XHTML）と視覚表現（CSS）の分離を行うことでサイトのリデザイン（ブログでいうところのスキン変更）も簡単に行うことができます。
この本はウェブスタンダードによるサイトデザインのアプローチや製作に際する様々な問題点を取り上げて詳細に解説されたものです。
 Designing with Web Standards―XHTML+CSSを中心とした「Web標準」によるデザインの実践 posted with amazlet at 05.06.11 ジェフリー ゼルドマン Jeffrey Zeldman 石田 優子 ソシオメディア 毎日コミュニケーションズ (2004/10) 売り上げランキング: 11,597 このページは在庫状況に応じて更新されますので、購入をお考えの方は定期的にご覧ください。 おすすめ度の平均:  web概念本 正しいウェブページの作り方 訳に難アリ |
ブログでない、多くの著名サイトは後方互換、つまり古いブラウザで問題なく表示させるためにウェブスタンダード以外のアプローチで製作されていますが、おそらくここ数年？の間にウェブスタンダードに移行する流れが強まり、「前方互換」を重視する時代が訪れるでしょう。そしてウェブスタンダードに準拠しやすいブログの普及がその流れに勢いをつけるのではないかと思います。
Movable Type 3.17-ja 個別エントリーアーカイブの変更点について
Category：[テンプレート]
Tag：[3.17-ja, IndividualArchive, MovableType, Template]
Permalink
Movable Type 3.17 とぞれ以前の 3.x 個別エントリーアーカイブ・デフォルトテンプレートの差分を公開します。下のリストに個別エントリーアーカイブ・デフォルトテンプレートを全て掲載し、3.x から 3.17 にアップグレードされた場合は赤色のタグを青色のタグに置き換えてください。公開テンプレートについても修正部分は同様に配置されておりますので検索して適宜修正してください。
なお、Typekey を利用していない場合は修正不要です。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" />
<meta name="generator" content="http://www.movabletype.org/" />
<title><$MTBlogName encode_html="1"$>: <$MTEntryTitle$></title>
<link rel="stylesheet" href="<$MTBlogURL$>styles-site.css" type="text/css" />
<link rel="alternate" type="application/rss+xml" title="RSS" href="<$MTBlogURL$>index.rdf" />
<link rel="alternate" type="application/atom+xml" title="Atom" href="<$MTBlogURL$>atom.xml" />
<link rel="start" href="<$MTBlogURL$>" title="Home" />
<MTEntryPrevious>
<link rel="prev" href="<$MTEntryPermalink$>" title="<$MTEntryTitle encode_html="1"$>" />
</MTEntryPrevious>
<MTEntryNext>
<link rel="next" href="<$MTEntryPermalink$>" title="<$MTEntryTitle encode_html="1"$>" />
</MTEntryNext>
<MTInclude module="Remember Me">
<$MTEntryTrackbackData$>
<MTBlogIfCCLicense>
<$MTCCLicenseRDF$>
</MTBlogIfCCLicense>
</head>
<body>
<div id="container">
<div id="banner">
<h1><a href="<$MTBlogURL$>" accesskey="1"><$MTBlogName encode_html="1"$></a></h1>
<h2><$MTBlogDescription$></h2>
</div>
<div class="content">
<p align="right">
<MTEntryPrevious>
<a href="<$MTEntryPermalink$>">« <$MTEntryTitle$></a> |
</MTEntryPrevious>
<a href="<$MTBlogURL$>">メイン</a>
<MTEntryNext>
| <a href="<$MTEntryPermalink$>"><$MTEntryTitle$> »</a>
</MTEntryNext>
</p>
<h2><$MTEntryDate format="%x"$></h2>
<h3><$MTEntryTitle$></h3>
<$MTEntryBody$>
<div id="a<$MTEntryID pad="1"$>more"><div id="more">
<$MTEntryMore$>
</div></div>
<p class="posted">投稿者 <$MTEntryAuthor$> : <$MTEntryDate$></p>
<MTEntryIfAllowPings>
<h2 id="trackbacks">トラックバック</h2>
<p class="techstuff">このエントリーのトラックバックURL:<br />
<$MTEntryTrackbackLink$></p>
<MTIfNonZero tag="MTEntryTrackbackCount">
<p>このリストは、次のエントリーを参照しています: <a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a>:</p>
<MTPings>
<p id="p<$MTPingID$>">
» <a href="<$MTPingURL$>"><$MTPingTitle$></a> from <$MTPingBlogName$><br />
<$MTPingExcerpt$> <a href="<$MTPingURL$>">[続きを読む]</a>
</p>
<p class="posted">トラックバック時刻: <$MTPingDate$></p>
</MTPings>
</MTIfNonZero>
</MTEntryIfAllowPings>
<MTEntryIfAllowComments>
<h2 id="comments">コメント</h2>
<MTComments>
<div id="c<$MTCommentID$>">
<$MTCommentBody$>
</div>
<p class="posted">投稿者 <$MTCommentAuthorLink default_name="Anonymous" spam_protect="1"$> <MTCommentAuthorIdentity> : <$MTCommentDate$></p>
</MTComments>
<MTEntryIfCommentsOpen>
<MTIfCommentsAllowed>
<h2>コメントしてください</h2>
<MTIfRegistrationRequired>
<MTIfNonEmpty tag="MTTypeKeyToken">
<div id="thanks">
<p>サイン・インを確認しました、
<script type="text/javascript" src="<MTCGIPath><MTCommentScript>?__mode=cmtr_name_js"></script><script>document.write(commenter_name);</script>.
さん。コメントしてください。 (<a href="<$MTRemoteSignOutLink static="1"$>">サイン・アウト</a>)</p>
(いままで、ここでコメントしたとがないときは、コメントを表示する前にこのウェブログのオーナーの承認が必要になることがあります。承認されるまではコメントは表示されません。そのときはしばらく待ってください。)
<form method="post" action="<$MTCGIPath$><$MTCommentScript$>" name="comments_form" onsubmit="if (this.bakecookie[0].checked) rememberMe(this)">
<input type="hidden" name="static" value="1" />
<input type="hidden" name="entry_id" value="<$MTEntryID$>" />
<p><label for="url">URL:</label><br />
<input tabindex="1" type="text" name="url" id="url" />
情報を登録する?
<input type="radio" id="remember" name="bakecookie" onclick="rememberMe(this.form)" /><label for="remember">はい</label><input type="radio" id="forget" name="bakecookie" onclick="forgetMe(this.form)" value="Forget Info" style="margin-left: 15px;" /><label for="forget">いいえ</label><br style="clear: both;" />
</p>
<p><label for="text">コメント:</label><br />
<textarea tabindex="2" id="text" name="text" rows="10" cols="50"></textarea></p>
<div align="center">
<input type="submit" tabindex="3" name="preview" value=" 確認 " />
<input style="font-weight: bold;" tabindex="4" type="submit" name="post" value=" 投稿 " />
</div>
</form>
</div>
<script language="javascript" type="text/javascript">
<!--
if (commenter_name) {
document.getElementById('thanks').style.display = 'block';
} else {
document.write('サイン・インしていません。このサイトにコメントをする前に登録してください。 <a href="<$MTRemoteSignInLink static="1"$>"> サイン・イン</a>');
document.getElementById('thanks').style.display = 'none';
}
// -->
</script>
<MTElse>
コメント登録機能を利用するには、TypeKey トークンを設定してください。
</MTElse>
</MTIfNonEmpty>
<MTElse> <MTTemplateNote value="Case of registration not required">
<MTElse> <MTTemplateNote value="Case of comments not required">
<MTIfNonEmpty tag="MTTypeKeyToken">
<MTIfRegistrationAllowed>
<script type="text/javascript" src="<MTCGIPath><MTCommentScript>?__mode=cmtr_name_js"></script>
<script language="javascript" type="text/javascript">
<!--
if (commenter_name) {
document.write('サイン・インを確認しました、', commenter_name, 'さん。コメントしてください。 (<a href="<$MTRemoteSignOutLink static="1"$>">サイン・アウト</a>)');
} else {
document.write('TypeKey ID を使って <a href="<$MTRemoteSignInLink static="1"$>"> サイン・イン</a> してください。');
}
// -->
</script>
</MTIfNonEmpty>
</MTIfRegistrationAllowed>
<form method="post" action="<$MTCGIPath$><$MTCommentScript$>" name="comments_form" onsubmit="if (this.bakecookie[0].checked) rememberMe(this)">
<input type="hidden" name="static" value="1" />
<input type="hidden" name="entry_id" value="<$MTEntryID$>" />
<div id="name_email">
<p><label for="author">名前:</label><br />
<input tabindex="1" id="author" name="author" /></p>
<p><label for="email">メールアドレス:</label><br />
<input tabindex="2" id="email" name="email" /></p>
</div>
<MTIfNonEmpty tag="MTTypeKeyToken">
<MTIfRegistrationAllowed>
<script language="javascript" type="text/javascript">
<!--
if (commenter_name) {
document.getElementById('name_email').style.display = 'none';
}
// -->
</script>
</MTIfNonEmpty>
</MTIfRegistrationAllowed>
<p><label for="url">URL:</label><br />
<input tabindex="3" type="text" name="url" id="url" />
保存しますか?
<input type="radio" id="remember" onclick="rememberMe(this.form)" name="bakecookie" /><label for="remember">はい</label><input type="radio" id="forget" name="bakecookie" onclick="forgetMe(this.form)" value="Forget Info" style="margin-left: 15px;" /><label for="forget">いいえ</label><br style="clear: both;" />
</p>
<p><label for="text">コメント:</label> <MTIfAllowCommentHTML>
(書式を変更するような一部のHTMLタグを使うことができます)</MTIfAllowCommentHTML><br/>
<textarea tabindex="4" id="text" name="text" rows="10" cols="50"></textarea></p>
<div align="center">
<input type="submit" name="preview" tabindex="5"
value=" 確認 " />
<input style="font-weight: bold;" type="submit" name="post"
tabindex="6" value=" 投稿 " />
</div>
</form>
</MTElse>
</MTIfRegistrationRequired>
</MTIfCommentsAllowed>
<script type="text/javascript" language="javascript">
<!--
if (document.comments_form.email != undefined)
document.comments_form.email.value = getCookie("mtcmtmail");
if (document.comments_form.author != undefined)
document.comments_form.author.value = getCookie("mtcmtauth");
if (document.comments_form.url != undefined)
document.comments_form.url.value = getCookie("mtcmthome");
if (getCookie("mtcmtauth") || getCookie("mtcmthome")) {
document.comments_form.bakecookie[0].checked = true;
} else {
document.comments_form.bakecookie[1].checked = true;
}
//-->
</script>
</MTEntryIfCommentsOpen>
</MTEntryIfAllowComments>
</div>
</div>
</body>これは Typekey 登録を確認するための MTIfRegistrationAllowed というタグが新たに追加されたことによるものです。
今まではコメント設定（管理メニューの「設定」→「コメントの設定」）で「登録されたコメンターのコメントは許可する」をチェックして、その中の設定項目「Typekey トークン」が未設定の状態でも運用できましたが、3.17 からは再構築時に画像のようなエラーが発生するようになります。
3.17 以前のバージョンでは、許可＆未設定の状態で個別エントリーアーカイブを生成した時に Typekey サイン・インが可能な状態になりますが、適正な設定がされていないため、サイン・イン時にエラーとなります。つまりこのような運用を避けるためにタグが変更されたと考えられます。
「Typekey トークン」に適当な文字列を設定すれば再構築は可能になるようですが、本質的な解決ではありません。適正な TypeKey の設定方法についてはTypeKeyの使い方を参照ください。
Movable Type 3.17用テンプレート（個別エントリーアーカイブ）
Category：[テンプレート]
Tag：[3.17-ja, IndividualArchive, MovableType, Template]
Permalink
とりあえず1カラム版を公開します（全てのテンプレートに共通です）。変更箇所の詳細は後ほど。
Movable Type 3.17-ja リリース
本日、Movable Type 3.17-ja がリリースされました。
3.151-ja からかなりの修正が施されているようです。個人的にはカテゴリー名に重複した名称を使えるようになっているのが嬉しいです。新しいウェブログを作成した時に日付用の言語が「チェコ語」になる不具合も修正されています。
公開中のテンプレートにつきましては、３カラム固定のメインページ／カテゴリーアーカイブ／日付アーカイブ／個別エントリーアーカイブ／コメント・プレビュー／コメント・エラーについて正常に動作することを確認しております。つまりスタイルが異なる他のテンプレートも正常に動作します。
とり急ぎお知らせまで。
Movable Type のバックアップ方法
基本的な話題ですが、これまで記事にとりあげていなかったので書きます。ご近所さんで下記のサイトを参考にさせて頂きました。ありがとうございました。
注：この記事は Movable Type 3.x の内容です。Movable Type 4.x をご利用の場合は「Movable Type 4 のバックアップ機能」を参照してください。
Movable Type にはデフォルトで用意されているバックアップ機能があります。バックアップ対象は、
- エントリー（投稿者・投稿の状態・投稿時間・カテゴリー等含む）
- コメント（投稿者・投稿日・メールアドレス・URL）
- トラックバック（ブログサイト名・タイトル・送信日時・IPアドレス・概要）
です。
バックアップデータの保存は後述するとおり、手動で行う必要があります。バックアップを周期的に保存することで、運用中のブログが正常に動作しなくなった場合やサーバ移転しの時等に以前の履歴を復旧させることができます。
以下、Windowsでのバックアップ方法を記します。
１．バックアップデータ取得（書き出し）
管理メニューの左メニューにある「読み込み/書き出し」をクリックし、次のページで一番下にある「?からエントリーを書き出す」をクリックします。これでブラウザにバックアップデータが表示されます。ただしWindows・IEでは、バックアップするサイズによっては書き出しにかなりの時間がかかります。また下記のバグがあります。
Internet Explorerではすべてのバージョンに、プレーン・テキストとしてマークされたデータがHTMLとして解釈されるバグがあります。このバグがあると、書き出したデータはすべて1つの行につながってしまいます（「Movable Typeユーザー・マニュアル: エントリーの読み込み」より引用）。このため、Windows では Mozilla 系のブラウザで書き出すことをお勧めします。
表示が完了したら、ブラウザの「ファイル」→「名前をつけて保存」で任意のファイル名（import.txt 等）で保存します。または「編集」→「すべて選択」で選択状態で「編集」→「コピー」し、任意のエディタを開いてペーストします。文字コードはブログの文字コードで保存します。
２．バックアップデータによる復旧（読み込み）
新しく作った Movable Type のブログに先ほどのバックアップデータを読み込ませます。
２．１ ディレクトリ作成
CGIPath（mt.cgi がインストール直後に置かれたディレクトリ）に import ディレクトリを作成します。なお、import パスおよびディレクトリ名は mt.cfg の下記の設定で変更が可能です。
# The filesystem path to the 'import' directory, which is used when importing
# entries and comments into the system--'import' is the directory where the
# files to be imported are placed. This setting defaults to './import', which
# means that the 'import' directory is in the same directory as the 'mt.cgi'
# file; you probably don't need to change this setting.
#
# ImportPath ./import２．２ バックアップデータアップロード
先ほど作った import ディレクトリ配下に、１項で作ったバックアップデータをアップロードします。
２．３ ブログへバックアップデータ読み込み
管理メニューの左メニューにある「読み込み/書き出し」をクリックし、「エントリーの読み込」欄の「エントリーの投稿者を自分にする」にチェックをします。 他にごちゃごちゃある項目の設定はとりあえず不要です。設定が完了したら「エントリーの読み込み」をクリックします。
バックアップが開始すると、ブラウザに読み込み状況が下記のように表示されます。
Importing entries into blog 'hogehoge'
Importing entries as author 'Melody'
Importing entries from file 'import.txt'
Creating new category ('日記')...ok
Saving entry ('1日の出来事')... ok (ID 1)
Saving entry ('2日の出来事')... ok (ID 2)
Creating new comment ('taro')... ok (ID 1)
Creating new ping ('トラックバック')... ok (ID 1)
：サンプルでは上から順に、ブログ名、投稿者名、インポートファイル、カテゴリー作成、エントリー1読み込み、エントリー2読み込み、コメント読み込み、トラックバック読み込み...となります。なおDBがBerkeleyDBの場合、読み込みにかなり時間がかかります。
読み込みが完了すると、
：
All data imported successfully! Make sure that you remove
the files that you imported from the 'import' folder, so that
if/when you run the import process again, those files will not
be re-imported.というメッセージが表示されます。これで正常に読み込まれました。ブラウザはこの状態からこれ以上遷移しませんので、ブラウザのページをひとつ戻る等して管理メニューに戻ります。またこの状態ではDBに書き込まれただけですので、バックアップデータをページに反映させるには再構築します。
２．４ バックアップファイルの削除
import ディレクトリからバックアップファイルを削除します（再実行しないため）。ちなみに重複してバックアップを実行すると同じデータが2つずつ生成されます（前回のデータへは上書きしない模様）。
３．注意事項
読み込み時、上記のような表示になっていない場合、正常に読み込まれていない可能性があります。原因はアップロード時の転送モードがあります。また最後に「All data imported successfully! ...」が表示されてもエントリーやコメントの読み込みで "... ok" が表示されない場合もあります。
さらに、記事やコメントにバックアップデータと同じ形式のデータ、例えば
--------
AUTHOR: Melody
TITLE: 1日の日記
STATUS: Publish
ALLOW COMMENTS: 1
CONVERT BREAKS: __default__
ALLOW PINGS: 1
PRIMARY CATEGORY: 日記
DATE: 06/08/2005 12:33:43 AMという記述があると、読み込み時にエラーになります。このようなケースは稀と思いますが、以前「バックアップがうまくできない」という方からのコメントでバックアップデータがコメント欄に書かれておりまして、正常に読み込めないという事象がありました。
またサブカテゴリーの構成は思い切り崩れます（全てのカテゴリーがトップレベルになります）ので、前の設定をメモしておきましょう。
４．その他
エントリー・コメント・トラックバック以外のデータはバックアップの対象になりません。例えばエントリーで使用した画像は個別に転送してください。またテンプレートやJavaScript外部ファイル、プラグインファイルも別に用意する必要があります。
以上です。
カスタマイズ用クレジットバナー
数名の方からご要望がありました、カスタマイズ用クレジットバナーを作りました。といってもテンプレート用のものから文字を変えただけです。
当サイトで公開しているカスタマイズをご利用くださっている方であればどなたでもお使い頂けます。クレジットバナーはこちらの記事から適宜保存してお使い頂ければ幸いです。もし他にデザインが思いついたら改めて公開します。
それよりも以前使ったフォントが何だったのか分からず、そちらの調査に相当時間がかかってしまいました。古いPC引っ張り出してフォント探したりとか。
で、Small Fonts の 7pt でした（備忘録）。
月送りカレンダー・1日に表示されなくなる不具合を改善
月送りカレンダーには、毎月1日にエントリーが投稿されてない状態でコメントまたはトラックバックを受信すると、カレンダーが表示されない（「404 Not Found」が表示）という既知の不具合があります。このようになる原因は次の通りです。
例えばメインページは、コメントまたはトラックバックの受信を契機に全ての情報が再構築されます。その際、メインページに埋め込まれている月送りカレンダー表示用の iframe タグ
<iframe name="cal-iframe" src="<$MTBlogURL$>archives/calendar/<$MTDate format="%Y/%m/index" $>.php" ...（中略）... marginheight="0"></iframe>にある MTDate（赤色）も更新され、新しい月が設定されることになります。ただしパスが示す先には新しい月のカレンダーが生成されていないため、結果的に「404 Not Found」となります。
新しい月のカレンダーはエントリー投稿によって生成されますので、この不具合を避けるためには、1日になると同時にエントリーするか、事前に次月の日付でテストエントリーを投稿し、即削除します（生成されたカレンダーは削除されません）。
で、月初めにこのエラーが出る度に「来月こそ早めにテストエントリーを」と固く誓うのですが、日が経つと忘れてしまい、同じ失敗の繰り返しです。そもそも力任せな解消方法なのが不本意です。
ということで解消方法です。以前はPHPによる対処を掲載していましたが、The blog of H.Fujimoto さんに MTタグによる解消方法を教えて頂きましたので（コメント No.22）、それをそのまま使わせて頂きます。
１．テンプレート修正
iframe タグの src 属性を下記のように変更します。これで常に最新エントリーの最終月を取得することができますので、1日にカレンダーが表示されなくなる不具合が解消します。
<iframe name="cal-iframe" src="<$MTBlogURL$>archives/calendar/<MTEntries lastn="1" sord_order="descend"><$MTEntryDate format="%Y/%m/index" $></MTEntries>.php" ...（中略）... marginheight="0"></iframe>Movable Type 3.17日本語版を6月9日に提供開始
公式サイトより次バージョンの案内がありました。米国では本日3.17が提供されたようで、当初日本では6月9日に3.16が提供される予定でしたが、3.16のバグフィックス版らしい3.17がリリースされたことを受けて、3.17の提供に変更になったようです。
余談ですが、この手のニュースに気がついてジャンプするとかならず先に投稿されている Magic White さんでした。
TB企画 【あなたの好きなブログサイトを教えてください】
いつもお世話になっている今日の覚え書きさんが20万HIT＆ちょっと遅れた1周年となりました。おめでとうございます。
以前に一度ご紹介させて頂いてます通り、公開テンプレートを素敵なデザインに変更されており、自然に惹きつけられる文章と安定したアクセスで20万HITをハイペースで達成されたようで、これからもますますのご発展をお祈り申し上げます。
ということでお題目の記念TB企画へのエントリーです。ご近所さんを選ぶと枚挙に暇がないので、やや距離感のある（？）サイトを一言コメント付きでピックアップさせて頂きました。
- hail2u.net サイトデザインが気に入ってます。
- N-blog 個人的に好きな文体なので。そういう訳でストレートな発言も楽しめます。
- Ogawa::Memoranda 読み応えのあるコンテンツに時々垣間見えるユーモアが絶妙。
TypeMover プラグインによるバックアップ・リストア
Category：[blog]
Tag：[Backup, Customize, ManagementPage, MovableType, Plugin, TypeMover]
Permalink
TypeMover という、Movable Type のほぼ全てのデータ（エントリー・テンプレート・コメント・トラックバック・カテゴリー・ウェブログの設定・投稿者）をバックアップおよびリストアするというプラグインがあるようで、試しにインストールしてみました。
参考サイトは下記です。ありがとうございました。
Google で検索したところこの辺りでも以前、一瞬話題になっていました。
以下カスタマイズ方法ですが、最後まで動作確認できていないことを予め申し上げます。
１．アーカイブのダウンロード
TypeMover のページよりダウンロード（Installation という項目にある TypeMover-1.0.4.zip または TypeMover-1.0.4.tar.gz をクリック。ダウンロードしたアーカイブを解凍すると TypeMover ディレクトリはあるので、ディレクトリをそのままplugins ディレクトリ配下にアップロードします。
２．TypeMover 起動
 管理画面を起動するとTypMover のプラグインが表示されます（左）。 |
 プラグインタイトルの「TypeMover」のリンクをクリックすると TypeMover の管理画面が起動します（左）。 |
３．FTP設定
上記画面の Migrate or backup a weblog の Server FTP に下記の値を設定します。
- ftp://{user}:{password}@{server}/{path}
各項目の設定内容は次の通りです。
- user：FTP接続時のユーザ名
- password：FTP接続時のパスワード
- server：FTP接続時のホスト名
- path：mt.cfg や mt.cgi のあるディレクトリまでのルートからの絶対パス
TypeMover の内部動作的には、server/user/password を使って ftp 接続およびログインし、ログイン後に path にディレクトリを移動します。私のサイトで例えると、例えば
- user：yujiro
- password：hogehoge
- server：yujiro.dyndns.blog.koikikukan
- path：/home/blog/koikikukan
となっていれば、Server FTP のテキストエリアに
- ftp://yujiro:hogehoge@yujiro.dyndns.blog.koikikukan/home/blog/koikikukan
と設定します。
設定後「Proceed」をクリックします。
３．バックアップ対象ウェブログ選択
 正常にFTP接続できれば左の画面に遷移し、「Select weblog to migrate or backup」という下にウェブログを選択するフォームが表示されます。選択できるようになっているのは複数のウェブログを作成している場合のためです。サンプルではひとつのウェブログしか作っていないので「First Weblog」のラジオボタンを選択して「Proceed」をクリックします。 |
４．バックアップまたはリストア
 バックアップ元のブログが決まったらバックアップまたはリストアのいずれかを設定します（左）。バックアップの場合はバックアップをテキストデータとして取得します。「What do you want to do with the backup of 'First Weblog'? 」の下にある「Download Backup」のリンクを右クリックして「対象をファイルに保存」を選択してファイルをダウンロードすることができます。このバックアップデータを利用してリストアする場合は、最初の画面の下にある「Or restore a previously made backup」の「Backup File」に指定して「Proceed」をクリックすることでリストアします。 リストアする場合、画面の「Restore 'First Weblog' in this server」でリストア先のウェブログを選択（新規ウェブログまたは既存のウェブログ）して、その下の「What do you want to restore from 'First Weblog'?」でリストア対象のデータを選択します。選択が完了したら「Proceed」をクリックします。リストアを選択した場合はバックアップデータを取得せずそのまま他のブログへデータを転送するようです。 |
５．リストア実行結果
 サンプルではリストア先を「As a new weblog」を選択、全てのデータをリストア対象として実行してみましたが、左の画面に切り替わったままストップしてしまい、リストアが進行しない（プログレスバーが進まない）模様です。その後 TypeMover の３項の画面に戻ると新しいブログが作られているように見えましたが、通常の管理画面では何も表示されませんでした。期待させてしまってすいませんがリストアで確認できたのはここまでです。 |
６．バックアップ実行結果
バックアップデータはそれなりのものが取得できましたが、データのリストアについては５項と同様の結果です。
７．途中で発生したエラーについて
途中までうまく動作しているように書きましたが、一番最初の画面で下記のようなエラーが発生し、3回ほどつまづきましたので、FAQとして記しておきます。環境の違いによっては正常に動作するかもしれませんので参考ということで。
Q：最初の画面でリンクをクリックすると、URLがローカルサイトパス＋絶対パス（=不正なURL）になる
A：URLを修正して実行
Q：リンクをクリックすると下記のエラーが発生
Got an error: Bad ObjectDriver config: Your DataSource directory ('./db') does not exist.A：mt.cfg の DataSource を絶対パスに修正してください
Q：リンクをクリックすると下記のエラーが発生
エラーが発生しました:
テンプレート「../../plugins/TypeMover/tmpl/start.tmpl」の読み込みに失敗しました: HTML::Template->new() : Cannot open included file plugin_header.tmpl : file not found. at ../../extlib/HTML/Template.pm line 2024.A：plugins/TypeMover/tmpl 配下のファイルを tmpl/cms 配下にコピーして再度実行してください。
MyBlogList が表示されない件
2005.06.02 追記：復旧しました。
ただいま MyBlogList が表示されない件ですが、ドメイン更新が出来ていなかったため myblog 系のサービスが全て停止しているようです。
で知りましたが、ドリコム代表取締役・内藤裕紀さんのブログによると、
弊社の担当のほうで管理画面よりドメインの更新をしようとしたところ、エラーになってしまったため、管理会社様の担当の方にお問い合わせをし、更新の旨を伝えて進めてもらっていたはずだったのですが、JPRS側が入金を確認しないと更新が出来ないということで作業がストップしていたようです。
ということらしいです。詳細は上記のページへ。
