サイトアフィリエイト用WordPressテンプレート「メシオプレス02」ver.2.0リリース。

サイトアフィリエイト用WordPressテンプレート「メシオプレス02」ですが、急ピッチでスマホ対応させたver.2.0（β版）を経て、ようやくver.2.0正式版をリリースしました。ということで、バージョンアップ内容について詳しくご説明します。

新機能1：スマホ専用サイト構築機能

当初は2015年6月中に予定していたスマホ対応ですが、Google先生が「4月21日までに対応しておくように！」と煽っていたので、このスマホ対応部分のみ実装したのがver.2.0（β版）です。（2015年4月13日リリース済み）

メシオプレス02のスマホ対応もメシオプレス03と同じで、ダイナミックサービング（PCサイトとスマホサイトでURLは同じだけど、HTMLやCSSは異なる）を採用して「スマホ専用サイト」が構築できるようにしました。

レスポンシブWEBデザインを採用しない理由は、メシオプレス03でレスポンシブWEBデザインを採用しなかった理由にて説明済みです。簡易的なスマホ対応ならレスポンシブWEBデザインで良いと思いますが、本気で「スマホ最適化」を図りたいサイトアフィリエイターはレスポンシブWEBデザインでは満足できないはずです。

それなのに、サイトアフィリエイト用のWordPressテーマでスマホ専用サイトの構築が可能なものが見当たりません。なので、わかる人にはわかる希少価値のあるテンプレートになっていると思います。

基本的な機能もメシオプレス03のスマホ機能と同じです。

スマホ専用のロゴ画像、ヘッダー画像（Retina対応）の設定
スマホ専用の背景色の設定
ホームアイコンの設定
文節での改行無効化
画像の左右寄せ無効化
スマホ専用ウィジェットエリア（9箇所）

詳しくは、同じ機能説明をしているメシオプレス03の販売ページにて確認してください。

新機能2：スマホ用テーブル表示の切り替え機能

テーブル用のショートコードを実装しているメシオプレス02独自の機能です。スマホ対応する際、テーブルの表示をどうするかが最大の悩みだったのですが、現時点でベストと言える方法にたどり着きました。管理画面より「コンパクト表示」か「スクロール表示」か、お好きな表示方法を選択できます。

コンパクト表示の場合

コンパクト表示とは、メシオプレス02ver.1X～にて実装していたファットフィンガー対策の仕様で表示する方法です。ファットフィンガー対策とは、スマホからもPCサイトを表示するけど、文字やボタンが拡大表示している仕様のことです。その仕様のままスマホの画面幅に合わせてギュッとコンパクトに表示させています。

端末の横幅にもよりますが、あまり幅の広くないiPhone5でも横5列くらいならコンパクト表示ですべて収まります。パッと見で全体像が見渡せる一覧性の高いテーブル表示が可能です。

スクロール表示の場合

スクロール表示とは、PCサイトのレイアウトをそのまま横スクロール型にして表示する方法です。フォントサイズも他の本文と同じになっていますので、見やすいです。スクロールできることがわかるように、表の上にスクロール表示できる旨の文言も自動的に表示されます。文言は自由に変更することができます。

横スクロールにすると、テーブルの全体像が見えなくなりますので、ユーザーは一旦そこで立ち止まってテーブルの続きを確認しようとします。結果として、記事の流し読みを防止する役目も果たしてくれるテーブルの表示方法です。

新機能3：PC・スマホ専用表示ショートコード

PCサイトだけに表示するコンテンツ、スマホサイトだけに表示するコンテンツを掲載できるショートコードです。メシオプレス03ユーザーさんからのリクエスト機能なのですが、先に02のほうに実装してみました。

利用用途は色々あるのですが、「スマホ専用画像への切り替え」に使うのが良いかなと思います。たとえば、PCサイトで下記のようにそれぞれにリンクが効いてる画像をパネル風に横に3つ並べていたとします。

これをスマホ（iPhone5）で見ると、下記のように横3列で収まらずに縦に表示されてしまいます。しかも大きく表示されすぎです。

そこで、スマホでも横3列に収まるように画像サイズを調整します。iPhone5の場合は幅320pxなので1枚100pxで作成します。そして、「sp」というスマホ表示専用ショートコードで囲みます。PCサイト用の画像は「PC」というショートコードで囲みます。すると、スマホで見たときはPC用画像は非表示になり、スマホ専用画像のみ表示されます。

このようにスマホでも横3列のアイコンをそれぞれ並べることができました。このショートコードはかなり汎用性が高いので、有効活用して「スマホ最適化」を図ってみてください。

新機能4：管理画面「メシオプレス設定」をタブ化

こちらも03ユーザーさんより「メシオプレスは設定項目が多いから、最下部の保存ボタンまでスクロールしなくても、設定内容を保存できるようにして欲しい」という要望があったので対応しました。03にも適用しますので、もうしばらくお待ちください。

新機能5：リンク付きカテゴリーラベル機能

更新履歴表示ウィジェット（投稿記事表示）と、投稿記事下のソーシャルボタンエリアに「カテゴリーラベル」が表示されるようにしました。ラベルはテキストリンクになっていますので、カテゴリーページの内部リンク対策も兼ねています。背景色や文字色は、管理画面のカテゴリーページよりカラーピッカーで設定できます。

新機能6：吹き出しショートコードの向き、背景色指定機能

吹き出しに背景色（黄緑、水色、ピンク、薄いグレー）と、画像の名前を設定できるようにしました。また、スマホ表示の場合は吹き出しの向きを上に向かって吹き出すバージョンを選択できるようにしました。吹き出しのコメントが長文の場合に画面幅いっぱいに使えるため、縦に長くなりすぎて読みにくくなるのを防ぎます。

吹き出しショートコードの使い方

新機能7：YARPP使用時に専用のカスタムテンプレートが使用可能

メシオプレスでは、関連記事表示機能はテーマには実装していません。理由は、タイトルや内容を元に関連スコアを細かく判定して表示させる技術がないからです（笑）そのため、関連記事表示はメジャープラグインの「YARPP」の利用を推奨しています。（参考：関連記事プラグイン「YARPP」のサムネイル表示をカスタマイズする方法）

今回はそのYARPPで関連記事をスマホに表示させる際に「カスタムテンプレート」を使えるようにしました。左にアイキャッチ、右に記事タイトルがリストで綺麗に表示されるテンプレートになっています。