注目キーワード
時間があっても記事は増えない不思議

【Lion Media】素人でも簡単!6つのカスタマイズを紹介

lionmediaのココが凄い

どうも、たぬすけです。

今回はWordPresテーマ【Lion Media】のカスタマイズについて紹介します。

【LION MEDIA】は正直何もせず、記事を書くだけでかなりカッコイイブログが完成できるおしゃれテーマですが、

「どうしてもここが気になる!!」というポイントが6つもありました。

カスタマイズというと難しいと感じられる方もいるでしょうが、HTML素人の私でもできる簡単なものばかりです。

もし、同じような悩みがありましたら参考にしてください。

Lion Mediaとは

メディアサイト向け無料WordPress用テーマ「LION MEDIA」は、FITが提供するテーマです。プラグインなしでAMPに対応しており、SEO最適化済みで表示速度も速い。そしてレスポンシブデザインを採用し、設定項目が豊富でありながらもカスタマイズが簡単な無料WordPressテーマとなっております。

FIT WEBサイトより
LION MEDIA[ライオン メディア] - デモサイト

ライオン メディアは、モバイル端末での表示を早くするAMPに標準対応。SEO最適化済みで、レスポンシブデザイン。カスタマ…

カッコ良く、オシャレで高性能。有料テーマとも引けを取らないとベテランブロガーの方々が称賛するクオリティー。それがなんと無料。

まだWordPressのデフォルトテーマをご使用の方は、一度試してみることをおススメします。

ちなみに、このブログのテーマは【The Thor (ザ・トール)】といい、【Lion Media】を作ったFitという会社の商品です。

使い勝手に関しても考えられたデザインですので、基本定なカスタマイズは、【外観】⇒【カスタマイズ】で対応できます。

今回紹介するカスタマイズはデフォルトのカスタマイズでは対応できない問題についてです。

広告

Lion Mediaのカスタマイズ紹介

以下予めご留意ください。

  • 【Lion Media】の更新により既に解決されている場合がございます。
  • 同様に紹介する方法が通用しない場合も考えられます。
  • カスタマイズは自己責任です。バックアップを忘れずに。
  • CSSの更新は必ず子テーマ【LION MEDIA CHILD】で行いましょう。

※【Lion Media CHILD】については、下記よりダウンロードできます。

FIT-フィット

千葉のホームページ制作会社…

1.文字が小さい(字体も変更)

初期設定で一番気になったのが、文字の大きさ。ちょっと小さすぎやしませんか?ってくらい小さい。

本文の部分の文字サイズについてです。

サイト説明文を設置したのは、いいけど小さすぎて目がチカチカ、基本文字が薄いので余計に見づらいです。

【解決方法】

フォントのコードをCSSに追記しました。

追加の場所は、【外観】→【CSS編集】にて追記しました。

body
p {font-family: arial;
font-size: 16px;color: 
#16160e;line-height: 1.6;
margin-bottom: 1.em;
}

【結果】

するとこの通り、若干読みやすくなったでしょ?でしょ?

広告

2.サムネイル付きのリンクカードの作成。

紹介したいサイトのURLを【カスタムHTMLブロック】に入力すると自動的にサムネイル付きのリンクカードが作成される機能があります。

例えばこのブログのURLを入力したら、こんな感じで表示されます。

【Lion Media】素人でも簡単!6つのカスタマイズを紹介

この機能は、Lion mediaのものでは無く、WordPressによるものだそうです。
WordPressバージョン4.4より追加されたEmbed(埋め込み)機能で記事内にアドレスを記載すれば、自動的にリンク枠を表示する機能が追加されました。

とても便利な機能ですが、欠点があります、、、、、

URL先が埋め込みを許可していない(もしくはWordPressであればWordPress4.4以前のバージョンを使っている)と機能せず、URLがそのまま表示されてしまいます。

ちなみに【Lion Media】のサイトも対応していないのか?URLだけが表示されてしまいます。

http://lionmedia.fit-jp.com/

↓こちらの記事で勉強させていただきました。

WordPressならURLを貼るだけで「サムネイル画像付きリンク」が設置できるよ。

リンクカードの出現は相手サイトの状態任せとなってしまいます。

その場合は、【Lion Media公式ページ】などと文字リンクが無難でしょう。

このブログのテーマ【The Thor】の場合は内部・外部のリンクカードが搭載されており下記のような表示がされます。
LION MEDIA[ライオン メディア] - デモサイト

ライオン メディアは、モバイル端末での表示を早くするAMPに標準対応。SEO最適化済みで、レスポンシブデザイン。カスタマ…

