MovableType Archive

Yahoo!のカスタムサーチ検索窓をmt.Vicunaに設置するテストをやったことのメモです

作業メモ程度なので細かい部分は省略しています。あと、カスタム検索の仕様変更等で内容が当てはまらない部分がでてくることがあります。

1.カスタムサーチ窓の作成

カスタムサーチは、Yahoo! JAPANの検索を自分のサイトにあった検索窓を作成することができます。以下のページからYahoo!JAPANのIDを用意して作成します。

• カスタムサーチ - Yahoo!検索

説明にしたがって作成していけば数分で検索窓設置用のコードが作成されます。検索窓の設定数の上限は５つで、今回用に新たに作成しました。幾つか種類があるのですが、ウォーターマークタイプを選択してみました。

2.コードのスタイルとJavaScriptを分離する

カスタムサーチの説明では、作成されたコードをそのまま貼り付けることで動作することになっていますが（コードを改変すると動作しなくなることがある、といった注意書きがあります）、スタイルシートの部分と検索フォームの部分とを分離させて作業することにしました。

スタイルシートの箇所は<style type="text/css">から</style>の間の部分でstyleタグを除いた部分を一旦コピーしてテキストエディタを起動させペーストしておきます。（すぐに作業するのであればファイル保存してなくてもおｋ）

JavaScriptの部分も同様にscriptタグを除いたJavaScriptのコードをコピーしてエディタに貼ります。

テンプレートの作成

はじめに環境を説明しておきますと、テンプレートはmt.Vicuna（2.2.0）、Vicunaのスキンはテンプレートセット同梱のSmart Canvas、Movable Typeは、MTOS version 4.23-en をInstaMTにておこなってます。

インデックステンプレートでJavaScriptの部分とCSSの部分のテンプレートを作成。MTLinkタグで楽をしたいだけなので、普通に.cssファイルと.jsファイルを作ってしまってもかまわないのですが。

フッターテンプレートにコードを貼り付ける

スタイルシートとJavaScriptを除いた部分、即ち先頭の<div id="srchBox">と<img src="" ... /></div>までのコードをフッターのテンプレートに貼り付けします。フッターにこだわる必要は特にないですが、ヘッダーから記事にかけての構造を崩したくなかったので。スタイルシートで画面上部にもっていくということで対応してみます。

JavaScriptの部分は、</body>の上付近に外部.jsファイルの読み込みを記述しておきます。

<script type="text/javascript" src="<MTlink template="インデックステンプレートでY!検索のJavaScriptのコードの部分を作成した時のテンプレート名">"></script>

スタイルシートの調節

ヘッダーのlink要素が入っているテンプレートモジュールに先に作成したCSSファイルを読み込むコードをうめておく必要があります。

<link rel="stylesheet" href="<$MTLink template="インデックステンプレートでY!検索のCSSのコードの部分を作成した時のテンプレート名"$>" type="text/css" />

カスタム検索のタイプにより調整箇所が異なったり、細かい部分が多いので詳しいことは省略しますが（というか今ココみたいな感じで調整中なので）、要は検索フォームの部分をposition: absoluteで上部にくるように調節します。

以下のような形になりました。

Powered by Movable Typeというテキストリンクが張られていないサイトを自分がどのようにMovable Typeで構築されているというのを判断していのかを書きます

閲覧ページがどのようなCMSで構築されているか判定してくれるようなFirefoxアドオンがphpspot開発日記に紹介されていました。

• サイトで使っているＣＭＳなどが一目でわかるFirefoxアドオン:phpspot開発日誌

アドオンについてはそういうのがあるのか、程度の感想だったんですけど、（自分が）閲覧するページでMovable Typeを使っていると思われるけどPowered by――のリンク（以下、この記事内で「リンクを張る」という表現は、「Powered by Movable Type」のテキストリンクのことを指すとします）がないサイトというのがたまにあったりします。

