メシオプレス03販売ページ

ヘッダー画像のみ表示させるパターンです。キャッチコピーもしっかり盛り込んで訴求したいアフィリエイター向けです。

ロゴ画像の横に728×90のアドセンス広告（ビッグバナー）を挿入するパターンです。
アドセンスで収益化を図りたいブロガー向けです。

ロゴ画像の横にソーシャルボタンと検索ボックスを表示するパターンです。ソーシャルボタンを目立たせたい人向けです。

ロゴ画像の横にサイト概要（テキスト）と検索ボックスを表示するパターンです。ブログタイトルと概要をシンプルに訴求したい人向けです。

表示の切り替えは管理画面より該当のボタンを選択するだけでOKです。

トップページは2カラムか3カラムを選択可能で、3カラムの場合はサイドバーを左右にまとめて表示できます。記事投稿ページは2カラムのみで左右切り替えが可能です。

テーマ内のカラーは、管理画面よりカラーピッカーを使って直感操作で変更できます。変更可能な箇所は下記の9箇所です。

1.サイドバー見出し
2.プライマリーナビライン
3.グローバルメニューライン
4.フッターライン
5.記事一覧ライン
6.続きを読むボタン
7.見出し（h3）タグ
8.ヘッダー背景
9.全体背景

1～6はテーマカラーとして統一されます。7～9は別々に設定できます。メシオプレス02同様、質感や立体感のないスッキリとした「フラットデザイン」を採用しています。

メシオプレス03では、PC用ウィジェットエリア10箇所と、スマホ用ウィジェットエリアが7箇所あります。PC用とスマホ用で別々のコンテンツを挿入できますので、「モバイルファースト」でのブログ構築が可能です。パソコンユーザーを意識したブログ構成、スマホユーザーを意識したブログ構成、どちらにも最適化されたブログを作ることができます。

タップすると左側からスライドして出てくるメニューです。フッター上部の「スライドメニューを見る」ボタンや、ページ右上「メニュー」ボタンから呼び出すことができます。
　
このスライドメニューはPCサイトのグローバルメニューとサイドバーに該当するもので、Googleトップページ、Yahoo!ニュースはもちろん、Facebook、＠コスメ、クックパッド、マイナビニュース、オリコンスタイルなどの人気サイトでも採用されているスタンダード機能のひとつです。
　
スライドメニュー内のコンテンツは、「PC版への切り替えボタン」「検索ボックス」「グローバルメニュー」の3つが固定で上部に表示され、それより下のコンテンツをウィジェットで自由に設定できます。

トップページのファーストビューにお好きなコンテンツを掲載できます。ヘッダー画像やモバイルバナー（320×50、320×100）を貼ることも可能です。

記事上部にモバイルバナー（320×100、320×50）を表示させるためのウィジェットです。

スマホ専用のフッターコンテンツを掲載できます。スマホの場合は「Fの法則」や「Zの法則」はなくて、「Iの法則」になりますので、上から見てきたユーザーが最後に目にするフッタースペースにキャッシュポイントを置けるようになっています。

スライドメニュー内最上部、もしくはフッターの「PC版を見る」ボタンから、ユーザーが自由に「PC版」と「スマホ版」を切り替えることができます。PC版でもダブルタップしたり、画面を横に倒せば全く問題なく見れます。
　
これにより、「スマホでもPC版サイトが見たいのに、スマホ版しか見れないなんてあり得ない！」「スマホサイトってPC版の機能縮小版でしょ？そんなの見たくないから！」というユーザーの不満を解消することが可能です。

Retina対応とは、簡単に言うと画像を綺麗に表示する機能です。例えばiPhone5の場合、画面サイズは320×568pxですが、システム的には倍の大きさ（640×1116px）の画面を半分に縮小して表示しています。大きな画像を縮小表示することで、ドットが気にならないシャープな表示を実現しています。
　
ですので、Retinaディスプレイでクッキリとした画像を表示させたい場合、実際に画面に表示されるよりも倍の大きさの画像を用意すると綺麗に表示されます。この仕様に対応しました。

