『LION MEDIA』カスタマイズ【基本設定】の使い方:初心者向け

『LION MEDIA』カスタマイズ【基本設定】の使い方:初心者向け

最終更新日:2018.05.25


WordPressの無料テーマ『LION MEDIA(ライオンメディア)』のカスタマイズ設定の使い方について解説している記事です。

 

今回のテーマは、基本設定です。

基本設定[LION用]

 

基本設定では、サイトトップページの構成などを設定していく項目になっています。

 

こはるママ風に言ってみると

こはるママ  こはるママ

今日は、このお弁当箱(LION MEDIA)を使おう!

ご飯はここに詰めて、おかずはこの辺りかな・・・。

 

こんな感じです。後からいくらでも変更可能なので、おおまかに決めていきましょう。

 

スポンサーリンク

検索機能の検索対象

検索のイメージ

サイト訪問者が検索ボックスを利用したときに、検索対象ページをどの範囲までにするのかを設定する項目になります。

 

検索ボックスとは、みなさんご存知かとは思いますが、

これでーす!

検索ボックス

 

検索ページの範囲設定は3項目から選ぶことができます。

 

1.固定ページと投稿

デフォルト(初期設定)はこちらが設定されています。

2.投稿ページ

投稿ページとは、投稿記事のページのことを指します。

3.固定ページ

固定ページとは、WordPressの固定ページで作成したページのことを指します。お問い合わせページ、サイトマップ、プライバシーポリシー、会社概要など。

 

 

こはるママ  こはるママ

ユーザーが検索する場合、

投稿ページから検索することが多いので、2の設定でもOKです。

 

アーカイブページの投稿の抜粋文字数

アーカイブうのイメージ(引き出し)

アーカイブページとは、複数のページを1つにまとめたページのことです。アーカイブページがあることで、サイト訪問者が記事を探す際のひとつの手段となります。

 

『LION MEDIA』でいうと、投稿記事につけたカテゴリータグごとにまとめたページ、投稿時に記録された「投稿年月日」を元に作られる年月ごとのページのことを言います。

 

複数の記事が集まっているアーカイブページでは、1つ1つの記事の内容がわかるように、アイキャッチ画像や記事タイトル、記事の抜粋文が表示されるように設定されています。

 

その記事の内容を抜粋する文字の数を指定するのがこの項目になります。

 

指定できる文字数は、20~500文字の間で自由に設定ができます。デフォルト(初期設定)は200文字です。指定した文字数を超えた場合は、[…]で表示されます。

左:200文字 / 右:400文字

アーカイブ文字数設定

 

 

 こはるママ

文字数の多い少ないは自分の好みになりますね。

多すぎると、抜粋文を読むだけでだいたいの内容がわかってしまい、記事をクリックしてもらえないかも・・・。それにデザイン的にもちょっと縦長な感じになるしなぁ・・・。

 

こはる的には、150文字~200文字ぐらいでちょうどいいと思っています。

 

スポンサーリンク

アーカイブページのタグ表示件数

タグのイメージ

タグとは、荷札や値札などのことを意味します。Web上では、ファイルに含まれる追加情報を表しています。

みなさんがよく知っているタグ情報でいえば、ツイッターのハッシュタグや、写真を撮影した時にについているタグ(撮影日時や撮影場所、カメラの撮影情報など)なんかがわかりやすいでしょうか?

タグをつけておくことで、検索した際に見つけやすくなります。

 

この項目では、アーカイブページのタグ表示件数の設定を行います。

 

赤い線で囲んでいる部分がタグの表示です。「0」を指定すると、投稿時に追加したタグが全件表示されます。また、マイナス設定にするとタグが表示されなくなります。

タグの表示

 

タグが多い記事と少ない記事が横に並んだ場合

「タグが多い記事」と「少ない記事」が横に並ぶと、タイトル位置がずれます。見栄えが気になる方は、この点を考慮してタグの表示件数を調整しましょう。

タグの多少の違い

 

レイアウト設定

レイアウトイメージ

サイトの基本となる枠組みを決定する項目になります。

 

カラム数を選ぶ

カラムって言われても・・・・・・。カラムとはのことを意味しています。

LION MEDIAでは、サイドバーのない1カラム」またはサイドバーがある2カラム(デフォルト)」から選ぶことができます。

 

お弁当箱を想像してみてください。

1カラムと2カラムのイメージ(ランチボックス)

 

仕切りがある状態が「2カラム」、仕切りをはずしたのが「1カラム」です。

なんとなくイメージできましたか?

 

『LION MEDIA』では、アーカイブページ、投稿ページ、固定ページ、各ページごとに別々に設定することができます。

 

