MTカスタマイズ Archive

今月（2010年8月）サイト内でカスタマイズした点を記す記事です

グローバルナビゲーションからaboutページを削除（ウェブページ内で表示されるようになってる）してみました。

そのかわりというか、ウェブページのときはaboutがでてくるように振分けしてはあります（これはコードわざわざ示さなくてもいいですね、単純な振分けだし）。

それと同時にナビゲーションにサイトのトップ（/）とBookmarkページをいれることにしてみました。

まあ殆ど機能してないといってよさそうなナビゲーションなので何がはいっても大差ないとおもうんですがまた今度考えるかもです。

今月のカスタマイズは以上です。

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

今月（2010年7月）テンプレートなどカスタマイズした点をまとめた記事です

今月はほとんど触ってなくて、あれこれ弄ってないほうが安定しているというか普通なのですが。

• カテゴリページのはてなスターをはずした
• search_data.txtのXML宣言をとってみた
• search_data.txtのMIME Typeをapplication/jsonにしてみた

まったくカスタマイズというかんじではないのですが、気にせずいきます。

Ajax JSON検索のsearch_data.txtの先頭のXML宣言の役割とか未だにわからなくて、おそらくとりはずしても動くのでないかと思って外してみました。外すとまずいのかなあ、どうなんでしょうか。

3番目のやつはネタがなかったので無理矢理です。通常は配布元が説明されているとおりで動くことになってます（のはず）。

さてJSONのMIMEタイプですが、RFC 4627でapplication/jsonとして公開されています。

Ajax検索用のJSONファイルはtext/planeでも動いてたわけですがあえて（？）かえてみました。以下、.htaccessへの追加コード。備忘用です。

<Files "search_data.txt">
AddType application/json .txt
</Files>

あー、あとMTで拡張子.jsonなファイルができたかどうか試してなかった。。変更後の置換が面倒だったので（というよりお試し程度のことで再構築したくないような）.txtのまま使うことにしました。.jsonでやったとしても（httpd.confになければ）AddTypeはいるかも。

今月のカスタマイズは以上です。

バックナンバーは以下にあります。

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

Movable Typeの管理画面カスタマイズで、プラグイン経由でフッターのJavaScriptにコードを追加しようとするときに、jq_js_includeにappendするとダイアログ表示にもコードが追加されることがあります。

MTの管理画面でjQueryを追加してカスタマイズするとき、footer.tmplファイルにある、<mt:var name="jq_js_include">にappendする（append=1として変数に追加する）という方法を以前このブログ内において公開していたのですが、これをおこなったときにダイアログを表示（テンプレートの初期化とか、エントリ編集画面のファイル・画像アップロードのときとか）したときにも追加されることがあるのを確認できました（MTOS 5.02）。

追加したコードの書き方によっては必要もない箇所でカスタマイズしたコードの読み込みがおこなわれることもあるのでないかとおもい、その対処を考えてみました。

なお、これが再現されるのはTransformerプラグインでsetvarblockを使いappend=1というオプションを利用したなどの場合で、直接当該テンプレートのコピーをalt-templeでカスタマイズした場合には問題ないものとおもわれます。

（１）footer.tmplの代替テンプレートを作り、カスタマイズ用の変数をセットする

先述の現象は、/MTシステムフォルダ/tmpl/cms/dialog/footer.tmpl で<mt:var name="jq_js_include">が記述されていることによります。

つまるところダイアログのテンプレートを除外すればいいわけなんですが、ここは条件式なしで変数をセットしておいてそこに追加させるという方法で対処してみます。

• /MTシステムフォルダ/tmpl/cms/include/footer.tmplファイルをコピーしてalt-tmplフォルダ以下に/cms/include/footer.tmplをおきます
• （コピー先の）footer.tmplをエディタで開いて、このリスト下に示すコードを追加します
• 編集後はサーヴァにローカルと同じ構成でアップロードします

footer.tmplに追加するコード。

追加の場所は</body>の上に。ここでは変数名をjq_custom_includeとした。

<script type="text/javascript">
jQuery(function($){
<mt:var name="jq_custom_include">
});
</script>
<!-- 追加コードここまで -->
    </body>
</html>

