●Movabletypeで携帯サイト作成

Movabletypeで作成したサイトを、Movabletypeの機能を利用して、携帯向けにも公開した。その方法を紹介する。

※今回はMT3.xを利用した方法。考え方だけ理解できれば、MT4.xにも適用できるはず。

参考)本ブログの携帯版http://www.web2-labo.com/m/
« 画像 »

MT4iの致命的な弱点
当初はMT携帯サイト化用の超有名なスクリプト「MT4i」を利用した。

だが、MT4iは、MT最大の利点である「静的htmlファイル生成」を行わないため、携帯からアクセスするとメチャクチャ重くて却下。

MTの機能をフル活用
良く考えてみたら、Movabletypeの機能を上手く使えば、PC/携帯両方向けのhtmlファイルを同時に生成できる。

※当方法は、画像サイズ変換にPHPを利用するため、ご利用のサーバーがPHPを利用できることが前提。

1)携帯サイト用テンプレートを追加
携帯サイト用テンプレートファイル「mobiletemplateforMT3.zip」をダウンロードする。

テンプレートは「euc-jp版」「utf-8版」がある。ご自分のブログに合わせて選択する。

MT管理画面から、各テンプレートファイルのコードを追加する。

テンプレート⇒インデックス

テンプレート名出力ファイル名
携帯・メインページm/index.html
携帯・月別ページm/month.html

« 画像 »

テンプレート⇒アーカイブ

テンプレート名
携帯・エントリー・アーカイブ
携帯・カテゴリー・アーカイブ
携帯・日付アーカイブ

« 画像 »

テンプレート⇒モジュール

テンプレート名
adsense
foot_m

« 画像 »

2)マッピングを新規作成
設定⇒公開⇒アーカイブ・マッピング(詳細モードに切り替え)より、マッピングを下記設定の通りに新規作成する

アーカイブの種類テンプレート出力フォーマット
エントリー携帯・エントリー・アーカイブカスタマイズする⇒m/<$MTEntryID$>.html
カテゴリー携帯・カテゴリー・アーカイブカスタマイズする⇒m/cat_<$MTCategoryID$>.html
月別携帯・日付アーカイブカスタマイズする⇒m/%y_%m.html

« 画像 »

3)プラグインを追加
下記プラグインを全て追加(mtフォルダ > pluginフォルダにアップロード)

zenkana
全角を半角に変換

MT-I18N
文字コードを変換

MT Regex Plugin
正規表現を使えるようになる。インストールの詳しい方法はこちらを参考に

PreviousNextInCategory.pl
前後エントリへのリンクを生成できる。 ※上記リンク先でエラーが出るようであれば、こちらを試してみてください。⇒PreviousNextInCategory.zip


4)画像変換スクリプト設置

Movabletypeで携帯サイト作成-「画像変換スクリプト設定編」-をご覧ください。

5)再構築
元サイトの配下に「m/」のディレクトリがができ、その中身がモバイルサイトとなる。
元サイトが「http://www.sample.com/」であれば、モバイルサイトは、「http://www.sample.com/m/」となる。

6)カスタマイズ
PCサイトと同様に、テンプレートを編集すればデザインのカスタマイズが可能。

知っておくと便利なTipsはこちら。
PCページからのリダイレクト方法

携帯用アドセンス表示

私はこの本で携帯サイトの作り方を勉強しました。

powerd by Amazon360

携帯サイトAtoz


  »

●カテゴリ

Web2.0的アフィリエイトラボ