では、設定したイメージを見ていきましょう。

 

アーカイブページのレイアウト

デフォルトの2カラムでは、画面右にサイドバーが設置されていますね。

2カラム

 

1カラムを選ぶと、サイドバーがなくなります。

1カラム

 

投稿ページ・固定ページのレイアウト

2カラムはアーカイブページと同じように、サイドバーが設置されています。

投稿2カラム

 

1カラムではサイドバーがなくなります。

1カラム

 

初心者の場合は、2カラムのほうが扱いやすいと思います。それに、サイドバーがあると何かと便利。色々なものを設置できるので、ユーザーを導きやすいのではないかと思います。

 

1カラム時のメインカラムの横幅を設定する

1カラムを選んだ場合、横幅のサイズを設定することができます。

サイズの選択肢は、740px」「820px(デフォルト)」「900px」「100%の4つです。

選択した横幅のサイズは、1カラムを設定しているすべてのページに適用されます。(例えば、投稿ページと固定ページに1カラムを設定、横幅を820pxとした場合、どちらのページも820pxとなります。)

左:820px / 右:100%

デフォルトから100%に変更

 

スポンサーリンク

記事ビューレイアウト設定

レイアウトのイメージ

 

アーカイブページにおける記事の表示レイアウトの設定を行います。

「ノーマル(デフォルト)」「ワイド」「ノーマル(PC)/ ワイド(スマホ)」の3つから選ぶことができます。

 

ノーマルの場合

記事は2列でレイアウトされます。デフォルト(初期設定)はノーマルになっています。

記事ビューレイアウトのイメージ

 

ワイドの場合

先ほど2列だったレイアウトが1列に変更されます。アイキャッチ画像が大きく表示されるので、インパクトがありますね。

ワイドレイアウトのイメージ

 

スマホの表示(左:ノーマル / 右:ワイド)

記事ビューレイアウト(スマホ)

 

ノーマル(PC)/ ワイド(スマホ)の場合

『LION MEDIA』では、「インフィード広告を利用する場合、スマホのビューレイアウトをワイドにしないと、インフィード広告が表示されない可能性があります。」と注意書きがあります。

 

インフィード広告とは

インフィード広告とは、コンテンツとコンテンツの間に溶け込んで表示される広告のことを言います。

インフィード広告

 

PCもスマホの「ノーマル」設定にした場合、どうなるのか?

カスタマイザーのスマホビューで確認してみたところ・・・インフィード広告と記事が重なって表示されてしまいました。

記事ビュー ノーマル設定(スマホ)

これだと、せっかくの広告表示が台無しに・・・。

ということで、インフィード広告を利用される方は、「ノーマル(PC)/ ワイド(スマホ)の設定にしましょう。まだ広告を利用しないという方は、「ノーマル」か「ワイド」のお好きなレイアウトを選んでくださいね。

 

お知らせヘッダーの表示選択

お知らせのイメージ

お知らせヘッダーは、「新着記事がありますよ~」とか「サイトメンテナンスは○月○日に行います」など、サイト訪問者へ伝えたい内容を設定する項目になります。

初期設定では「非表示」になっているので表示されていません。

 

お知らせが表示される位置

お知らせヘッダーの位置は、サイトタイトルが表示されている上のエリアになります。少し見にくいですが、赤い帯状のところです。

お知らせヘッダー

 

お知らせヘッダーを表示させる

お知らせヘッダーを表示させるには、「表示」を選択し、お知らせしたい内容を「表示させたい文章」欄に入力します。

お知らせ文章入力

表示させたい文章にリンクを貼る場合は、「リンク先URLを入力」欄にURLを入力します。

お知らせヘッダーの背景色は「背景色を指定」で自由に変更することができます。

 

先ほどの位置イメージでは、背景が赤、文字が黒という組み合わせで、文字が読みにくい状態でしたよね。読みやすさ、見やすさも考えながら設定していきましょう。

スポンサーリンク

カテゴリー・タグ説明の表示設定

タグのイメージ

カテゴリー・タグの説明ってなんのこと?

WordPressでカテゴリーやタグを新規追加や修正をするときに表示される入力項目です。説明を入力するボックスの下に「デフォルトではあまり意味を持ちませんが、これを表示するテーマも中にはあります。」と記載されています。

そうです!『LION MEDIA』は説明が表示されるテーマなのです!

カテゴリー・タグの説明

 

この説明欄に入力した内容をどこに表示するのかを設定する項目になります。

 

meta descriptionで表示

meta descriptionとは、「Googleさ~ん!ここにサイトの説明やカテゴリーの説明を書いてますよ~!」とお知らせするhtmlの言語のことをいいます。

