
Movable TypeのMTタグを使って、メタデータ部分に下記のリンクアイコンを追加しました。
- このエントリーをはてなブックマークに追加
- 自分のブログにはてなブックマークの「users」を表示
- del.icio.usに追加のアイコン
- Twitter経由でこのエントリーをコメントする
Movable Typeにおけるメタデータとは、一番初めに貼り付けた画像の部分を指します。
ソースを公開します。「メタデータ」テンプレートを以下に書き変えました。
<!-- 投稿日と投稿者 -->
<$MTEntryDate format="%Y-%m-%d"$> by <$MTEntryAuthorDisplayName$> |
<!-- カテゴリの表示 -->
Category: <MTEntryCategories glue=","><a href="<$MTCategoryArchiveLink$>"><$MTCategoryLabel$></a></MTEntryCategories> |
<!-- コメント数 -->
<a href="<$MTEntryPermalink archive_type="Individual"$>#comments" title="comments<$MTEntryID$>"><$MTEntryCommentCount$> Comments</a>
<!-- このエントリーをはてなブックマークに追加 -->
<a href="http://b.hatena.ne.jp/append?<$MTEntryPermalink$>"><img src="http://naglly.com/append.gif" alt="このエントリーをはてなブックマークに追加" title="このエントリーをはてなブックマークに追加" width="16" height="12" border="0" /></a>
<!-- はてなユーザー数の表示 -->
<a href="http://b.hatena.ne.jp/entry/<$MTEntryPermalink$>"><img src="http://b.hatena.ne.jp/entry/image/large/<$MTEntryPermalink$>"></a>
<MTIf name="entry_template"><!-- 記事のテンプレートのみ表示 -->
<!-- このエントリーをdel.icio.usに追加 -->
|<a href="javascript:location.href='http://del.icio.us/post?url='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title)"><img alt="delicious.gif" src="http://naglly.com/delicious_icon.gif" width="12" height="12" border="0" alt="このエントリーをdel.icio.usに追加する" title="このエントリーをdel.icio.usに追加する" /></a>
<!-- このエントリーをTwitter経由で投稿 -->
<a href="http://twitter.com/home?status=@naagle%20(<$MTEntryPermalink$>)" title="Twitter 経由でコメントする"><img alt="twitter.png" src="http://naglly.com/twitter.png" width="16" height="16" border="0" /></a>
</MTIf>
投稿日と投稿者、コメント、カテゴリあたりはお好みで。
はてなとdel.icio.us、Twitterは、あらかじめアイコンを自前の領域へアップロードします。

はてなブックマークに追加アイコン

del.icio.usに追加のアイコン