Retinaにしたい場合は、倍のサイズの画像を用意して、管理画面で「対応」にチェックを入れるだけです。細かいことは気にしない場合や、めんどくさい場合はそのままのサイズでアップして「非対応」にしておけばOKです。

ホーム画面に登録してくれた際のアイコン画像を、あらかじめ登録しておくことができます。登録しないとサムネイル画像になってしまいますので、ユーザーがパッと見てわかるアイコンを用意してあげると親切です。管理画面から画像をアップロードするだけで設定完了します。

パソコン画面では調度良いタイミング（文節）で改行したつもりでも、スマホは画面幅が狭いので、スマホから見ると変な位置で改行されて余計に見にくくなってしまいます。そこで、スマホ閲覧時のみ、文節改行を無効にすることができます。不要な改行がなくなり、画面内に入るコンテンツ量も多くなり、ユーザーの無駄なスクロールを回避できます。

スマホでは画面幅が狭いので、画像を左右に寄せると、テキストが縦に伸びてしまって非常に読みにくくなってしまいます。そこで、スマホ閲覧時は、左右寄せを無効にすることができます。

メシオプレス01に付属していた簡易ランキング表をバージョンアップさせました。

・画像サイズを拡大し、リンク指定も可能
・テキストリンクを緑ボタンに変更
・リンク先を同一ウインドウで開くか、別ウインドウで開くか選択可能

ランキングを横に3つ並べるショートコードです。

「ランキング横」の順位アイコンなしバージョンです。特集ページへの誘導に使えます。

Q＆A形式の装飾をつけるショートコードです。カラーは赤、青、オレンジ、緑の4色から選択でき、質問と答えに別の色の設定も可能です。質問テキストは黒色と赤色の選択も可能です。

ボックス（囲み枠）のショートコードです。カラーはピンク、ブルー、グリーン、ブラックの4色と背景色なし、背景色グレー、タイトルの有無を選択できます。

レーティング（格付け）マークのショートコードです。星マークと顔マークをそれぞれS、M、Lの3サイズ用意してあります。星マークは小数点以下の繰り上げ、切り捨て機能が付いていますので、星の半分を表示することができます。

メシオプレス01のショートコード（茶枠、肌枠、ブレッド、特典ボックス）も引き続き利用できます。メシオプレス03から特典ボックスのカラーはテーマカラーが自動で反映されるようになっています。

最近の投稿にアイキャッチを表示できるウィジェットです。

・日付のon/off
・見出しの種類選択（テーマカラー、オレンジ、ブルー、グリーン）
・アイキャッチのサイズ指定

も自由に選べます。

閲覧中の記事と同じカテゴリーの記事をアイキャッチ付きでランキング表示できます。関連性の強い記事を表示することで、ユーザビリティの向上と同時に内的SEOの強化にも繋がります。

幅300pxのバナーをサイドバーに綺麗に表示するためのウィジェットです。個別記事の上段ウィジェットにアドセンス広告を設置する場合にも使えます。

任意の記事をアイキャッチ付きでピックアップして表示することができます。指定する記事IDは管理画面の記事タイトルにカーソルを合わせた時に、画面下に表示されます。

アバター付きで最近のコメントを一覧表示するウィジェットです。アバターのサイズ、表示コメント数を指定できます。

見出しのカラーを選択できるテキストボックスです。テーマカラー、オレンジ、ブルー、グリーンの中から選べます。

画像に「枠」または「網掛けの枠」を付けることができます。画像のclassに「waku」「ami_waku」と追記するだけでOKです。

リンクに矢印を付けて強調できます。こちらもclassで簡単に実装できます。

記事の終わりにアドセンス広告（レクタングル（中または大））を横並びで2つ表示します。設定方法は、管理画面にアドセンスコードを一つ設定しておくだけで全ての記事に反映されます。スマホから閲覧している時は、規約違反にならないように1つのみの表示に自動調整されます。広告ラベルの文言も管理画面から設定できます。

