『LION BLOG』カスタマイズ【投稿ページ設定】の使い方:初心者向け

『LION BLOG』投稿ページ設定

最終更新日:2018.06.03


WordPressの無料テーマ『LION BLOG』について解説しているページです。

今回のテーマは、カスタマイズ【投稿ページ設定】の使い方です。

投稿ページ設定

投稿ページとは、今、みなさんが読まれているこのページのことを指します。要するに、みなさんの書かれた記事が表示されるページの設定を行うのが「投稿ページ設定」です。

 

「投稿ページ設定」でデキる8つの表示設定

  1. アイキャッチ画像の表示設定の表示設定
  2. 投稿日の表示設定
  3. 投稿者情報の表示設定
  4. 目次の表示設定
  5. 前次記事の表示設定
  6. 関連記事の表示設定
  7. 所属カテゴリの最新記事の表示設定
  8. シェアボタンの表示設定

これらの項目について、表示・非表示の設定を行います。

 

『LION BLOG』にはどんなカスタマイズ項目があるのって方はこちらから。

『LION BLOG』カスタマイズの使い方【項目一覧】

『LION MEDIA』ってなぁに? どんな機能があるのって方はこちらをご覧ください。

『LION MEDIA』はWordPress初心者にオススメのテーマ!

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

アイキャッチ画像を設定する

『LION BLOG』投稿ページ アイキャッチ画像の設定

「投稿ページ」と「アーカイブページ」にアイキャッチ画像を表示するかを選択します。この設定は『LION MEDIA』にはありません。

アイキャッチ画像の表示設定

デフォルトでは「表示する」になっているので、表示したくない場合のみ「無効」にしましょう。

 

投稿ページのイメージ(左が表示あり)

投稿ページアイキャッチ画像イメージ

 

アーカイブページのイメージ(上が表示あり)

アーカイブページのアイキャッチ画像イメージ

 

アイキャッチ画像がないと、なんだか寂しい・・・。

投稿日の表示設定

投稿日を設定しよう

投稿ページ、アーカイブページに表示される投稿日の設定を行います。

初期設定(以下デフォルト)では、「表示する」に設定されています。

投稿日の表示設定

投稿日の表示は、投稿・アーカイブページともに、記事タイトルに下に表示されます。

 

投稿ページのイメージ

投稿ページ 投稿日設定

 

アーカイブページのイメージ

アーカイブページ 投稿日設定

 

 

投稿者情報の表示設定

投稿者情報を設定しよう

投稿者情報が表示されていると、どんな人がこの記事を書いているのかがわかります。

1人で運営しているサイトであれば、運営者のプロフィールさえあればOKですが、複数の人で運営しているサイト場合は、誰がどの記事を書いたのかがわかりませんよね。

そういうときに、投稿者情報が表示されていれば、誰の書いた記事かがすぐにわかりますし、この人が書いた他の記事を見てみたいなぁって思うときも、すぐに探すことができます。

 

『LION BLOG』では、投稿記事の最後に「投稿者情報」が表示されます。

この投稿者情報の編集は、WordPressの「あなたのプロフィール」に登録されている「プロフィール情報」で行います。

プロフィール

 

他にもウィジェットや広告を配置している場合は、「投稿記事」「SNSボタン」「記事下ウィジェット」「記事下ダブル広告」「投稿者情報」の順で表示されます。

エリアの並び順

 

投稿者情報を非表示にする

投稿者情報の設定

デフォルトは「表示する」になっているので「無効」に設定しましょう。

スポンサーリンク

目次の表示設定

目次を設定しよう

ページの上部に表示される目次の設定を行います。デフォルトでは「表示する」に設定されています。

 

『LION BLOG』で表示される目次はこんなイメージです。

目次のイメージ

 

投稿記事を作成した時に、

見出し2(<h2>タグ)」を使用したところが「1.」「2.」「3.」・・・と表示されます。

見出し3(<h3>タグ)」を使用したところは「数字 .1.」「数字 .2.」・・・と表示されます。数字のところは、投稿記事内の「見出し2」の順番を表しています。

 

たとえば、上の画像の「2.1.」は、2番目に使われた「見出し2」の中にある1番目の「見出し3」を表しています。

「目次」と「見出し」の関係イメージ

目次と見出しの関係

 

それをふまえて、カスタマイズ項目に書かれていること読むと、意図することがわかりやすいと思います。

目次の設定

「記事内の最初のhタグの手前に自動で挿入されます」と書かれています。

 

最初のhタグとは、さきほどの「1.」の部分をさしています。つまり、「1.」の見出しの上に目次が挿入されるということです。

 

目次の設定

 

見出し1<h1>タグは、投稿記事タイトルで使っており、記事内で使うことはありません。そのため、投稿記事内では、「見出し2」つまり<h2>タグからしか使用しません。

 

 

ショートタグ[outline]を使う

ショートタグ[outline]を使うと、好きな場所に目次を設置することができます。

 

例えば、先ほどの最初のhタグの後に[outline]と書いてみると、見出しの後に目次が挿入されます。

outlineを使った場合

 

