【AFFINGER6】新着記事・関連記事エリアのカスタマイズ方法を解説

2022年5月3日

 

自分のブログの新着記事や関連記事をもっと伝える方法は無いのかな??

 

今回の記事はこんな疑問を解決していきます。新着記事や関連記事はユーザビリティを向上させる大切なコンテンツの一つです。

 

AFFINGER6をご使用されているユーザーの方は、設定画面から簡単にカスタマイズが行えるので、紹介していきます。

 

設定はものすごく簡単にできますので、ぜひ参考にして見て下さい!

 

本記事の内容

新着記事エリアのカスタマイズする方法

関連記事エリアのカスタマイズする方法

 

 

\ 当ブログ使用テーマ /

  • 誰でもかんたんにオシャレデザイン
  • インフォトップ月間総合ランキング第1位
  • SEO対策と広告収入UP機能を標準装備!

初心者から有名ブロガーまで愛用されているSEO最強WordPressテーマ。下記のボタンから購入で、今なら5,000円相当のプラグインが無料でついてきます。

AFFINGER6の購入はこちら

 

\ AFFINGERのカスタマイズまとめ /

【徹底的に解説】AFFINGER6の設定・デザインをカスタマイズ方法まとめ

続きを見る

 

AFFINGER6で新着記事エリアをカスタマイズする方法

イラスト

 

AFFINGER6で新着記事エリアをカスタマイズする方法について紹介していきます。設定方法は2パターンあります。

 

新着記事エリアをカスタマイズする方法

  • AFFINGER6の設定画面よりカスタマイズ
  • WordPressのデフォルトからカスタマイズ

 

AFFINGERをご使用のユーザーの方は、ぜひ 、AFFINGERの設定からのカスタマイズをおすすめします。

 

完成形のイメージはこちら

 

 

 

AFFINGERの設定画面から新着記事エリアを設定する方法

まずはWordPress管理画面に移動して、順番に設定を行っていきます。

 

step
1
AFFINGERの管理画面に移動

AFFINGER6管理」→「トップページ」を選択しましょう。

 

 

step
2
記事一覧の項目設定

記事一覧」の段落に「新着記事」の設定項目があります。新着記事エリアのカスタマイズはここから可能になっています。

 

 

step
3
トップページのコンテンツ設定

新着記事の一覧をトップページに表示する設定を行います。以下の赤枠のチェックマークを外すことで表示設定が完了できます

 

 

step
4
トップページのサイドバー設定

新着記事の一覧をサイドバーに表示する設定を行います。以下の赤枠のチェックマークを外すことで表示設定が完了できます

 

 

 

サイドバーへの設定ができたら、表示する件数も指定しておきましょう

 

 

step
5
新着記事の見出しの設定

新着記事一覧に表示する見出しの設定を行います。お好みのワードを「新着記事一覧に表示する見出し」の項目に入力しましょう。

 

 

お好みに合わせた設定が完了したら、最後に「save」ボタンを押して設定を更新しましょう。

 

WordPressのデフォルトからカスタマイズする方法

それでは、もう一つ新着記事一覧を表示させる方法を紹介していきます。

 

こちらの方法はAFFINGER6だけでなく、WordPressのデフォルトの機能で備わっている機能を活用していきます。

 

完成形のイメージはこちら

 

こちらは、新着記事をシンプルに表示させていという方におすすめの表示方法になっています。

 

step
1
ウィジェットへ移動

WordPress管理画面から「外観」→「ウィジェット」に移動しましょう。

 

 

step
2
ウィジェットの追加

ウィジェット項目に「最近の投稿」を選択して、追加したい場所に追加しましょう。

 

今回はサイドバーについてしていきます。

 

 

step
3
表示設定を行う

表示する投稿数」や「投稿日の表示のON /OFFの切り替え」を設定しましょう。

 

設定が完了したら「保存」を選択しましょう。

 

 

 

新着記事エリアの色をカスタマイズ

新着記事の設定が完了したら、配色のカスタマイズをしていきましょう。

 

WordPress管理画面から、「外観」→「カスタマイズ」に移動しましょう。

 

各テキストとhタグ(見出し)」→「ウィジェットタイトル(サイドバー)」にて、文字色や背景色、ボーダーカラーなどの設定が行えますので、お好みに合わせて設定しましょう

 

 

ポイント

AFFINGER6のカラー設定でメインカラーをオリジナルで決めてしまった方は、追加CSSから直接CSSコードにて編集・設定しましょう。

 

created by Rinker
¥2,398 (2022/09/26 19:23:10時点 楽天市場調べ-詳細)

 

AFFINGER6(アフィンガー6)で関連記事エリアをカスタマイズする方法

 

次は関連記事エリアのカスタマイズ方法について紹介していきます。

 

AFFINGER設定画面にて、簡単に設定が行えますので、こちらも設定も活用できるようにしておきましょう。

 

関連記事エリアをカスタマイズ

WordPress管理画面から「AFFINGER6管理」→「投稿・固定記事」を選択して下さい。

 

 

記事の下の方までスクロールすると「関連記事一覧」項目が表示されます。

 

 

読者のユーザーが読んでいる記事の関連したものをAFFINGER6が自動で表示してくれます

 

すごく便利っ!

 

見出しのテキストや表示件数はお好みに合わせて設定してみてください。設定が完了したら「save」にて設定の保存をしておきましょう。

 

こんな感じで表示されます

 

 

関連記事エリアの色をカスタマイズする方法

関連記事の設定が完了したら、配色のカスタマイズをしていきましょう。

 

WordPress管理画面から、「外観」→「カスタマイズ」に移動しましょう。

 

各テキストとhタグ(見出し)」→「NEW ENTRY & 関連記事」にて同様に、文字色や背景色、ボーダーカラーなどの設定が行えますので、お好みに合わせて設定しましょう

 

 

 

まとめ:AFFINGER6で新着記事・関連記事エリアをカスタマイズする方法を解説

イラスト

 

以上、AFFINGER6における新着記事・関連記事エリアのカスタマイズ方法の解説でした。

 

実今回のポイントは以下の通り

  • 新着記事エリアのカスタマイズする方法

  • 関連記事エリアのカスタマイズする方法

 

新着記事や関連記事を表示されることで、読者の注目を集めることができユーザビリティの向上にもつながります

 

また、読んでもらった記事の関連情報を表示することで、ブログの滞在時間も伸びるので、ぜひ活用してみて下さい。

  • この記事を書いた人

ANZU

ブログで毎日コツコツ積み上げ|ITスキルとライフハックをアウトプット|プログラミングも独学中|より良い学びと習慣のノウハウを発信| 詳細はブログに掲載していきます。

-AFFINGER
-,