WordPressテーマ「LION MEDIA」の使い方やメリット・デメリット

つい先日ツイッターでこんなことを話しました。

仮にもデザイナーを名乗っている以上、ブログのデザインにもこだわろうと思った。ので、今日からカスタマイズを頑張ります。今こんなんだから・・・ pic.twitter.com/fpMbN7X5Pt

— ヤマダ カイト@デザイン/ブログ/副業 (@slash_kaito) 2018年2月9日

「コンテンツ部分だけ残して、ヘッダー部分は自作したろ」とか思ってましたが、やめました。

いい感じのワードプレステーマを見つけてしまったので。

それがこちら。

「LION MEDIA」

LION MEDIAでできること（2018.3.14追記）

とにかく簡単にできるようになることが、たくさんあります。

あまりに多いため公式サイトから引用させていただきます。

1. NO JavaScript（CSSの非同期読み込み機能と、ヘッダーのメニュー切り替えのみにJavaScript使用）
2. W3Cの規格に基づくマークアップでエラーなし
3. モダンブラウザに最適化のため、IEは非対応（11は表示されると思う）
4. 管理画面の投稿・固定ページのビジュアルエディタは、実際に表示されるデザインとほぼ同じ
5. 管理画面の投稿一覧に、IDと閲覧数、サムネイル画像を表示
6. 管理画面の投稿一覧は、閲覧数で並び替え可能
7. 管理画面からテーマの更新が可能
8. 簡易お問い合わせページが標準で備わっている
9. 固定ページを利用してランキングページを作成可能
10. パンくずリストと投稿記事は構造化データを用いたマークアップ済み（schema.org）
11. 記事上、記事下用のウィジェットエリアがある
12. フッターは、左、中央、右の3か所にウィジェットエリアがある
13. TOPページ用のウィジェットエリアがある
14. サイドバー固定表示用ウィジェットエリアがある（スクロールに追尾）
15. 広告用ウィジェットアイテムがある
16. 人気記事用ウィジェットアイテムがある（表示件数自由）
17. 画像付き最新記事ウィジェット搭載（通常の新着機能ウィジェットをカスタマイズ）
18. 必要十分な細かなSEO対策が施せる（ページ単位でdescriptionやmeta robotの設定が可能）
19. CSS非同期読み込みが選択可能（レンダリング速度が速くなる）
20. OGPの設定もカスタマイズが可能
21. 検索対象を「投稿・固定ページ」「投稿ページのみ」「固定ページのみ」と切り替えられる
22. アーカイブページに利用される投稿の抜粋文字数を指定可能（抜粋表示は<!–more–>が優先）
23. レイアウトを1カラム2カラムと選択可能（アーカイブ・投稿・固定ページすべて設定可能）
24. カテゴリアーカイブページにカテゴリの説明文章を表示可能
25. ロゴを設定可能（ロゴが無い場合は【設定】→【一般】の「サイトのタイトル」を表示）
26. ヘッダーに注目検索キーワードを設定可能
27. トップページにピックアップ記事を設定可能（3件表示）
28. トップページにランキングボックスを表示可能
29. トップページに全カテゴリの新着(1件)表示ボックスを表示可能
30. 投稿者のプロフィールを簡単にカスタマイズ可能
31. copyrightを自由に書き換え可能
32. copyright下のリンクや文字列を非表示にできる
33. AMP対応（通常ページとデザインがほぼ同じ）
34. AMPページがGoogleの検索結果でカード表示された時用のロゴ画像を設定できる
35. AMPページでも記事上と記事下に広告が設置可能
36. AMPページ用にTwitter、Instagram、YouTubeの埋め込みが自動で変換される
37. 投稿ページの投稿者情報の表示/非表示の選択が可能
38. 投稿ページの同一カテゴリ新着6件の表示/非表示の選択が可能
39. 投稿ページの目次の表示/非表示の選択が可能（目次は専用のショートコードで表示場所を自由に変更可能）
40. 投稿ページの関連記事の表示/非表示の選択が可能（表示数も1から10で選択可能）
41. 投稿ページのシェアボタンの表示/非表示の選択が可能（シェアボタンもJS不使用で軽量）
42. 投稿ページのシェアボタンの表示項目が6つある（Facebook、Twitter、Google+、はてぶ、Pocket、LINE）
43. Google AnalyticsはトラッキングIDだけあれば設定完了
44. AMPページ用のGoogle AnalyticsのトラッキングIDも登録可能
45. Google Search Consoleも認証IDだけで設置可能
46. 2パターンあるベースデザインはすべてハイクオリティ
47. 無限に選べるテーマカラーと、様々なカスタマイズを駆使すればオリジナリティを表現可能
48. 【追加】Ver.1.1.0から記事アーカイブに表示するタグ数を制御できる機能を追加
49. 【追加】Ver.1.1.0からダブルレクタングル広告を簡単に表示できる機能を追加
50. 【追加】Ver.1.2.0から</head>と</body>タグの直上に自由にタグを記述できる自由入力エリアを追加
51. 【追加】Ver.2.0.0からHeader最上部にお知らせを表示する機能を追加
52. 【追加】Ver.2.0.0から投稿日の表示/非表示機能追加
53. 【追加】Ver.2.0.0から記事の終わり部分にCTAエリア追加
54. 【追加】Ver.2.0.0からインフィード広告登録枠を追加
55. 【追加】Ver.2.0.0から記事中にアドセンス等の広告を挿入するショートコード追加