Movable Typeを使う際に規約というのがありまして、ECバイヤーズさんのところからダウンロードする前に読んだ（はず。）個人ライセンス・無償の「利用許諾契約書」の条項に以下のような記述があります。

第2条　【リンク】
あなたは、本Softwareによって生成された各サイトにおいてSix Apart の製品紹介サイトへ「Powered by Movable Type」のテキスト表示でリンクを張らなければなりません。但し、Six Apartが認める場合には、あなたは、リンクを張る必要はありません。

http://www.ecbuyers.com/b2c/catalog/images/campaign/six_apart/free_dl/free_dl_kiyaku.htmlより第2条【リンク】を抜粋

なお、上記ページは本来、ECバイヤーズのMovable Typeダウンロードページにおいてiframeにて差し込まれているページです。実際はページ内で特定のエリアをスクロールさせて読むことになるのですが、個人的に読みにくいということで当該ページのほうを示しました。

でもって、最後の文言にリンクを張らなくてもよいケースが示されていますので、張られていないサイトさまはそういった事情があるものと当方で勝手に判断するとしました。

さて、本題にまいりますが、そのようにリンクが張られていないサイトを自分がどうやってMovable Typeでないかとあたりをつけていたのか、といいますと。

• フィードのURLをブラウザで表示してソースを見る

この方法が割りとわかりがよかったようでした。「トラックバックURIをみる」とか、「サイト内検索のURI」をみるとか、というのんは環境変数で変えることができますし、METAタグのGENERATOR属性なんてのも自分で削除して使うコトは可能ですしね。フィードのテンプレートのほうはあまり弄られていないことが結構あったというところですか。

蛇足ながら、Movable Typeの情報をネットで調べるのに検索で「"Powered by Movable Type"」を含めて検索したらいいよ、とかいうのを昔読んだ書籍だったかに書かれてあったような。ま、「MT使ってます」を示していないサイトであればコンテンツはMT関連ではないと判断して終わり。というお話ではありました。

Movable Typeのタグリファレンスでわかりやすくなったほうのリンクの活用のために以前このブログで書いた記事の補足です

• maRkのMyOwn - [MT]テンプレートタグリファレンスへのリンクを張りやすく

上に示しました記事において、テンプレートタグリファレンスリンクの紹介をさせていただきましたが、このリンクにつきまして、以下のようにしてみました。

• rel-tagを付与
• スタイルシートでタグであることを明示してみる

microformatsのrel-tagを使うとしたら、リファレンスへのパーマリンクよりも短縮された（便宜上での表現です）URIのほうが適しているようです。

あと、これは特にやっておくことではありませんが、文章中にタグとして埋め込んだということを少しわかりやすくするために、以下のようなスタイルを適用させてみました。

/* tags */

p > a[rel="tag"]:before {
content:url("タグを表す画像までのURL"); }

記事内でタグへのリンクにrel="tag"があるものに対してタグを表現した画像が前につくというものです。

見た感じではわかりにくいですが、以下の様な形になります。

• MTEntries
• entries

＊どちらもリンク先は同じですが、「タグ」についてみると、上のほうは「MTEntries」というタグ、下では「entries」というタグが対象となります。

InstaMTで編集しているテンプレートを特定のフォルダ内に収めて同期させるといった使い方についてです。

検索語から何かを勝手に読み取って答えるようなエントリ、みたいな企画を考えてまして。今回はその予行練習とでもいいましょうか、まぁそんな感じです。

検索されたワードは特に公開しないというお約束ですすめていこうと思います。

InstaMTに「このテンプレートにリンクするファイル」を設定してみる

さて、「あらかじめローカルで編集しテストをおこなったのち本番環境で使ってみる」、というようなとき一寸したものでしたら、InstaMTでも実現は可能です。

で、編集したテンプレートをバックアップ目的等でフォルダにまとめてローカルに保存したい、というようなときは「このテンプレートにリンクするファイル」(以下この記述を、「Link to File」とします)という機能をつかってみる、というのはどうでしょうか。