ここで、「meta descriptonで表示」を選択すると、Googleさんの検索結果に、説明欄で入力した文章が表示されるのです。

検索結果の例

metaの表示

1行目:タイトル

2行目:サイトURL

3行目:説明で入力した文章(meta description)

 

アーカイブページで表示

アーカイブページで表示を選ぶと、カテゴリーやタグ名の下に説明文が表示されます。

カテゴリー説明

 

両方で表示(デフォルト)

デフォルト設定では、「meta」と「アーカイブ」の両方で表示させるように設定されています。

ユーザーは検索結果において、タイトルと説明文を見てクリックしようか判断するので、デフォルト設定のままでOKだと思います。

 

こはるママ

ただし、説明文を入力していない場合は表示されないので、表示したいと思っている方は忘れず入力しておきましょうね。

 

 

Copyrightの設定

Copyrightのイメージ

Copyright(コピーライト)とは、著作権という意味です。

著作権(ちょさくけん、英語: copyright、コピーライト)は、明確な形を持たない無体財産権(無形固定産)である。 主な無体財産権は、書物、言語、音楽、絵画、建築、図形、映画、コンピュータプログラムなどである。 また、特性が類似する特許権や商標権も含めて、知的財産権と呼称する場合もある。

引用元:Wikipedia「著作権」

 

Copyright(コピーライト)とWebサイトに明記することで、「このページには著作権があるぞー!勝手にコピーしないでね~」と示せるわけです。

 

ここの設定で、何も入力しない場合はCopyright 2018 サイト名】が自動的に表示されます。

 

デフォルトで、【タグ利用可能】の下にあるボックス内には、「© Copyright 2018 <a class=”copyright__link” href=”サイトURL”>サイト名</a>.」と入力されています。

タグ利用可能

ここに設定されている内容は消すことができるので、自由に編集を行うことができます。

「タグ利用可能」の意味は、HTML&CSSのタグを使うことができますよってことです。タグ利用するには知識が必要なので、初心者の方はデフォルトのまま利用しておきましょう。

 

FITおよびWordPressへのリンクを非表示にする

コピーライト

ここにチェックを入れると、「© Copyright 2018 Mamma Ridea マンマリデア.」の下にある【Mamma Ridea マンマリデア by FIT-Web create. Powered by WordPress.】という一文を消すことができます。

通常、無料で提供されてるテーマでは消せないことが多いのでビックリ!です。感謝の意を込めて、表示させておいても問題ありません。

 

FITさん、なんて親切なの!ありがとうございます!

 

スポンサーリンク

最初に開くメニューの選択

メニューのイメージ

この項目では、ユーザーがサイトにアクセスしたときに表示されるメニューのレイアウトを決定します。

 

検索メニュー(デフォルト)」と「Gナビメニュー」の2つから選ぶことができます。ちなみに、当サイトは「Gナビメニュー」で設定しています。メニューが表示される位置は、サイトタイトルの下になります。

 

メニュー選択

 

サイトが表示されているときは、右上の「 虫眼鏡」「 バー」をクリックすることでメニューの切り替えができます。

 

こはるママ

2カラムを選択しているのであれば、サイドバーに検索ボックスを設置することができるので、Gナビメニューを選んでもいいですね。

スマホの表示を考えると、最初に検索ボックスが表示された方がいいのかな・・・なんて思ったりもします。悩むところですね。

 

ロゴ画像の設定

ロゴマークのイメージ

この項目では、サイトのロゴ画像の設定をします。

サイトロゴ用の画像は、「高画素密度のディスプレイ表示を考え、縦60×340pxの透過PING画像を指定してください」と指示されているので、条件通りに用意する必要があります。

サイトロゴの用意がまだできていない場合は、後々設定してもいいかと思います。

 

ロゴがある場合とない場合のイメージです。

どちらも白文字なのでわかりにくいですが、上:ロゴなし / 下:ロゴあり です。

サイトロゴ

 

 

当サイトは『THE THOR』を使っています。

詳細は公式ページをチェック!!


『LION MEDIA』『LION BLOG』のFITから、ついに有料テーマがリリース!
なんと、LIONテーマの10倍以上の機能を搭載

 

「THE THOR(ザ・トール)」

プラグインなしでSEOにも対応したWordPressのテーマです。初めての方でもサポート付きなので安心です。
デザイン着せ替え機能」を使えば、気に入ったデモサイトのスタイルを、あなたのサイトにワンクリックでコピーできますよ。

お気に入りのスタイルをダウンロードして、「THE THOR ザ・トール」を始めてみませんか?

当サイトからご購入の方には特典をお付けいたします。

詳しくはこちら

 

スポンサーリンク