勿論、上記コードのscript内およびjQuery(function...内に直接になんらかの処理のコードを書くということもできます（このエントリではプラグイン等でappendを利用することを想定したつもりですが）。scriptタグ自体を追加側（setvarblock内）のコードに委ねるというのであれば変数の呼び出し（mt:var name=）だけ置けばよいことになるでしょう。

ちなみに追加させるほうのコードについては、jQuery()といった書き方を$()で書くことができるという寸法であります。

jQueryのコードの追加

あとは、setvarblockで任意のコードをappendです。

<mt:setvarblock name="jq_custom_include" append="1">
/* append code
 $("#foo").css("background", "#ffffff");
*/
</mt:setvarblock>

（２）スクリプトがダイアログのとき動作しないようにする

コードを書くにあたって、ダイアログと当該テンプレートで共通しないidかclassを参照するようにするのがコツなのですが、カスタマイズのスクリプトがダイアログのときは動かないようにコードで分岐しておく、ということも考えられます。

これには、dialog.tmplでルート要素にdialogというIDがつけられていることを利用します（ヴァージョンアップ等でなくなる可能性はあるかもです）。

以下は、jQuery('#dialog')でIDをgetして分岐するコードです。＊else{以降は適当な（動作に影響をおよぼさない）コードを。

<mt:setvarblock name="jq_js_include" append="1">
var gt_html_id = jQuery('#dialog');
if(gt_html_id==""){return;} 
else {
//  Do Something
jQuery('#bootstrapper').removeAttr('class');
}
</mt:setvarblock>

この例では、ID bootstrapperのclassがダイアログのiframeでリムーヴされずに残っているはずです。（Firebug等のツールで確認します）

（３）プラグインで対策してみる

例えば、include/header.tmpl でrelated_contentという変数がセットされており、/dialog/header.tmplではセットされていないことからこれを置換する形で。。

   my $old = qq(<mt:setvarblock name="related_content">);
   my $new = <<EOT;
#
# ここにappend予定のsetvarblock !
#
<mt:setvarblock name="related_content">
EOT

   $$tmpl_ref =~ s/$old/$new/;

あとこまかな事など

cms/dialog/header.tmplにおいて、<mt:var name="html_head">、<mt:var name="js_include">の記述があるので、appendする場合についても同じ状況になることがあるかも知れません。

以上の内容は自分が試した環境に基づいています。早い話、MT編集画面のカスタマイズをしていなければこれらの問題はまずおこらないということです。確認にはFirefox + Firebug でダイアログ表示のiframeを別のウィンドウで表示させたうえでページのHTMLをチェックしました。

個人的には、何かの操作ボタンを追加するとかいったカスタマイズについて、或る操作の時だけ必要というようなものはブックマークレットでもいいのではないかと考えています。

おもいつくままで整理できずにまとめたので、ちょっと何いってるのか分からないかんじで申し訳ありません。

regex_replaceモディファイアでスタティックパブリッシングとダイナミックパブリッシングで分岐させてみようとおもったので動作のメモとして記しておきます。

小粋空間さんの以下のページにはダイナミックパブリッシングにおいて正規表現の後方参照の$をエスケープしないと期待どおりに出力されないといったことが記されております。

• 小粋空間: regex_replace モディファイアをダイナミックパブリッシングで利用する場合の注意

（これといって重要なことでもないのですが）それならばダイナミックとスタティックで振り分けてみようかと思ってやってみたのです。解説できるほどのスキルはありませんので、動作を試したテンプレートのコードをそのまま載せておきます。（確認はMTOS5.02/Movable Type Pro 4.27-jaによる）

<!-- 
     ex1
-->

<ul id="ex1">
<MTFor var="x" from="1" to="10">
<MTIfDynamic>
<li><MTVar name="x" regex_replace="/(\d)/","No.\$1"></li>
</MTIfDynamic>
<MTIfStatic>
<li><MTVar name="x" regex_replace="/(\d)/","No.$1"></li>
</MTIfStatic>
</MTFor>
</ul>

<!-- 
     ex2
-->
<$MTSetvar name="regexp" value="/(\d)/"$>
<$MTSetvar name="rep" value="No.$1"$>
<ul id="ex2">
<MTFor var="x" from="1" to="10">
<li><MTVar name="x" regex_replace="$regexp","$rep"></li>
</MTFor>
</ul>

まあキャプチャする必要のないサンプルですが失敗してるか成功してるかわかりやすそうなものということで。

ざっと思いつくのは、ex1のようなコードかと。それから奮闘した結果、いいのかわるいのか分かりませんが、結局変数に渡してドル記号つきで参照することでどちらでも同じといった感じでした。

いちおうコンパイルされたほうのテンプレートでsetvarの部分です。

<?php $this->_tag_stack[] = array("mtsetvar", array (
  'name' => 'regexp',
  'value' => '/(\\d)/',
));  echo smarty_function_mtsetvar(array('name' => 'regexp','value' => "/(\d)/"), $this); array_pop($this->_tag_stack); ?>

<?php $this->_tag_stack[] = array("mtsetvar", array (
  'name' => 'rep',
  'value' => 'No.\\$1',
));  echo smarty_function_mtsetvar(array('name' => 'rep','value' => "No.\$1"), $this); array_pop($this->_tag_stack); ?>

今月（2010年6月）、ブログ内でカスタマイズにした点をまとめるエントリです。

• Google1 Buzzへの投稿リンクをAtomフィードに挿入
• 各記事ページのAddClipsのボタン外した
• カテゴリアーカイブのページ送りの部分

Google Buzz廃止決定につき、以下の内容は破棄とします。

Google Buzzへ（以下「Buzz」にて表記）Postするリンクですが、公式のBuzzボタンがでていますのでウエブサイト内に設置するにはそちらのほうが簡単に設置できることかと思います。

で、BuzzへPostするリンクは、http://www.google.com/buzz/post?message=Message Here&url=http://yoursite.example.com/のような形式です。以下を参考にするといいようです。

• http://code.google.com/intl/ja/apis/buzz/buttons_and_gadgets.html

mt:entriesのループ内でMTEntryBody、MTEntryMoreのあとに以下のようなものをいれます。なおコードはCDATA区間にいれています。

• <a href="http://www.google.com/buzz/post?url=<$MTEntryPermalink encode_url='1'$>">Buzz It</a>

カテゴリアーカイブでMTPaginateによるページ分割をおこなっていました。

プルダウン形式のページ送りでは、ページがコンパクトになるのはいいのですが、ページの分だけoption要素が増えてくるというのがちょっと気になりました。

ページ送りの部分だけに関していえば、分割するページの最大数さえわかれば、JavaScriptによって作ることも可能なのでないかと考えました。

そのひとつの方法として、今回はjQuery Spin Buttonというプラグインを利用する形でいれることにしました。このプラグインは、jQuery日本語リファレンスのページ内で掲載されています。

動作は各アーカイブのページで確認できます。スピンボタンにsubmitを組み合わせたような形です（やっつけですので体裁はいまいちです）。

今月のカスタマイズは以上です。

バックナンバーは以下にあります。

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