複数個所に[outline]と書いた場合はどうなるの?

その場合は[outline]と書いた複数箇所に目次が挿入されます。

 

 

目次を表示するための最小見出し数を設定

デフォルトは「1」になっています。ということは、1つでも見出し(hタグ)があると目次が表示されます。

 

目次パネルをデフォルトで閉じておく

デフォルトでは、この項目にチェックがはいっていないので目次が展開されています。この項目にチェックを入れると、目次が閉じた状態で表示され、開くをクリックすることで目次が展開されます。

目次を閉じる

 

投稿の編集ページでも個別に設定が可能

カスタマイズ設定で「目次を表示する」に設定していても、投稿の編集ページで、各ページごとに目次の表示設定をすることができます

 

どこにあるのかというと、WordPressの「投稿の編集ページ」画面の一番下にある「目次の個別非表示設定」です。

投稿ページの目次設定

ここで、「この投稿では目次を非表示にしますか?」にチェックを入れるとこの投稿記事については目次が表示されません

 

スポンサーリンク

前次記事の表示設定

前次記事の表示を設定する

前次記事の設定は『LION MEDIA』にはありません。

前次記事の表示設定

デフォルトでは「表示する」に設定されており、記事下に前次記事が表示されます(SNSアイコンの表示をしている場合はアイコンの下)。

前次記事のイメージ

前次記事のイメージ

「前の記事」と「次の記事」ではアイキャッチ画像の位置が違いますね。

 

同じカテゴリーに属する記事のみ表示させる

表示選択の下に「同一カテゴリの前次記事のみ表示する」というチェックボックスがあります。

この項目にチェックを入れる、表示されている投稿記事と同じカテゴリーに属する記事のみを「前次記事」に表示することができます。

 

たとえば、投稿順に対するカテゴリーが以下の場合

1.WordPress
2.ライフスタイル
3.WordPress
4.旅行
5.WordPress

 

表示されている記事が「3.WordPress」だとすると、

前の記事は「2.ライフスタイル」

次の記事は「4.旅行」ですよね。

 

だけど、同一カテゴリのみ表示の設定をしておくと、「2」と「4」は無視され、同じカテゴリー「WordPress」の前の記事「1」と次の記事「5」が表示されるというわけです。

 

関連記事の表示設定

関連記事の設定をしよう

ここでは、投稿ページに表示されている記事内容と関連がある他の記事をページ下部に表示をするかどうかの設定を行います。(先ほどの「投稿者情報エリア」の下が関連記事エリア」になります。)

関連記事を表示させることで、サイトを訪れたユーザーに他の記事を読んでもらえる機会を与えることができます。

『LION MEDIA』では関連記事の表示機能が標準装備されているのでプラグインなどを入れる必要はありません。

 

LION MEDIAの関連記事イメージ

関連記事の表示
※これはイメージなので、関連する記事へのリンクはクリックできません。

 

デフォルトでは「表示する」の設定されているので、表示させたくない場合は「無効」を選択しましょう。

関連記事の設定

 

関連記事を表示する時の最大数を指定

デフォルトでは3件に設定されています。2~10件の範囲で設定が可能です。 で数値の変更ができますが、直接入力もできます。

関連記事件数の設定

直接入力する場合、11以上の数値を入れることも可能ですが、その場合、関連記事は3件しか表示されません。

 

シェアボタンの表示/非表示

シェアボタンの表示設定をしよう

ソーシャルメディアでシェアされると、そのサイトに多くの方がアクセスしてくれるキッカケとなります。アクセス数を伸ばしていく上では、それだけ重要な要素となります。

『LION BLOG』では6つのシェアボタンが用意されています。

  1. Facebook
  2. Twitter
  3. Google+
  4. はてぶボタン
  5. Pocketボタン
  6. LINEボタン

 

シェアボタンを配置する位置は、投稿ページの「上部」「下部」の2ヶ所。いずれか一方だけでも設定が可能です。デフォルトでは、両方表示されるように設定されています。不要な場合は「無効」に変更しましょう。

シェアボタン

また、表示したいシェアボタンを選ぶこともできます。表示したくないシェアボタンはチェックを外しましょう。

 

上下に設置したイメージ

シェアボタン

 

『LION MEDIA』『LION BLOG』の生みの親、FITさんのサイトには、CSSだけで作られたシェアボタンのデザインサンプルが用意されています。CSSの理解があれば、自身のサイトで利用することが可能です。

シェアされるシェアボタンとは。CSSだけで作られて12のオリジナルレスポンシブシェアボタン【無料ダウンロード】~ FIT Web Create(外部リンク)

 

 

以上で、カスタマイズ【投稿ページ設定】の使い方でした。お疲れさまでした。

次は、『LION BLOG』【ウィジェット】の使い方について解説します。

 

『LION BLOG』にはどんなカスタマイズ項目があるのって方はこちらから。

『LION BLOG』カスタマイズの使い方【項目一覧】

『LION MEDIA』ってなぁに? どんな機能があるのって方はこちらをご覧ください。

『LION MEDIA』はWordPress初心者にオススメのテーマ!

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

スポンサーリンク