Link to Fileについては、「小粋空間」さまの以下の記事にて、その機能の詳細が説明されています。

• 小粋空間: 「このテンプレートにリンクするファイル」の使い方 for Movable Type

こちらが特に説明することはないのですが、InstaMTにおいての設定は以下のようになります。

ローカルディスク（C:）直下にInstaMTをインストールしたとして、mtVicunaというフォルダにStylesheetテンプレートを「styles.mtml」というファイル名にて任意フォルダにリンクさせるという場合です。

Link to Fileの項目には以下のように記述して保存または再構築します。

C:\instamt\www\mtVicuna\styles.mtml

＊パスが適正でないと、保存のときにエラー表示がでますのでご注意。保存がうまくいっているようならば、実際のフォルダを確認します。上の例ではmtVicunaフォルダ内にstyles.mtmlが入っているはずです。このファイルをテキストエディタ開いて直接編集してみます。そして、InstaMTを起動してテンプレートを見にいけばそのファイルを変更したテンプレートはその変更が反映されます。

ワタくシの環境で可能であったというものですので、その点はご承知おきください。あとInstaMTをUSBで使う場合は想定してません。

なお、InstaMTについては以下のページを参照します。

• InstaMT でかんたんデモ環境構築 | MovableType.jp

情報の古い記事をどう扱っていくのか、およびシークレットタグによる記事管理についてです

Open MagicVox.net (www.magicvox.net)さまのシークレットタグの使いドコロ～古い記事であることを示すという記事にシークレットタグを使った記事の管理方法などが紹介されています。

長い間，ブログを続けていると，様々な事情で記事内容が古くなってしまっていることがあります。例えば，プログラムのバージョンが変わったりするなどして，その紹介記事が現在のものと則さなくなってしまっているなどの理由です。そんな時にも，シークレット タグを上手く使って，古い記事の管理を簡単にすることができます。

シークレットタグの使いドコロ～古い記事であることを示す - Open MagicVox.net

人さまのサイトの運営方針などによる部分がありますので、おそらくはこれが正解という無二の答えのない問題なのですが、自分ならどうしようか、といったものを以下に記しておきます。

古い記事を示す文言について

やや本質から離れてしまいますが、常に情報は流れていくことですし、記事に記載されている情報が古くなることは当然のことのように思われます。

　この記事は時間経過やプログラムのバージョンアップなどの諸々の事情によって，現状に正しくそぐわない内容になっている可能性があります。

そこで、ズルい方法ですが、上記の文言を少しオールマイティな言い回しにしておいて（ex.「本サイトに記載されている記事は作成時点に基づく内容であり、適用されない可能性があります。最新の情報を参照するようにしてください」といったもの）、ブログのサイドカラムやら、はたまたブログの説明の箇所あたりに常に表示させておくことで記事内容が古くなることに気をつかうことなくやっていけるのではないでしょうか。

ただし、この方法だと例外となる記事がでてくることもあります。例えば、小粋空間さんのところの、ダジャレ記事のような普遍的な内容の記事などです。

あと、古い記事に対し最新の情報を提供する方法として、古い記事にむけて新しい内容の記事をトラックバックさせておく、といった手法もわりと使われているようです。古い記事は編集する派（？）の自分としては、「どこがどういう理由で適用できなくなったのかの説明を入れてあげたい」、という思いがあるために記事は編集するという形にしています。

余談：Movable Typeの記事検索の挙動に関して、管理ページで記事検索をおこなって、結果が1つのみの場合は、エディットリンクが展開され、直接記事の編集画面へと遷移されるもよう。どのバージョンからそうなっていたのかは不明ですが。

シークレットタグによる管理と記事編集について

ところで、Movable Typeでは、一旦公開された記事は公開の状態を設定（未公開・日時指定）できるものの、「後で編集する予定のある」ことを記事にマークしておくものがありません。（もしかして......プラグインとかあるのかな？）

