MT4で、PCと携帯サイトの表示内容を切り替えるカスタマイズ

PCサイトと携帯サイトで表示内容を切り替える概要

mt:setVarタグで、PC用テンプレート、携帯用テンプレートそれぞれに、PCサイトか、携帯サイトかの値を持たせ、記事内で、mt:ifタグを使い、条件分岐させる。

mt:setVarで値を代入

まず、mt:setVarタグを使い、携帯用テンプレート、PC用テンプレート、それぞれに、テンプレートのメディアタイプの値を代入します。

PC用ブログ記事テンプレートの冒頭には、以下の記述を書きます。

※＜＞は、全角です。半角に修正して考えてください。

＜mt:setVar name="mediatype" value="PC"＞

これで、PC用テンプレートは、「mediatype」として、「PC」という値を保持します。

携帯用ブログ記事テンプレートの冒頭には、次の記述を書きます。

＜mt:setVar name="mediatype" value="mobile"＞

これで、携帯用テンプレートは、「mediatype」として、「mobile」という値を保持します。

mtevalを設定

ブログ記事の中で、mt:ifタグを使うためには、ブログ記事内で、mtタグを使えるようにしなくてはなりません。

mt4からは、標準で、mtevalが実装されました。mt:entryBodyやmt:entryMoreに、「mteval="1"」を付け加えることで、mtタグを使うことができます。

たとえば、携帯用テンプレートは、最初こうなっていますが、

＜$mt:entryBody regex="reg0 reg1 reg2 reg3 reg5" zenkana="1"$＞
＜$mt:entryMore regex="reg0 reg1 reg2 reg3 reg5" zenkana="1"$＞

mtevalを付け加えると、こうなります。

＜$mt:entryBody regex="reg0 reg1 reg2 reg3 reg5" mteval="1" zenkana="1"$＞
＜$mt:entryMore regex="reg0 reg1 reg2 reg3 reg5" mteval="1" zenkana="1"$＞

PCサイトのテンプレートにも同様にmteval="1"を付け加えます。

これで、ブログ記事内で、mt:ifを使う準備が整いました。

ブログ記事内で条件分岐

では、実際に、ブログ記事内での条件分岐の実例です。

以下のように、表示させたいとします。

PC：＜a href="http://www.kodomoto.jp/"＞子育てママのこどもと.JP＜/a＞
モバイル：子育てママのこどもと.JP

ブログ記事内に書く書き方は、

＜mt:if name="mediatype" eq="PC">
＜a href="http://www.kodomoto.jp/"＞子育てママのこどもと.JP＜/a＞
＜mt:else＞
子育てママのこどもと.JP
＜/mt:if＞

あるいは、モバイルだけに表示させたい時は、

＜mt:if name="mediatype" eq="mobile"＞
子育てママのこどもと.JP
＜/mt:if＞

となります。

これにより、PCテンプレートを再構築した場合には、PCテンプレートはmediatypeにPCという値を持っていますので、

＜mt:if name="mediatype" eq="PC">
＜a href="http://www.kodomoto.jp/"＞子育てママのこどもと.JP＜/a＞

の部分が実行されます。

携帯テンプレートを再構築した場合は、携帯テンプレートはmediatypeがPCではないので、

＜mt:if name="mediatype" eq="PC">
＜a href="http://www.kodomoto.jp/"＞子育てママのこどもと.JP＜/a＞

部分は無視され、

＜mt:else＞
子育てママのこどもと.JP
＜/mt:if＞

が、実行されます。

あるいは、

＜mt:if name="mediatype" eq="mobile"＞
子育てママのこどもと.JP
＜/mt:if＞

が、実行されます。

多少、ブログ記事を書くのが煩雑になりますが、別々に２つブログを更新することを思えば、更新はかなり楽になるはずです。

pc/k-tai text changer

なお、mt4keitaiを公開しているかん吉さんが、MovableTypeでPCとモバイルを簡単に切り替えるプラグインを公開されていますので、そちらも併せて、ご紹介しておきます。

▼　アフィリイトタグを、PC/モバイルで切り替える方法 for MT

以上、PCと携帯の表示切り替えカスタマイズでした。