Twitterアイコン
del.icio.usへの追加リンクは、Javascriptを使い、今表示しているページのURLを取得している為、TOPページからやカテゴリーアーカイブなどからは表示させないほうが良いです。個々のエントリーのみで追加リンクを表示させるために「<MTIf name="entry_template">」を使っています。
また、Twitterに関しては、「@naagle」の部分を自分のIDに変えると良いです。
ちょこちょことデザインをいじっています。基本色は白なんですが、やっぱり画像くらいは入れようかと思いまして、手書きで一筆書いてみました。「な」です。なぐの「な」。
ファビコンも同じにしました。とりあえずしばらく固定。
ファビコンの作り方は、下記参照
ブログ:5分で出来るfavicon.ico(ファビコン)の作り方
本題は、コメントが投稿出来なかった件です。Movable Type4.01から4.2にバージョンアップしてから、ずーっとコメント投稿が出来なかったようなのです。とある方からメッセージ頂きまして、ようやく気が付きました。非常に助かりました。
そもそもあんまりコメント投稿が無い独りよがりブログなもんで、全く気が付きませんでしたよ。
とほほ・・・。
で、おかしかった場所はすぐに判明したので速攻で直したのですが、これがMovable Typeのバグなのか、テンプレート(小粋空間さんのをカスタマイズして使用)のバグなのか良く分かりません。
具体的な不具合としては、コメントのポストを行うフォームのCGIが、下記のアドレスになっていました。
http://naglly.com4/mt-search.cgimt-comment.cgi
こんな実行CGIは存在しませんので、当然のごとくエラー(404 file not found)になってしまいます。
おかしいと思われる、「コメント入力フォームのテンプレート」が以下の様になっていました。
<form method="post" action="http://naglly.com4/mt-search.cgi<$MTCommentScript$>" name="comments_form" id="comments-form" onsubmit="if (this.bakecookie.checked) rememberMe(this)">
太字のところが強烈にだめだめです。これでは、変なURLを発生させてしまいます。下記に直しました。
<form method="post" action="http://naglly.com4/<$MTCommentScript$>" name="comments_form" id="comments-form" onsubmit="if (this.bakecookie.checked) rememberMe(this)">
これでとりあえず復旧。しかし、なんでこんなところにmt-search.cgiが混入してるのだろう。よく分からない。
ともかく、コメントは入るようになりました。ただ、コメント投稿が異様に重たいため、投稿完了までたどり着きませんが・・・。でもちゃんとコメントは入りますのでご安心下さい。
ひーこら言いながら何とか時間を裂いて、ようやくMovable Type4.2へバージョンアップしたのに、もう4.21が出てもうた。ひー。
Six Apart - Movable Type News: [重要] Movable Type 4.21 出荷開始
小粋空間: Movable Type 4.21 リリース
[重要]なんて書いてありますが。
* カスタムフィールドのデータ: エンタープライズ, コミュニティー・ソリューション含む MT4.1x から MT4.2 にアップグレードを行う際、その Movable Type でカスタムフィールドを利用しており、100以上のデータを持っていた場合、カスタムフィールドのデータを一部消失する可能性があります。
* ブログの優先アーカイブタイプ設定: グローバルテンプレートを削除すると、各ブログの優先アーカイブタイプ設定の内容が消えてしまいます。
あまり関係なさそうなので、とりあえず放っておく。なんせ、乗せかえる時間が無い。
新しいからってすぐ入れるもんじゃないね。教訓にする。
無事Movable Type4.01 → Movable Type4.2へのアップグレードに成功しました。
だいぶ軽くなった印象です。やってよかったです。記事数が600近くあるこのブログでは、色々と動きが重たく、新規の記事投稿もままならない状態でした。今は、新規投稿が一応最後まで出来ています。
あとは、ブログの全再構築についてですが、やはり半日以上掛けても終わらない状態です。設定をスタティック(静的、URL固定)にしているのですが、デザインを大幅に変えたとき、再構築がままならないので困っています。
更なるスピードアップを願いたいところです。もう少し待ちましょう。
アップグレード時に躓いた点があるので、そのトラブルシューティングなど書きます。
データベースのアップグレード時に以下のメッセージが出て止まってしまう
Movable Type 4.2 へのアップグレード | Movable Type 4 ドキュメントに従ってアップグレードをしていたのですが、下記の様なメッセージが出てアップグレードが終わってしまいました。
failed to execute statement ALTER TABLE mt_ts_funcmap ADD CONSTRAINT mt_ts_funcmap_funcname UNIQUE (ts_funcmap_funcname): Duplicate key name 'ts_funcmap_funcname' at lib/MT/Upgrade.pm line 2604
画像は以下のように出ます。