引用：LION MEDIA公式サイトより

ブログのカスタムが、ある程度はCSSをいじらずカスタマイザーからできます。

すっごい簡単すぎて泣けてくる・・・！カスタムに時間をかけるくらいなら、記事を書け！ということなんですね。

ありがとうございます！FITさん！（深々）

LION MEDIA公式サイトを見てもらえば分かる通り、特にカスタムせず使っても素晴らしいデザインのブログが作れちゃいます。

SANGOやストーク、ATLAS作者とアフィリエイターのひつじさんが共同開発し、最近リリースになったJINなどもオシャレなテーマですが、あちらは有料。

こちらは無料でこのクオリティ。

すごいです。最近増えてるマネタイズの方法、フリーミアムというわけでもないのに。しかもこの更新頻度。

フリーミアム（Freemium）とは、基本的なサービスや製品は無料で提供し、さらに高度な機能や特別な機能については料金を課金する仕組みのビジネスモデルである。

引用:Wikipediaより

特にJINやSANGOのようなマテリアルデザインだと、リアルな写真などをアイキャッチにすると少し浮いてしまいますが、LION MEDIAなら写実的な感じでもOK。

むしろ、そういうアイキャッチのほうがマッチします。

LION MEDIAの使い方（2018.5.17追記）

LION MEDIAはほとんどの設定をカスタマイザー（外観＞カスタマイズ）から行えます。

しかし、開いてみるとカスタマイズ項目が多く、どこから設定したらいいか迷うかもしれません。

妻

多いね

僕の場合はですが、順序としては「収益に関係するもの＞アクセスに関係するもの＞見た目に関係するもの」という感じで行なっていきます。

なぜかと言うと、お金が一番大事だから（笑）

その次がアクセス。

最後がデザイン。

妻

デザイナーやのに（笑）

というわけで、広告設定［LION用］から見ていきましょう。

LION MEDIAカスタマイザーの広告設定［LION用］の使いかた

なんと！

LION MEDIAは初めから、アドセンス用の「記事内広告」「アーカイブ用インフィード広告」「記事下用ダブル広告」「AMP用広告」の枠があります。

テーマ編集からsingle.phpをいじったりしなくていいわけです！

これは非常に便利！

その分、場所の入れ替えなどには対応できないですが、とりあえず記事内とインフィードと記事下ダブルレクタングル入れとけば間違いないっしょ！というFITさんからのメッセージにも感じます。

まぁ実際、アドセンス始めたてのうちは全く問題ないと思います。

アドセンスの登録方法や設定方法などは、こちらが詳しいですのでご参照ください。

動画フロンティアル

おすすめのアダルトサイトの利用方法や支払い方法などを初心者向けに図解で紹介しているサイトです。 安心・安全な国内サイトを中心にお得情報と一緒に紹介していきます。 ↓FANZA人気ランキングはこちら↓ ⇒FANZA期間限定キャンペーン開催中！

affiliate150.com

※その他の項目も順次追加していきます！

Lion Mediaを選んだポイント

僕が個人的にいいな、と思ったポイントです。

初めからなんとなく完成形をイメージしていたので、それが日本製のテーマであったのは助かりました。

子テーマがある

CSSやsingle.phpなどは結構いじることがあります。

更新が頻繁にあるテーマだと、直でいじると修正した内容が上書きれてしまいます。

そういった時に、子テーマがあると便利。アップデートしても、修正した変更が消えることがありません。

子テーマのダウンロードはこちらから。

