投稿ページ(記事)に表示されるコンテンツのカスタマイズ方法

投稿ページ(記事)に表示されるコンテンツのカスタマイズ方法
記事上のウィジェットエリア

SWELLの投稿ページでは、「目次」や「SNSシェアボタン」、「この記事を書いた人」、「関連記事」などのいくつかのパーツがあり、それぞれ自由に表示・非表示を切り替えたり、デザインを変更することができます。

このページでは、それらの設定方法について説明していこうと思います。

ver 1.3.2のアップデートで設定項目の表示順などを整理し直したため、現在この記事の通りの見た目ではなくなってしまっています。
※ 数日以内にリライトします…!

目次前広告表示エリア
目次

カスタマイザーの起動

SWELLでは基本的にテーマカスタマイザーから全ての設定を行うことができます。

カスタマイザーの起動方法については以下の記事を参考にして下さい。

あわせて読みたい
【SWELLの設定】「テーマカスタマイザー」の使用方法
【SWELLの設定】「テーマカスタマイザー」の使用方法SWELLの設定やカスタマイズは、ほぼ全て「テーマカスタマイザー」機能で行うことができるように設計しました。「テーマカスタマイザー」機能はリアルタイムで設定が反映...

以下では、カスタマイザー上での操作について説明していきます。

投稿ページの各コンテンツに関する設定は、カスタマイザー内の「投稿・固定ページ設定」というメニューから設定できます。

投稿・固定ページ設定

投稿タイトルの表示に関する設定

SWELLでは投稿タイトルを記事コンテンツのすぐ上に表示するか、ページの上部に表示させるかを選択することが可能です。

詳しくは以下のページをご覧ください。

あわせて読みたい
投稿ページ・固定ページの「タイトル」に関する基本設定
投稿ページ・固定ページの「タイトル」に関する基本設定このページでは、投稿ページ(記事ページ)や、固定ページに表示される「タイトル」周りの基本的な設定方法について説明していきます。【カスタマイザーの起動】投稿リ...

画像に関する設定

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

投稿本文の直前にアイキャッチ画像を表示するかどうかを選択することができます。

アイキャッチ画像の設定

本文の始めにアイキャッチ画像を表示」のチェックによって、以下のオレンジ枠のアイキャッチ画像エリアの表示・非表示がが切り替わります。

アイキャッチ画像の位置
アイキャッチ画像の位置

アイキャッチ画像がない場合にNO IMAGE画像を表示する」にチェックを入れると、アイキャッチ画像を設定していない投稿では上記のエリアに「NO IMAGE画像」が代わりに表示されるようになります。

投稿内画像をクリックで拡大するかどうかの設定

SWELLでは、投稿内の画像に自動で「Lightbox機能」を付与しています。(クリックすると画像がポップアップで拡大表示される機能)

この機能が不要な場合は、以下のチェックを外してください。

Lightbox機能の設定
Lightbox機能の設定

Luminous というLightboxスクリプトを採用しています。

目次の設定

SWELLでは、H2タグの直前に目次を自動生成する機能を使用可能です。

この目次に関する設定も、同様にカスタマイザーの「投稿・固定ページ設定」メニューからカスタマイズ可能です。

詳しくは別記事でまとめましたので、こちらをご覧ください。

あわせて読みたい
目次の設定方法
目次の設定方法SWELLでは、記事の1つ目のH2タグの直前に「目次を自動生成する」ことができます。このページでは、その目次に関する基本的な設定方法を説明していきます。【カスタマイ...

その他のパーツの表示・非表示設定

「各パーツ表示設定」という項目があり、以下のようにチェックボックスが並んでいる箇所があるかと思います。

投稿ページのパーツ表示設定
投稿ページのパーツ表示設定

ここのチェックの有無によって、投稿ページ内の各コンテンツの表示が切り替わります。

上記のチェックボックスに対応するエリアを画像でまとめましたので、番号に対応するエリアで照らし合わせてみてください。

投稿ページの各パーツの配置

前の記事・次の記事へのリンクの設定

上記画像での⑤番にあたる「前後記事へのページリンク」については、デザインのカスタマイズが可能です。

前後の記事リンクの設定

デフォルトでは「標準」が選択されており、次のようなデザインになっています。

前後記事リンク-デフォルト

「シンプル」を選択し、「サムネイル画像を表示する」にもチェックを入れると、以下のようなデザインに変化します。

前後記事リンク-シンプル

関連記事リストに関する設定

関連記事リストについてもカスタマイズが可能です。

関連記事リストの設定

上記のような設定項目があり、ここではそれぞれ以下の内容に関する設定を変更できます。

  1. 「関連記事」というセクションのタイトルを好きなテキストに編集できます
  2. 投稿リストのレイアウトを選択できます
  3. 同じカテゴリーの記事を表示するか・同じタグを持つ記事を表示するかを選択できます

カード型とリスト型の違い

関連記事-カード型
関連記事-カード型
関連記事-リスト型
関連記事-リスト型

記事ごとに個別で設定の上書きが可能なエリア

ここまで、カスタマイザーによるサイト全体の共通設定について説明してきましたが、いくつかの項目は個別のページごとに表示・非表示を切り替えることが可能です。

詳しくは以下のページをご覧ください。

あわせて読みたい
記事・固定ページごとにカスタマイズ可能な各パーツの表示設定
記事・固定ページごとにカスタマイズ可能な各パーツの表示設定このページでは、WordPressテーマ「SWELL」にて記事・固定ページごとにカスタマイズ可能な各パーツの表示設定について解説していきます。各パーツのサイト全体での共通...
記事下のウィジェットエリア

この記事が気に入ったら
フォローしてね!

目次
目次