メッセージを素直に解釈すると、mt_ts_funcmapと言うテーブルのユニークインデックス"ts_funcmap_funcname"が重複しているため、アップグレード出来ないと言う事になります。
もしかしたら、ここのBig-Netだけの問題なのかも知れません。
一度サポートの方に問い合わせをしたのですが、単純に重複しているインデックス消せば良いと言う事に気付いたので早速実行に移しました。
Big-Netは、SSLでリモートログインできるので、こういうとき便利です。リモートログイン出来ないレンタルサーバーサービスだと、こういうことは出来ません。
おそらく素直に、サポートへ頼むしかないと思います。
解決方法
以下のようにMysplにログインします。
$ mysql -uユーザー名 -p データベース名
Enter password: パスワード
mysql>
原因となっているのは、mt_ts_funcmapと言うテーブルのユニークインデックス"ts_funcmap_funcname"なので、これを削除します。
mysql> drop index ts_funcmap_funcname on mt_ts_funcmap;
これで、もう一度アップグレードを実行します。アップグレードは頭からやり直してくれるので問題ありません。
僕の場合、もう一箇所不具合が出ました。
今度は、mt_ts_jobテーブルの"mt_ts_job_uniqkey","mt_ts_job_funcid"インデックスです。これも消去します。
mysql> drop index mt_ts_job_uniqkey on mt_ts_job;
mysql> drop index mt_ts_job_funcid on mt_ts_job;
これで、無事アップグレードできました。
まとめると、Movable Type 4.01から4.2へのアップグレードの場合、下記を消す必要があるかもしれません。
- テーブル:mt_ts_funcmap
インデックス:ts_funcmap_funcname
- テーブル:mt_ts_job
インデックス:mt_ts_job_uniqkey,mt_ts_job_funcid
また、何か不具合が起きたら報告します。
この時を長いこと待っていました。
『Movable Type 4.2 出荷開始』の記事を見て、早速Movable Type4.2にアップグレードしました。
とりあえず投稿のテストです。
いくつか躓きましたので、その事についてはまた明日にでも。
再構築が軽くなったというもっぱらの評判なので、これから全て再構築します。
タイトルは堅苦しくなっちゃいましたが、要は、最近僕がブログとmixi、どう切り分けてるかと言う実体験を書きます。自分で言うのもなんですが、今はかなり良い感じで、ブログとミクシィの連携が出来ています。
まず、基本的にミクシィはブログとの連携機能を行わず、ミクシィ日記にして、友人だけの公開にします。

設定はミクシィ日記。

設定は友人のみ。
僕も一番初めは、「ブログ連携」が便利だと思いブログ連携の設定にしていたのですが、ブログ連携にしてしまうと、ミクシィのみでコメントを書き込みしたい人が思うように書き込み出来ません。マイミクの人と良好な関係を築く為には、かならずミクシィ日記の設定にした方が良いと思います。また、日記は友人のみにして置いた方がより親密なコメントが頂けるので、深いコミュニケーションが取れます。
そしたら、「mixiとブログ、両方投稿しなければいけないし、めんどうじゃん。」という方、大丈夫です。Movable Typeには、mixiとMovable Typeを連携させる非常に便利なプラグインがあります。
mixiSync for MT4
リンク先を見て頂ければすぐ分かると思いますので、詳しい解説は除きます。とにかく便利です。MovableType用の記事が出来上がったら、下記のボタンを押せば、mixiの日記投稿画面に一発で転送してくれます。

で、転送後のmixi日記投稿欄。