そこで、編集することの多い記事やあとから編集する予定のある記事にはシークレットタグを付与して管理するというのはアリかと思いました。

例えば、編集予定のあるような記事に@flagといったタグをつけておいて、メニューの「一覧」＞「タグ」とすれば記事一覧のなかに@flagのついたものも表示されますから、そこから当該記事を編集するといった管理ができるというわけです。

Movable TypeのタグリファレンスのURLがわかりやすい形になったようです。ということで、ブログ記事編集画面からでもタグリファレンスへのリンクを簡単に貼れる様にCustom Editor Buttonプラグイン用のボタンを作ってみました

タグリファレンスのリンクについては、MovableType.jpで以下のように説明があります。

URL の https://www.movabletype.jp/tags/ までは共通ですが、そのあとのタグ名は、頭の MT が抜けても、mt: という表記でも、全体が大文字でも小文字でも、それらが混ざっても、そのタグがあればリファレンスページに移動できます。

わかりやすい URL でタグリファレンスを参照できるようになりました

ということで、CustomEditorButton2 （blog.aklaswad.com）用にボタンを作ってみたり。

バージョン0.3で動作確認はFirefox3.0でしかおこなってません。config.yamlに書くソースは特に面倒なことはしてなくこんな感じで

buttons:
    tagreflink:
        image: images/tagref_link.png
        title: TagReference
        code: |
            function ceb_tagreflink ( text ) {
                var mttag = var mttag = text.replace(/^mt\:?/,"").toLowerCase();
                return '<a rel="tag" href="https://www.movabletype.jp/tags/' + text +  '">' + text + '</a>';
            }

あまり需要はなさそうですけど、リファレンスページへ確認にいかなくてもリンク張れたりするのがいいかなといったところです（スペルミスには注意ですが）。

一応、Firefoxアドオン、Make Link用にも書いていてこんなです。リファレンスページから簡略化されたリンクに直したいようなときに

名前:

MTTagReference

フォーマット:

<a href="https://www.movabletype.jp/tag/%text%">%text%</a>

HTMLエンティティを使用する:

チェックせず

テストとして、タグリファレンスへのリンクを貼ってみます。

• MTEntries
• mt:Entries

MovableType.jpの記事に書かれていますが、初めのhttps://www.movabletype.jp/tags/まで共通、以下テンプレートタグが入っていたときに当該のリファレンスページが表示されるとのことです。あと、Open Search プラグインもアップデートと併記されていますね。

たまにテンプレートタグ検索を選択しているのを忘れてて普段ののキーワード検索をそのままやってしまうはおそらく私です。

【追記：2008/09/07】使っているボタン画像だけ置いておきます。config.yamlのソースは既存のものに追加するなどして使います。

• TagReferenceLink.zip

追記：2013/04/18 URLの戻り値をmt接頭辞なしに合わせるようにしました。

使っているMovable TypeのバージョンをMT4.21にアップグレードしました。

シックスアパート（SixApart）よりMovable Type4.21出荷とのアナウンスがありました。

• [重要] Movable Type 4.21 出荷開始

というわけで、バージョンを4.21にすることにしました。ダウンロードはECバイヤーズにて、コミュニティ管理機能を持たない、Movable Type Commercial 4.21のほうでダウンロードしました。

購入等についてはシックスアパートの以下のページを参照

• Six Apart - Movable Type のライセンスと購入について

メモのようなもの

データバックアップ等済ませたあとに、MT4.21をアップロード。アップロードには、zipファイルをサーバ上で解凍する- あにめはっく.jpにて、zipファイルでサーバ側で解凍できるとのことなので参考にしましてSSH接続を使ってやってみましたらうまくできてアップロードの時間は短縮することが出来ました。＃情報thanks