Pz-LinkCardはおススメできない。

オススメはできませんが、未対応URLについては、プラグイン【Pz-LinkCard】で対応が可能です。有名なプラグインではあります。

表示が重くなるなど理由から私は使用しておりません。

参考までに【Pz-LinkCard】導入については下記記事をご参照ください。

尚、WordPressのリンクはサイズお任せなので、下記のように大きくなってしまう事があるみたいです。【Pz-LinkCard】はカスタマイズ可能です。

Pz-LinkCard – ブログのリンクをブログカード形式で表示できるWordPressプラグイン

3.h2上段をアドセンスを自動設置

【LION MEDIA】では記事中のアドセンスはあらかじめ設定しておいたアドセンスをコードを使用して呼び出す機能がついておりますが、機械的にアドセンスを張り付けてくれる機能はありません。

そこで、目次と同じく【h2】タグの上段に自動的にアドセンスが掲載されるようにカスタマイズしました。

参考にした記事はコチラ

PlusPlus

多機能であるLION MEDIAで、広告も比較的簡単に設置できますが、個人的にほしい機能がありませんでした。それは「最…

4.mobile表示時の人気の記事

【LION MEDIA】には新着記事も関連記事も、もちろん人気の記事もウィジェットで掲載可能です。

デザインもすっきりして見やすく、とても良いのですが。


スマホなどで見た時の新着記事の画像がやたらデカい!!!画像が大きすぎて何番目に人気なのかよくわかりません。

プラグイン【WordPress Popular Posts】に頼ることにしました。

wordpress popular post使用後画像

縮小されて見やすくなりますが、こちらはコチラで見栄えはそれほど良くありません。【WordPress Popular Posts】のカスタマイズについては、別途お調べください。

5.上へのボタンが無い。

このページの右下にある三角マークのアイツの事です。

【LION MEDIA】には最下段中央にTOPへ行くボタンが搭載されておりますが、途中でTOPへ戻るボタンはありません。


そこで、プラグインを使用せずにTOPへボタンを追加する方法を紹介しているサイトがありましたので、導入しました。

岡山のWordPressを使ったホームページ制作ならOffise Kondo

プアラグインを使わずに「ページのTOPへ戻るリンク」を設置する方法をご紹介します。個人的にプラグインの数は少ない方が良い…

尚、ブログのテーマ【The Thor】は上へボタンが初期搭載されているため、カスタマイズは不要です。

6.前の、次の記事へのボタンが無い。

実は【LION MEDIA】には通常記事下にある【前の記事)(次の記事)へのボタンがありません。

こちらもプラグインを使用せずに追加する方法を教えていただいたサイトがありましたので、紹介させていただきます。

【参考にさせていただいたブログ】

イージーライフ

ワードプレスではよく投稿ページの下に「<< 前の記事」「次の記事 >>」のリンク(ナビゲーション)が表示されていますが、…

尚、ブログのテーマ【The Thor】は次の記事・前の記事の表示機能は初期搭載されているため、カスタマイズは不要です。

まとめ

以上【Lion Media】カスタマイズ6選でした。

無理なく自分なりのカスタマイズで楽しんでみてください。

The Thorについて

カスタマイズって楽しいですけど、ブログで一番大事なのはデザインや機能よりも記事なんですよね。そう考えるとカスタマイズに時間をかけるのは非効率という事になってしまいます。(楽しいけど)

現在このブログ使用しているテーマは【Lion Media】を作ったFITが万を持して投入した【THE THOR】です。

こちらは有料テーマですが、今回ご紹介したカスタマイズの内容が初期装備されている【Lion Media】の上位テーマとなります。

一度購入すれば複数サイトで使用でき、ベースデザインも数種類用意されておりますので、簡単にお好みのページが作れると思います。

興味がありましたら【THE THOR】のバナーをクリックしてみてください!!

広告
lionmediaのココが凄い
最新情報をチェックしよう!
>いざ想像の世界へ!!

いざ想像の世界へ!!

デジタルツールでお絵描きをはじめるなら【クリスタ】をおススメします!
使い易さと共にユーザー数も多いので、わからない事があってもすぐに検索で調べる事ができます。
もちろん私も愛用者です。
このサイトのお絵描きは【クリスタ】の使用を前提にしています。
他にも無料のお絵描きツールもありますが、有料である【クリスタ】使用するメリットは圧倒的な使い易さと拡張性です。
無料のお試し期間もあるので、是非試してみてください。