MovableTypeで作成したサイトを携帯で見られるようにするための方法を探していて見つけたもの。
(カスタマイズ編)
元になるスクリプトはこれ
PC2M Website Transcoder for Mobile Clients
「PCサイト->携帯変換スクリプト」
http://www.rcdtokyo.com/pc2m/note/
インストール他は(その1)参照
pc2mを導入して、MovableTypeで作成しているDigital Gateも携帯で見られるようになったが、デフォルトの設定のままではいくつかの不具合がある。
- 不要なパーツの表示(その2)参照
- 見出しタグのサイズ
今回は、見出しタグのサイズ(文字サイズ)を本文と同じにする。
今の携帯は見出しタグ(<H1>や<H2>)にある程度表示するため、見出しタグを使ったページを表示した場合、逆に見づらくなってしまうことがある。
デジタルゲートの場合も、記事タイトルのフォントサイズが妙に大きく格好悪い。
そこで、見出しタグは置き換えてしまうことにする。
修正ファイル:FormatRule.inc.php
このファイルの、
‘h1’ => array(
‘type’ => ‘block’,
‘children’ => array(‘#PCDATA’, ‘a’, ‘br’, ‘span’, ‘img’, ‘map’, ‘i’, ‘b’, ‘u’, ‘big’, ‘small’, ‘font’, ‘em’, ‘strong’, ‘dfn’, ‘code’, ‘q’, ‘samp’, ‘kbd’, ‘var’, ‘cite’, ‘abbr’, ‘acronym’, ‘sub’, ‘sup’, ‘input’, ‘select’, ‘textarea’, ‘label’, ‘button’),
‘attributes’ => array(‘align’)
),
‘h2’ => array(
‘type’ => ‘block’,
‘children’ => array(‘#PCDATA’, ‘a’, ‘br’, ‘span’, ‘img’, ‘map’, ‘i’, ‘b’, ‘u’, ‘big’, ‘small’, ‘font’, ‘em’, ‘strong’, ‘dfn’, ‘code’, ‘q’, ‘samp’, ‘kbd’, ‘var’, ‘cite’, ‘abbr’, ‘acronym’, ‘sub’, ‘sup’, ‘input’, ‘select’, ‘textarea’, ‘label’, ‘button’),
‘attributes’ => array(‘align’)
),
‘h3’ => array(
‘type’ => ‘block’,
‘children’ => array(‘#PCDATA’, ‘a’, ‘br’, ‘span’, ‘img’, ‘map’, ‘i’, ‘b’, ‘u’, ‘big’, ‘small’, ‘font’, ‘em’, ‘strong’, ‘dfn’, ‘code’, ‘q’, ‘samp’, ‘kbd’, ‘var’, ‘cite’, ‘abbr’, ‘acronym’, ‘sub’, ‘sup’, ‘input’, ‘select’, ‘textarea’, ‘label’, ‘button’),
‘attributes’ => array(‘align’)
),
‘h4’ => array(
‘type’ => ‘block’,
‘children’ => array(‘#PCDATA’, ‘a’, ‘br’, ‘span’, ‘img’, ‘map’, ‘i’, ‘b’, ‘u’, ‘big’, ‘small’, ‘font’, ‘em’, ‘strong’, ‘dfn’, ‘code’, ‘q’, ‘samp’, ‘kbd’, ‘var’, ‘cite’, ‘abbr’, ‘acronym’, ‘sub’, ‘sup’, ‘input’, ‘select’, ‘textarea’, ‘label’, ‘button’),
‘attributes’ => array(‘align’)
),
‘h5’ => array(
‘type’ => ‘block’,
‘children’ => array(‘#PCDATA’, ‘a’, ‘br’, ‘span’, ‘img’, ‘map’, ‘i’, ‘b’, ‘u’, ‘big’, ‘small’, ‘font’, ‘em’, ‘strong’, ‘dfn’, ‘code’, ‘q’, ‘samp’, ‘kbd’, ‘var’, ‘cite’, ‘abbr’, ‘acronym’, ‘sub’, ‘sup’, ‘input’, ‘select’, ‘textarea’, ‘label’, ‘button’),
‘attributes’ => array(‘align’)
),
‘h6’ => array(
‘type’ => ‘block’,
‘children’ => array(‘#PCDATA’, ‘a’, ‘br’, ‘span’, ‘img’, ‘map’, ‘i’, ‘b’, ‘u’, ‘big’, ‘small’, ‘font’, ‘em’, ‘strong’, ‘dfn’, ‘code’, ‘q’, ‘samp’, ‘kbd’, ‘var’, ‘cite’, ‘abbr’, ‘acronym’, ‘sub’, ‘sup’, ‘input’, ‘select’, ‘textarea’, ‘label’, ‘button’),
‘attributes’ => array(‘align’)
),
の部分をコメントアウトし、
‘h1’ => array(
‘replace’ => ‘div’
),
‘h2’ => array(
‘replace’ => ‘div’
),
‘h3’ => array(
‘replace’ => ‘div’
),
‘h4’ => array(
‘replace’ => ‘div’
),
‘h5’ => array(
‘replace’ => ‘div’
),
‘h6’ => array(
‘replace’ => ‘div’
),
を記入。
これで見出しタグはdivとなりフォントサイズは本文と同じになる。