親テーマと同じ階層に入れておけば、テーマを子テーマに選択できちんと反映される。

なお、アップデートが合った場合も、上書き修正される心配がありません。

シングルカラムと2カラムを選べる

一番のポイントはここです。

シングルカラムはよく、「バイラルメディア向き」「直帰率が上がる」「アドセンスの収益が下がる」

などの論争がありますが、そもそも僕には関係ないすわー！

下がるほどの収益もないし|ω・｀)

結局スマホだったらシングルカラムだし、PCも同じほうがいいでしょ。

CTAも記事下しか動きないんじゃないかな、という謎の仮説のもと断行。

すると意外な結果が。

謎の直帰率。テーマ変えただけでそんな変わります？ pic.twitter.com/zTinN9es2R

— ヤマダ カイト@デザイン/ブログ/副業 (@slash_kaito) 2018年2月12日

ほーらね(ドヤ顔

ただのアナリティクスの二重記入でした・・・（恥

とはいえ、ちゃんと修正してからも直帰率は下がっております。

具体的には20%ほど。やっぱり2カラムだと記事に集中できないんですよきっと。うんうん（ドヤ顔

2018.6.5さらに追記

コンテンツによるとは思うんですが、バイラルメディアっぽくしてみたい方はこちら。

アイキャッチを大きくしたりすることで、インパクトを出しています。

404 NOT FOUND | リンカイ-デザイン

EC/D2Cと二拠点生活「リンカイ-デザイン」

rinkai-design.com

ヘッダーにオススメ記事を配置できる

スマホでもサイズ感を変えずに入れられるのが良いですね。

アナリティクス見てると、やっぱり一度はホーム画面に来てくれる人が多いです。

どんなブログやねん、みたいな感じで興味を持ってくれるんでしょうか。

そこでオススメ記事をバーンと見せられると直帰率も下がるのかな、と。

グローバルメニューがレスポンシブでいい感じ

以前使っていたsimplicityは、スマホ版のグローバルメニューがハンバーガーアイコンでした。

こんなの↓

これでも悪くは無いんですが、PC版に比べ一覧性が良くないというのがありました。

つまり目的のカテゴリーに行くのに、2ステップかかってしまうということ。

初めから見えていれば、1ステップで目的のカテゴリーに行けるので便利ですね。

2018.6.18追記

PC版もカテゴリー分けをわかりやすくするためにカスタマイズしました。

404 NOT FOUND | リンカイ-デザイン

EC/D2Cと二拠点生活「リンカイ-デザイン」

rinkai-design.com

Lion Mediaの修正したいポイント

グローバルメニューの固定

スクロールさせた時に上のメニューが追従してこないのが、ユーザビリティ上いまいちなので改修しました。

記事途中でもグローバルメニューが出てる状態にする、ということですね。

これをすると直帰率の改善になる！気がします。

CSSをちょっと追加するだけなので簡単ですね。いずれ記事にします。

しました↓

404 NOT FOUND | リンカイ-デザイン

EC/D2Cと二拠点生活「リンカイ-デザイン」

rinkai-design.com

ページャーの表示数が少ない

ここです↓

2ページ目とか3ページ目を見たい時にNEXTを2回・3回と押さないといけません。

これもユーザビリティの問題で、あまりよろしくないですね。

これはPHPの修正なのかな？

なるべくプラグインは使いたくないので、function.phpを触らないとですね・・・

マウスオーバーでグローバルナビからサブメニューが出るようになって欲しい（2018.3.14追記）

ストークのように、マウスオーバーでサブメニューが出るようになったら最高ですね。

親カテゴリーだけの表示だとどうしても情報の深度が浅いため、踏まれなくなる気がするんですよね・・・。

HTMLとCSSだったら楽勝でできるんですが。。。PHPなので手をこまねいています。

時間がある時チャレンジしてみようと思います。

function.phpさわるのこわ〜〜い！！！

本日のまとめ

使い始めてからまだ1週間経っていませんが、導入してから1ヶ月以上経ちましたが、Lion Mediaかなりいい感じです。

目に見えて離脱率も減りましたし。

部分的に改修するところはまだまだありそうですが、とりあえずこのテーマを使い倒していこうと思います。

WordPressテーマ、Lion Mediaのダウンロードはこちらから。

もっと便利に使うカスタマイズ方法もご紹介しています。

”https://rinkai-design.com/lion-media-header/

それではまた。

ヤマダ

この記事が役に立ったら、シェアorはてブしてくれるとメッチャ喜びます！