MTカスタマイズ Archive

今月（2012年4月）サイト内でカスタマイズした箇所をまとめたエントリです

• Tag Archives (タグアーカイブ)のタイトルの表示形式を変更
• はてな ふるふるブックマーク機能を削除
• WordPress の404ページにもGoogle のリンクヘルプ導入
• FancyBox ライブラリをヴァージョン 2.x系に変更
• サイト内検索がサイドバーメニューで上位に表示されるように変更した
• Googleカスタム検索ページのカスタマイズ
• Disqus コメントのpadding がなくなっていたのを修正

Tag Archives テンプレートにおいては、

• Tag Archives : タグネーム « ブログ名

という形式でしたが以下のように階層に変更

• タグネーム « Tag Archives « ブログ名

WordPressのテーマには、今使っているテーマだと、ランダムリンクとタグ一覧がでるようになっていますが、Google検索のヒントから探すことも出来るように設置してみました。

404 ページのカスタマイズ - ウェブマスター ツール ヘルプ

設置はテーマ編集で404テンプレートを編集（当該テンプレートファイルに対して一時的にパーミッションを書込み可能にしておく必要があります）。上のリンク先にスニペットがでるのでブログトップURLをいれればOK

利用中のFancyBoxのヴァージョンを2に移行しました

FancyBox(ヴァージョン2以降） は 以下から

• fancyapps/fancyBox · GitHub

設置方法は説明ページにあるとおり。

ダウンロードファイルを任意のスクリプト用のディレクトリにアップロード

jQury 1.7.x を読み込む

jquery.fancybox.css、jquery.fancybox.pack.js をそれぞれ読み込む。

折角なので、Thumbnail Helper という機能も使ってみる事にしました。

Optionally add button and/or thumbnail helpers　というコメント以下のコードで、今回はthumbnail helpers のほうだけ使用することにしたので、jquery.fancybox-thumbs.cssとjquery.fancybox-thumbs.js を読み込むようにしました。

Thumbnail Helpers を使う場合は、特定のclassを割り当て、jQueryのコードをThumbnail Helpers対応のコードを読み込む必要があります。

この機能は、モーダル表示中に下部にサムネイル画像が表示されてそのサムネイルをクリックすることでも画像を表示させることができるというものです（このエントリにて動作を確認できます）。

そして記事毎で「使う」・「使わない」を選択しておきたいので、MTIFタグによる振り分けを行うことにしました。

条件分岐が以前のものより複雑になるため、fancybox用のモジュールを新たに新設して、モジュール内で分岐処理した後にinclude で取り込むという形であります。

Googleカスタム検索では、テーマを「シャイニー」から「デフォルト スタイル」（Google検索結果風）へと変更。ラベルによる絞り込み機能も追加してみました。これらは、管理画面からの操作で可能です。テーマ変更後は新たにコード取得しなおして検索ページを編集し更新する必要があります。

Disqus コメントの端のの余白が無い状態は以下を追加で対処しました。

• .comments-open-content { padding:2.5em; }

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

• 当ブログのカスタマイズ記録

今月（2012年3月）サイトでカスタマイズした箇所をまとめたエントリです

• コメントをDisqusに切り替え
• Disqus導入に伴い、コメント数カウント表示を廃止
• サイト内検索をGoogle カスタム検索に置き換え
• Internal linkへのrel=nofollowの削除

Disqus導入については以下に記事にしています

• DISQUSへコメントのインポートが完了した
• ブログのコメントにDISQUSを導入

単に設置するだけならば、それほどに時間のかからない Disqus ですが、カスタム設定とかしようとおもうと、結構時間をとったりします（Helpページが英文のみというのもあって）。

disqus_identifier という変数名のセットがあって、そこにユーニークなIDを入れることになっているのですが、説明をみてもよくわからない部分があったので、WordPressのプラグインが出すコードを参考にすると以下のようなパターンなようでした。

• var disqus_identifier = エントリID エントリーパーマリンク

よって、これに値するMTタグは以下のようにしてみることにしました。

ウェブページに「webpageの接頭辞＋ページベース名」を入れることにして、エントリーページはエントリーID＋パーマリンクという形です。

<MTIfCommentsActive>
<$mt:EntryClassLabel setvar="entrytype"$>
・・・・・
var disqus_identifier = <mt:If name="entrytype" eq="ウェブページ">'webpage:<$mt:PageBasename encode_js="1"$>'<MTElse>'<$MTEntryID$> <$mt:EntryPermalink$>'</mt:If>;

＊（注）上のコードは一部抜粋のため、そのままペーストして使うと正常に出力されない場合がありあます。

内部リンクに対するnofollow指定の解除ですが、検索結果ページでパンくずリストか反映されていたりするなど、重要度が低くなってきたので内部リンクへのnofollow は解除していくということとしました。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

• 当ブログのカスタマイズ記録

これまで使用していたMovableTypeシステムのコメント機能をDISQUSのほうに切り替えをしました。

既に、使用中のMTOSとWordPressのほうでは導入しており、ずいぶんと出遅れていますが、このブログとおよびwww.markdiary.com内のページにDISQUSを入れました。

MovableType への DISQUS の設置ですが、DISQUSよりプラグインが提供されています（入手はDISQUSの管理画面よりおこなうことができます）。ですが、今回はプラグイン使用をせずに、Universal Code のほう（install のページで下のほうにある）を利用して行なう事にしました。プラグインとの違いですが、自分でテンプレートを編集の作業がでてくるのと、これまでのMTシステムのコメントからインポートするという機能が利用できないといったくらいです。

WordPressのほうのDISQUSプラグインでは、管理画面からフレーム内にDISQUSサイトの表示ができて管理画面で操作できるのですが、MovableTypeのDISQUSプラグインにはそういった機能はありません（ヴァージョンアップもWordPress用ほどにはおこなわれていないようです）。

ということで、これまでいただいたコメントはDISQUS上で管理しないと割り切っていれば(WXR 自作すればなんとかなりそうだけど、ここでは触れないでおきます)、プラグインでなくて、Universal Code でも特に問題なく使うことができます。

切り替えのメモ

ここからは、MovableTypeでの切り替えのメモとして記しておきます。そもそものDISQUSの登録方法とかは省略します(新UIのほうの画面でみています)。

コードスニペットの入手は、自分が登録したサイト(ドメイン単位とおもわれる)のSettingsタブからInstallタブへ、下部にDisqusアイコンがあるのでクリック。

Embed code に記載されているコードを、コピーしてテキストエディタにペースト。エディタでvar disqus_shortname = 'example' のexampleの文字を、登録したサイトに設定しておいた「ショートネーム」に置き換えします(このショートネームは設定すると後から変更できないことになっているので注意)。

コメントのテンプレートをDISQUS用に差し替える

テーマごとに構造が違うので大雑把な形で書くと以下のようなテンプレートモジュールを作成しておいて、いままでインクルードしていたコメントモジュールと差し替えるだけです。

<mt:Comments>
MTCommentsのループ
これまでいただいたコメント表示を残すためのもの
</mt:Comments>
<!-- DISQUSのコードスニペットここから -->
<div id="disqus_thread"></div> 
・・・・・・・
<!-- コードスニペット最後まで -->

なお、この例ではもとのコメントフォームを一切取り払った形のものです。

コメントフォームは残す形にするとか、noscript要素に独自のフォームをいれてスクリプト停止の環境にもつかえるようにするなどといったカスタマイズも考えられます。

• Dashboard - DISQUS (要ログイン)

今月（2012年2月）サイトのカスタマイズした点をまとめたエントリです

• 更新されない過去記事にメッセージをだすようにした
• Google Website Translatorを一部ページに設置

更新する予定（=気）のない記事には、 @プライベートタグを付与、それによってMTIFタグにより振り分けという、よくある処理です。

Google Website Translatorは、ブログ外のwebページのほうに試験的に設置。これは設定にて、Google Analyticsのプロファイルを使うようにすると、翻訳がつかわれたかどうかも計測（？）できるのだそうです。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

• 当ブログのカスタマイズ記録

今月（2012年1月）本年最初カスタマイズ記録をまとめたエントリです

• 利用中のGoogle Analytics での「サイトの速度レポート」を追加した
• 背景画像の変更

サイトの速度レポートは、簡単にいうと、ページの読み込みの時間を測定するというもののようです。

読み込みの遅いページなどがわかるとのことで、詳しい説明は以下のヘルプページにあります。

• サイトの速度 - アナリティクス ヘルプ

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

• 当ブログのカスタマイズ記録

今月（2011年12月）本年最後のサイトでカスタマイズした箇所をまとめたエントリです

• rel=canonical を個別記事に採用した
• WordPress を3.3にアップデート

canonical リンクは重い腰をあげていれてみることにしました。

MTArchiveLinkで分岐を駆使していれてもいいのですが、いつもの通り当該アーカイブテンプレート内でのカスタマイズがお好みなのでそのように。SetvarBlock でテキトーな変数名設定しておいて、append=を使っておけばなんかスッキリした気分に。

WordPress がついにリリースされましたので、例によって自動アップデート機能でアップデート完了させました。

3.3 「Sonny」と名付けられていまして、これはサキソフォン奏者のSonny Stitt に敬意を表してつけられたのだそうです。（というのは、WordPress日本語のblogのアナウンスに記載されていました。「ソニー・スティット」でWikipediaにのっています。ジャズに明るくないので自分で調べてたりします。WordPressでは、Jazzにちなんだ名前が命名されているようであります）

今回のWordPressアップデートによる不具合への対処等は今のところおこなっていません。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

• 当ブログのカスタマイズ記録

今月（2011年11月）カスタマイズした点をまとめたエントリです

• カスタマイズ記録のページで指定したタグを表示するようにした
• OpenSearchのXMLを変更。Googleカスタム検索へ

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

• 当ブログのカスタマイズ記録

今月（2011年10月）サイトのカスタマイズした箇所をまとめたエントリです

• utilities カテゴリリストの上下paddingの値を少し増やした
• Lightbox表示は、Fancyboxに切り替え
• カテゴリアーカイブページのGooglebotへのアーカイブ拒否
• サイト内検索をGoogleカスタム検索に移行

display:blockのリンク要素のpaddingですが、あまりよくわかっていないのですけれど、タッチパネル系で選択しやすくなるかも（？）というあたりでしょうか。

カテゴリ一覧ページには、metaタグによりGoogleのキャッシュを作らないようにしました。（投稿ごとに変化するので）月別のほうは当月分のみが変化するものなので特に指定してなくてもいいのでないかと判断しました。どちらもnoindexでもいいんですけどアーカイブページをエントランスとするかたもいらっしゃるだろうってことで今の時点ではそのままにしてます。

サイト内検索でAjax Searchを使っていましたが、ブログトップページと一部ウェブページにおいてGoogleカスタム検索のほうに移行しています。

• www.markdiary.com内検索

カスタム検索専用ページの作成ですが、「デザイン」の項目で、「2ページ」というのを選択すると、検索結果を表示させるページのURIとクエリ文字の設定ができるフォームがあらわれますのでそこで必要事項を入力していきます。そのあと「保存してコードを取得」で表示されたコードをコピーします。

あとは、Movable Typeからでもいいので、適当な検索用ページを用意して取得したコードをそのページ内に埋め込んでおきます。

そのあとサイドカラムなどにある検索用のformの行き先(action属性)に作成したページを指定して、クエリで設定した文字（標準ではq）が検索フォームから渡せるようにしておけば完成です。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

• 当ブログのカスタマイズ記録

今月（2011年9月）サイトでカスタマイズした点をまとめたエントリです今月カスタマイズした点は以下のとおりです。

• comment CGIに対するpost制限IPアドレスの更新
• Feedのgenerator要素(atom:generator)のuri属性値をmovabletype.comに変更

参考は以下です。

各ユーザー様での自己防衛について

• http://sb.xrea.com/showthread.php?t=10838#post77290

確認したら、sixapart.com/movabletype/ はmovabletype.comに移動するようなので、テンプレートのほうで書き換えをおこないました。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

• 当ブログのカスタマイズ記録

今月（2011年8月）サイト内の修正やカスタマイズなどをした箇所のメモをまとめたエントリです

今月カスタマイズした点は以下のとおりです。

• 過去の記事で公開不要となったものを削除
• Internet Explorer用の条件付きコメントをIE9未満に変更
• GoogleにクロールされるページのURLパラメータをマスターツール側で設定

過去記事の一部を、Evernoteのほうにおくことにしました（アーカイブの削減 ≈ 再構築(の数)の削減のため）。下書き扱いにしてサーヴァに残しておいてもよかったのですが、後からの取り出しやすさとか考えたらEvernoteのほうがよさそうだったのでそのようにしました。

EvernoteのURLで公開する予定はいまのところありません。

URLパラメータの調整ですが、ウェブマースターツールで「サイト設定」の「URLパラメータ」のところからおこなえます（詳細はマスターツールのほうを参照するなど）。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

• 当ブログのカスタマイズ記録

今月（2011年7月）サイトでカスタマイズをしたところをまとめたエントリです

• meta要素でのX-Frame-Optionsの記述をやめにした
• FOAF(q.v. http://www.foaf-project.org/)のAuto-Discoveryを一部ページで削除
• WordPressのヴァージョンを3.2にアップグレードしてみた
• ブログトップページのサイドカラムの新着記事一覧を廃止に

X-Frame-Optionsをヘッダーに出力する例です。このブログ記事内でこれを適用したページはいまのところありません

<FilesMatch "\.(html|htm)$">
Header set X-Frame-Options "DENY"
</FilesMatch>

WordPress3.2へのアップグレードに関する参考ページは以下です

• WordPress | 日本語 » WordPress 3.2 に向けての準備

WordPressですが、前回のメジャーリリースのときに自動アップグレードにコケたことがありましたので、今回は自分で落としてきてアップグレードする作業をおこないました。

余談ですが、WordPressではメジャーリリースのときジャズミュージシャンにちなんだ名前がつけられるという、WordPress使いなら知っていそうなトリヴィアがあります。

手動とかいってもほとんどSSHによるリモートですのであっさりとおわってしまいます。

データベースをダンプしておいてからwgetで新しいのをもってきて、旧フォルダをリネームしておいてから展開、あとは.htaccessや、wp-config、/wp-content/内の必要なファイル、フォルダを旧フォルダからコピーするというものです。あとはログインすればアップグレード作業が走ったのちに完了します。

新着記事のリストですが、トップページに同じページのリンクが複数できてしまうことからやめにしました。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

• 当ブログのカスタマイズ記録

今月（2011年6月）ブログのカスタマイズをしたところをまとめたエントリです

• Evernote登録ボタン（サイトメモリー）を記事ページに設置
• mt-search.cgiを復活させてみた

今更ながらですが、Evernoteのアプリケーションをいれてみましたので、それとともにサイトメモリーのボタンを設置してみることにしました。設置は以下のページを参考にコードをMovable Typeのものに置き換えしておこないました。

• サイトメモリーって何？ | Evernote Corporation

なおVicunaテンプレートの構造からそのままでは指定する範囲（id属性）が広くなってしまうので、エントリー部分をdivで新たに括ることとしました。

mt-search.cgiでタグ検索で使ってるXSearchと共存できなかったなどの理由で止めてたりしたのですが復活させてみました。が、まだテスト中で実際にAjax検索のほうから戻すのかどうかまでは未定です。

カスタマイズとは別な話ですが、今月はMovable Type 5.1正式版がリリースされましたが、それとともにセキュリティアップデートもおこなわれていました。

アップデートは4.29、4.291、4.292と合計で3回おこなわれました（もしかしてまだある？）。セキュリティ問題の修正がおこなわれているそうですのでまだなかたはおこなっておいたほうがいいでしょう。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

• 当ブログのカスタマイズ記録