解凍後、これまでのプラグインの引継ぎ作業、今までのmtconfig.cgiをアップ。準備が整ったら、旧バージョンのディレクトリ名を変更しておき、新しいほうのディレクトリをこれまでのものに変えるとここまでは解説どおりに。あとは、MTシステムにログインしてみるとアップグレード作業が進むという感じです。

ActionStreams入れてる人は、プラグインのアップのとき、extlibのフォルダのアップを忘れてると、アップグレードの作業の開始早々に止るのでご注意。

このおかげでいきなりやっちまっただー＞＜になってしまいました。単にプラグインを入れたときの事思い出したらなんでもないことなんですけどね。

あと、感想として、カスタムフィールド使ってるためなのかわからないけど、データベースの更新のあたりが4.1にあげたときよりちょっと長い感じはしました。

＃アップグレード完了とはいえ、あちこち微調整が残っていたりというのが現在の状況です。テンプレートの修正などは日を改めて。

ローカルで簡単にMovable Typeが動作するデモ環境を構築する、InstaMTでバージョン4.2を動かしてみました

ダウンロードとインストール

InstaMTのダウンロード・インストールの説明はwww.movabletype.jpの以下のページに記載されています。

• InstaMT でかんたんデモ環境構築 | MovableType.jp

MTOS4.2をwww.movabletype.orgからダウンロードします。

4.2へのアップグレード

MT4.2へのアップグレードの具体的な方法が、The blog of H.Fujimotoさまにて紹介されています。

• InstaMTでMT4.2等を動かす

手順のとおり、必要なフォルダを上書きし、[ mt-static ]フォルダは、[ www ]フォルダ内のmt-staticに上書しました。

ログインすると、ウィザードが起動してアップグレードがおこなわれました。

尚、当方アップグレード前にログインしてInstaMT同梱のMTOS4.1テンプレートでブログを構築していましたので、テンプレートの編集のところでRefresh Blog Templateをおこないリビルドしたら、MT4.2のほうのテンプレートが反映されました。

mt.Vicunaとか

あと、mt.VicunaのテンプレートセットもInstaMT環境で使えるようでした。

MTOS4.2ですと、デフォルトでウィジェットセットがセットされてないようなので、空のwidgets.cfgを作らなくてもそのままRefresh Blog Templatesからインストールできました。フォルダを入れる場所は、Vicunaの説明のとおりで、pluginsフォルダはinstamt/cgi-bin/mt/plugins/に、Vicunaのテーマは、instamt/www/mt-static/themesに入れました。

Six Apart(シックスアパート)が、Movable Type 4.2 RC5およびセキュリティアップデートを開始とのことです。

Six Apart - Movable Type News: [重要] Movable Type 4.2 RC5 とセキュリティアップデートの提供を開始より

Movable Type においてクロスサイトスクリプティングによる脆弱性が確認されました。この問題に対処するため、Movable Type の修正バージョンを公開いたします。脆弱性の修正バージョンとなりますので、対応するバージョンへのアップデートを 強く推奨 いたします。

ということで、セキュリティアップデートをおこなってみました（*ホットリリース）。アップデート後のMTのバージョンですが、MT4.1ですと4.14となっています（対応表が示されていますのでそれに従って利用中のバージョンにあったものを選択します）。

なお、後日正式なアップデートとしてリリースされるようでして、「ホットリリースへのアップデート後、テスト完了版が公開された際には、再度のアップデートをお願いいたします。」との説明があります。

【追記】

正式版の提供を開始されたとのこと。

• 2008年8月7日に発表したセキュリティアップデートの正式版提供開始

Movable Type 4.2 RC5 とセキュリティアップデートは以下より提供されています。（正式版提供されましたので上記のリンクを参照ください。）

• Six Apart - Movable Type News: [重要] Movable Type 4.2 RC5 とセキュリティアップデートの提供を開始
• 重要: Movable Type 4.2 RC5 とセキュリティアップデートの提供を開始 | MovableType.jp