MT4を携帯に対応させる「pc2m編」(その3)

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となりフォントサイズは本文と同じになる。

 

デジタルゲートがお手伝い

ホームページをリニューアルしたい、スマホ対応にしたい、デザインそのままで機能だけ追加したい、更新だけ代行して欲しい。サイトを運営したいけど誰に相談したらいいか分からない。そんな時はお気軽にお問い合わせください。

スポンサーリンク