※クリックすると大きな画面が開きます、
HTMLタグの使えないmixi日記ですが、リンクはうまく変換してくれます。また、画像は反映されないので、別途投稿する必要があります。残念ながら、全自動じゃないです。まぁ、一手間掛かりますね。
日記の最後に、せめてもの主張として自分のブログのリンクでも貼っておきましょう。気が向いたらたまに訪問してくれます。
で、現在、僕のネット界隈ですが、mixiでしかコメントのやりとりしない人と、ブログ上でしかコメントのやりとりしない人がうまい事2分されています。切り分けがしっかりしていてとても分かりやすいです。
しかし最近は妙に波長が合ってしまう、新しいマイミクさんのmixi日記に感化されて、色々考え事をしてしまい、そこに対するコメントを考えるのがなかなか楽しくなってしまいました。
割合的に、そっちの方へ時間を多く割いてしまう今日この頃です。
参照
MT4:Movable Type4.01インストール備忘録(詳細) #1
MT4:Movable Type4.01インストール備忘録(詳細) #2
MT4:Movable Type4.01インストール備忘録(詳細) #3
MT4:Movable Type4.01インストール備忘録(詳細) #4
MT4:Movable Type4.01インストール備忘録(詳細) #5
MT4:Movable Type4.01インストール備忘録(詳細) #6
出来ればもっと1記事にまとめて一気に投稿したいところなのですが、現在、あまり長い記事を書くと、更新を行う時に負荷が高すぎて構築が途中で止まってしまいます。レンタルサーバーなので仕方ないところはあるのかもしれませんが、エントリー投稿時にいちいち時間をとられるのです。何かいい対処法は無いか悩んでいます。
更新時のエラーについては、おそらく、このバージョンの根本的な部分なのだと思います。もうすでにMovable Typeの最新バージョンは4.1なので、舌の根も乾かぬうちにバージョンアップって言うのもありえるかもしれません。Mavable Typeの配布元、シックスアパートもその辺は認識しているようで、バージョンアップするごとに更新時間の軽減が謳われているいます。
昔のバージョンから引き続き使っているツール、ブログパーツ等
昔から使っているツールや、ブログパーツを新しいバージョンの方に以降します。ちょっと横着ですが、過去記事のリンクを貼ります。もし興味のある方がいれば、探ってみてください。
ブログ:釣りブログ必須の潮汐と月齢ブログパーツ
検索向けAdSenseをドメイン以外で使う方法
月別アーカイブの表示変更 #5
ブログ:5分で出来るfavicon.ico(ファビコン)の作り方
ブログ:トータルのブログ内人気エントリーを表示
ブログ:はてなブックマーク(はてブ)連動実験中その3
MT4:お知らせ、携帯向けサイトをオープンしました
ブログランキングのアイコン、QRコードの画像をヘッダー部に移動
右サイドバーのエリアをもっと有効に使いたい為、ランキングサイトのアイコンと携帯QRコードをヘッダに押し込めます。まずは、ランキングサイト用のスタイルを作成します。
スタイルシート(メイン)に下記を追加
/* ランキングサイト */
.ranking-site {
margin: 5px 0px 0px 268px;
}
ヘッダーを書き換え
ヘッダー部のボックス内に画像等を配置する
<div id="header">
<h1 id="blog-name"><a href="<$MTBlogURL$>" accesskey="1"><$MTBlogName encode_html="1"$></a></h1>
<MTIfNonEmpty tag="BlogDescription"><p class="blog-description"><$MTBlogDescription encode_html="1"$></p>
<span style="color:red"><div class="ranking-site">
<p class="blog-description">ランキングサイト:「良い記事」と感じましたら、クリックお願いします<a href="http://fishing.blogmura.com/" target="_blank"><img src="http://fishing.blogmura.com/img/fishing80_15_1.gif" width="80" height="15" border="0" alt="Blog村" /></a> <a href="http://blog.with2.net/link.php?552782" target="_blank"><img alt="人気RANKING" src="http://naglly.com/archives/ninki_ranking.gif" width="80" height="15" border="0" /></a> <a href="http://naglly.com_m/index.cgi"><img src="http://naglly.com/QR_Code.jpg" width="98" height="98" border="0" alt="携帯サイト" /></a></p>
</div></span>
それにしてもブログデザインと言うのは、やり始めたら終わりが無い悪魔の作業です。こういうものは正解と言うものが無いのである程度で妥協しないと、永遠に終われません。
デザイン弄りについてはそろそろ見切りをつけます。デザインに凝ってばかりはいられません。ブログのメインコンテンツはデザインではなく、あくまで文章ですから。
参照
MT4:Movable Type4.01インストール備忘録(詳細) #1
MT4:Movable Type4.01インストール備忘録(詳細) #2
MT4:Movable Type4.01インストール備忘録(詳細) #3
MT4:Movable Type4.01インストール備忘録(詳細) #4
MT4:Movable Type4.01インストール備忘録(詳細) #5
インストール備忘録の続きです。前回は、全体的な色味やデザインの調整まで書きました。今回はデザイン以外で、「最低限、これやっといた方が良いんじゃねーの」って設定です。
ブログのPHP化
ブログパーツや、自前のアクセス解析などのツールを仕込む上で、公開するファイルをPHP化することはとても重要です。また、構築時の負荷や構築時間を減らす効果もあるようです。
具体的には、下記の場所を変更します。
ダッシュボードの設定 → ブログの設定 → 公開 → アーカイブの拡張子 → "php"に変更
※この後がとても重要。下記のタグをコメント化します
<?xml version="1.0" encoding="UTF-8" ?>
下記のようにコメント化
<!-- ?xml version="1.0" encoding="UTF-8" ? -->
これを必ずやらないと、この一行をPHPの命令と解釈してブログが一切動かなくなります。
コメント投稿に関する変更
これは個々にポリシーがあると思いますので、設定方法は各自で違うと思われます。当ブログは、最低限コメントスパムが発生しなければOKってことで、最低限のゆるいセキュリティーレベルにしています。基本的に誰でも承認なしでコメントが投稿できます。
ただし、Captchaと言われる、「画像の中に見える文字を入力してください。」と言う最低限の認証だけは入れています。これを入れておけば、まずスパムはほとんど発生しません。最悪発生しても、かなりの頻度で自らのブログを監視してるので、すぐ消します。
設定 → ブログの設定 → コメント
- コメント許可
コメントを受け付けるをチェック
- コメントポリシー
即時公開する条件 全て自動的に公開する
HTMLを許可しない
メール通知を行わない
- 表示オプション
コメントの表示順:昇順
URLを自動的にリンク:ON
改行を変換
CAPTHAプロバイダ:Movable Type標準
コメントの確認ページ:ON
設定→ブログの設定→登録/承認
- ユーザー登録:なし
承認方法:承認なしコメントのみチェック。あとは何もチェックしない。
カテゴリー表示の変更
カテゴリーの一覧をサブカテゴリーまで表示します。かつ、最新の記事一件をその下にぶら下げます。サイドバーのカテゴリー部分を下記に差し替えます。
<dt class="sidetitle">
カテゴリー
</dt>
<dd class="side">
<div id="categories">
<MTTopLevelCategories>
<MTSubCatIsFirst><ul></MTSubCatIsFirst>
<MTIfNonZero tag="MTCategoryCount">
<li><a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryDescription$>"><MTCategoryLabel></a>[<$MTCategoryCount$>]<br />
<MTEntries lastn="1" >└<a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a></MTEntries>
<MTElse>
<li><MTCategoryLabel>
</MTElse>
</MTIfNonZero>
<MTSubCatsRecurse>
</li>
<MTSubCatIsLast></ul></MTSubCatIsLast>
</MTTopLevelCategories>
</div>
</dd>
</MTIfArchiveTypeEnabled>
</MTIf>
次こそ最終回!と、いつも言ってるのだけど、果たして終われるだろうか。
参照
MT4:Movable Type4.01インストール備忘録(詳細) #1
MT4:Movable Type4.01インストール備忘録(詳細) #2
MT4:Movable Type4.01インストール備忘録(詳細) #3
MT4:Movable Type4.01インストール備忘録(詳細) #4
今回で終わりにしようともくろんでいたのですが、記事が長すぎてサーバに弾かれ投稿できなかったため、少し記事を分けて書きます。ですので、まだ続きます。
タイトルバックに画像など、ヘッダの変更
・スタイルシート(メイン)変更前
* ヘッダ */
#header {
padding: 15px;
border-bottom: 1px solid #669;
color: #999;
background: #8fabbe;
text-align: left;
}
・スタイルシート(メイン)変更後
/* ヘッダ */
#header {
padding: 18px;
color: #999;
background: #8fabbe;
height: 150px;
text-align: left;
background-image: url(http://naglly.com/title_bak.jpg);
background-repeat: no-repeat;
}
ヘッダボックスのサイズを指定。バックグラウンドイメージの指定。外枠の消去を行った
色合い調整など
これは完全に好みの問題です。一例を書きます。
・ブログ記事タイトル、変更前
/* ブログ記事タイトル */
.entry-header {
margin: 15px 0 0;
padding-left: 5px;
border-left: 3px solid #999;
font-size: 100%;
font-weight: bold;
}
・ブログ記事タイトル変更後
/* ブログ記事タイトル */
.entry-header {
margin: 15px 0 0;
padding-left: 5px;
font-size: 100%;
font-weight: bold;
background:#E6F3FF;
border:2px solid #aaa;
border-width:1px 0;
}
バックグラウンド色の指定、上下にボーダーを入れました。
・引用、変更前
/* 引用 */
blockquote {
width: auto;
margin: 15px 20px 0;
padding: 10px;
border: 1px solid #666;
background: #f6f6f6;
font-size: 83.3%;
line-height: 1.5;
}
・引用、変更後
/* 引用 */
blockquote {
width: auto;
margin: 15px 20px 0;
padding: 10px;
border: 2px solid #666;
background: #dfd;
font-size: 83.3%;
line-height: 1.5;
border-style: dotted;
}
ボーダーとバックグラウンド色の変更。
リンクを踏んだ形跡を残したいため、一度クリックしたリンクの色を変える
・リンクスタイル、変更前
/* リンク */
a,
a:link,
a:visited {
color: #069;
text-decoration: none;
}
a:hover {
color: #069;
text-decoration: underline;
}
a:active {}
・リンクスタイル、変更後
/* リンク */
a {
color: #6699cc;
text-decoration: none;
}
a:link {
color: #6699cc;
text-decoration: none;
}
a:visited {
color: #336699;
text-decoration: none;
}
a:hover {
color: #FF6600;
text-decoration: underline;
}
a:active {
color: #FF6600;
}
このペースだと、あと2記事くらい続きそうです。
参照
MT4:Movable Type4.01インストール備忘録(詳細) #1
MT4:Movable Type4.01インストール備忘録(詳細) #2
MT4:Movable Type4.01インストール備忘録(詳細) #3
少し間が空きましたが、Movable Type4.01インストール備忘録の続きです。前回は、Movable Type4.01を公開したところまで書きました。次はデザインの調整です。
だらだら書いていると忘れそうなので、今日で完結と言うことで2つの記事に分けて一気に書きます。ちょっと長文です。
まずは基本的なデザイン構成から。
パカチョン的にデザイン設定を終わらせるには、ダッシュボードから、「デザイン→スタイル」を選び、規定のスタイルから好きなものを選択すれば一応は完了します。これは新しいMovable Typeの機能で、これはこれでとても便利なのですが、それではあまりにもそっけ無いので、別のところから新しいテンプレートを持ってきます。
色々とネットを見てまわったのですが、僕は元々左右にサイドバーがある、3カラムのタイプが好きなので、いつも困ったときに参照させて頂いている、小粋空間様のサイトからテンプレートを頂きました。
参照先
小粋空間: Movable Type テンプレート
(ページ自体がとてつもなく長いんで、気の短い方は、「template_4_0」と検索を掛けるとダウンロードすべきリンクに一発で飛びます。)
このテンプレートは複数のバリエーションに対応しているのですが、僕はこの中の「3カラム(中央カラム固定・以下同様)」と言うスタイルを使っています。サイズ固定の3カラムスタイルです。
上記のリンクから、テンプレートのファイルをダウンロードしたら、ファイルを解凍してデフォルトテンプレートに対応する元々のファイルと入れ替えます。ファイル名が同じものを探して上書きする感じです。ただし、このうち、「サイドバー」 と「サイドバー2」は、全く新規のテンプレートとして作成します。
また、テンプレートのカスタマイズですが、「3カラム(中央カラム固定・以下同様)」と言うレイアウトは元々のデフォルト設定なので、特に触る必要無しです。別のレイアウト(2カラムや、リキッドタイプ)などに変える場合はbodyタグのclass属性を変更する必要があります。
これで基本的なテンプレートが出来上がりました。次は、自分なりのカスタマイズをしていきます。まずは、右サイドバーと左サイドバーのサイズを広げるため、「スタイルシート(メイン)」を変更しました。なぜ変更するかというと、185pxと言うボックスサイズは、最近のブログパーツを埋めるにはちょいと小さいからです。
スタイルシート(メイン)の下記の位置を変更します。
.layout-three-column #links-left-box,
.layout-three-column #links-right-box {
float: left;
width: 185px;
}
を下記に変更。
.layout-three-column #links-left-box,
.layout-three-column #links-right-box {
float: left;
width: 210px;
background-color: #eee;
}
次は、細かいデザインやカスタマイズです。