MovableTypeで作成したサイトを携帯で見られるようにするための方法を探していて見つけたもの。
(カスタマイズ編)
元になるスクリプトはこれ
PC2M Website Transcoder for Mobile Clients
「PCサイト->携帯変換スクリプト」
http://www.rcdtokyo.com/pc2m/note/
インストール他は(その1)参照
pc2mを導入して、MovableTypeで作成しているDigital Gateも携帯で見られるようになったが、デフォルトの設定のままではいくつかの不具合がある。
- 不要なパーツの表示
- 見出しタグのサイズ
Digital Gateでは3カラムのデザインがベースとなっているが、携帯から見た場合に必要だと思われるのは、記事本体のみで、広告はもちろん、ブログパーツも携帯に対応していないものも多い。
pc2mには、ページの任意の箇所を非表示にする方法が用意されているから、それを利用することにする。
なお、以下はDigital Gateでの場合。
修正するのは「テンプレートモジュール」内にある「サイドバー (3カラム)」
Digital Gateではメインコンテンツのメニューは上部にまとめてあるので、右の2カラムを丸ごと非表示にしても支障が無い。
そこで「サイドバー (3カラム)」のファイルを開き、最上部に、<!–pc2m_void–>を挿入し、最下部に<!–/pc2m_void–>を追加する。
保存、再構築を経て、携帯から確認すると、ちゃんと本文記事のみになっている。
なお、MovableTypeではボトムに
Copyright © 2001-2007 Six Apart. All Rights Reserved.
等が入っているが、携帯では機種により© が文字化けし、また、表記も長いので、「テンプレートモジュール」内にある「フッター」のファイルを開き、上記部分を<!–pc2m_void–>と<!–/pc2m_void–>で囲む。
ただし、このままでは何も表示されないので、
Template.inc.phpのファイルを開き、</body>の前に
(c) Digital Gate
と追加し保存。
これでボトムの表記もすっきりした。
見出しタグの変更は次回。