タブをたくさん開くユーザーや、ブラウザのお気に入りに登録してくれたユーザーが視覚的でみつけやすい「ファビコン」を設定できます。画像をico形式に変換する必要もなく、管理画面から画像をアップロードするだけでOKです。

更新頻度の高さや、過去記事も最新の情報に修正・更新していることをユーザーにアピールしたい人向けの機能です。IT系のブログなど情報の流れが早いジャンルに使うと「情報が古いから他のブログへ行こう」というユーザーの離脱を防止できます。Yahoo!プロモーション広告の公式ラーニングポータルなどでも採用されています。記事を更新すると自動的に反映されます。

「更新頻度が多くないので、日付を表示しないで運営したい」「ソーシャルメディアに好かれないブログなので、記事冒頭のソーシャルボタンは不要」「ソーシャルボタンは読み込みに時間がかかる」という、以前からメシオプレス01ユーザーさんから挙がっていたご要望に対応しました。管理画面からボタンをクリックするだけで、運営スタイルに合わせて簡単に切り替えることができます。

記事下のソーシャルボタンの上に、俗に言う「コールトゥアクション」の文言を設定できます。ただボタンを設置するだけでなく、言葉でユーザーに行動を促すことでソーシャルボタンを押してもらう確率を引き上げます。管理画面から設定できます。

ロゴ画像横に表示されるWordPress標準の検索ボックスを「Googleカスタム検索」に変更できます。WordPress標準の検索機能は日付の新しい順にしか表示されませんが、Googleカスタム検索は「関連度順」がデフォルトになります。また、ユーザーが「日付順」に並び替えることもできますので、ユーザビリティの向上に役立ちます。

管理画面の「アクセス解析の設定」に、設置したいアクセス解析コードをコピペすれば、＜/head＞か＜/body＞か選択した上で自動的に挿入することが可能です。「アクセス解析タグはどのファイルのどこに挿入すればいいの？」「＜/head＞の直前らしいけど、それってどこにあるの？」「リサーチアルチザンは＜/body＞の直前じゃないと動作しないんだけど・・・」と要望にお応えしています。

また、自分のアクセス記録をカウントしない除外設定も、チェックボックスにチェックを入れるだけです。自分がログインさえしていれば良いので、IPやクッキーに依存しません。より正確なアクセス解析をアシストします。

Facebookなどのソーシャルメディア上で、ブログトップページまたは個別記事がシェアされた際に表示される記事タイトル、説明文、画像を設定できます。ブログトップページ用と各個別記事用で別々に設定できますので、ブログ単位、記事単位でソーシャルメディアでの拡散を意識した訴求が可能です。

運営スタイルに応じて、2列フッター、3列フッター、4列フッターを選択することができます。

メニューの下に説明文を記入できます。この部分をかっこつけて英語で記入しているサイトが多く見受けられますが、日本人の読者を相手にしているなら日本語でしっかり説明することをおすすめします。なお、ドロップダウンメニューには対応していません。理由は、Googleがアクセスビリティの観点から「控えるように」と言っているからです。（参照：search-engine-optimization-starter-guide-ja.pdf）

画面をスクロールすると、右下にさりげなく登場する半透明の「上へ戻る」ボタン（オリジナル画像に変更可能）を実装済みです。いつでも上へ戻れますので、記事が長くなりがちなブログに実装するとユーザービリティの向上に繋がります。クリックしてもURLはそのままですので、ソーシャルボタンのカウントに影響が出ることもありません。

記事下（コメント欄の下）に、前の記事と次の記事がアイキャッチ付きで表示されるようになっています。

お申込みボタンを押すと、ペイパルの画面に移りますので決済を完了させてください。決済完了後すぐにダウンロードURLを記載したメールが届きますので、そちらのダウンロードページよりダウンロードしてください。