こんにちは "osaboo"
です。"@osaboo_Bot"
AFFINGER6の「タブ式カテゴリー記事一覧をトップページに設置する方法」を初心者さん向けに解説します。
＼初心者でも安心！コスパ最強の洗練されたWordPressテーマ／
＼＼『すごいもくじLITE』が付いてくる！限定特典キャンペーン実施中！／／
- 少しづつ増え続ける当サイトオリジナル特典付！-
タブ式カテゴリー記事一覧とは？
タブ式カテゴリー記事一覧とは、トップページ専用のカスタマイズ機能です。最高4つのタブにカテゴリーごとの記事一覧をまとめることができます。タブを切り替えると 各カテゴリーの記事一覧が表示されます。
コンテンツの領域を節約でき、多くの記事を表示できるようにます。
当サイトのトップページでも採用しています。
こんな感じです。
タブ式カテゴリー記事一覧の設置手順
この章では、タブ式カテゴリー記事一覧の設置手順をご紹介します。
『AFFINGER 管理』画面での作業になります。
まず、AFFINGER 管理画面を開きます。
AFFINGER 管理画面が表示されます。
左側のタブメニューから『トップページ』タブをクリックします。
「トップページの設定」の画面が表示されます。
- 右上の『タブ式カテゴリー記事一覧』をクリックします。（自動スクロール）
- 下側にスクロールします。（手動スクロール）
❶または❷どちらかで詳細設定箇所に移動します。
「タブ式カテゴリー記事一覧」以下の画面が表示されたら、詳細設定を始めます。
タブ式カテゴリー記事一覧の詳細設定
前章でご紹介した設定箇所をクローズアップして各項目の詳細をご紹介します。
タブ式カテゴリー記事一覧の詳細設定：以下の画面です。
それでは、詳細設定を順番にしていきましょう。
タブ式カテゴリー記事一覧をフロントページに表示する
タブ式 カテゴリー記事一覧をフロントページに表示するにチェックを入れます。
※ チェックの『ON/OFF』で簡単に表示非表示が選択できます。
表示するカテゴリーを入力する
前述しましたが、タブ式カテゴリー記事一覧は最大4個のタブが表示できます。
カテゴリー「A B C D」に表示させていカテゴリーの『ID』を入力します。
※ 最新記事一覧の設定は STEP08 をご覧ください。
カテゴリーIDの確認手順は以下の通りです。
カテゴリーページが表示されます。
カテゴリーIDを確認して、表示する カテゴリーIDの番号を控えます。
このサンプルでは『4・5・6・7』です。
表示するタブの背景色を設定する
タブ「A B C D」の背景色は個別に設定できます。文字色は1種類で共通です。
背景色の選択にご活用ください。
タブのスタイルを設定する
タブのスタイルは『デフォルト/角丸/スクエア/ボーダー/タブ（シンプル）』から選択できます。
タブの表示：5種類のスタイルが選べます。
タブのスタイル設定：デフォルト
※ ふきだしの角を丸めない形状で表示されます。
タブのスタイル設定：角丸にする
※ ふきだしの角を丸めた形状で表示されます。
タブのスタイル設定：スクエアにする
※ 四角の形状で表示されます。
タブのスタイル設定：ボーダーにする
※ タブを切り替えるとボーダが背景色で表示されます。
タブのスタイル設定：タブ（シンプル）にする
※ 背景色は反映されません。
表示記事数を入力する
タブことに表示する記事の数を入力します。
表示記事は以下のように表示されます。
表示記事数『5』とした場合 以下のように表示されます。
表示記事数『3』とした場合 以下のように表示されます。
表示記事の並び順と除外設定をする
表示する順序と条件を選択します。
無限ループにする
無限ループにする：表示記事の下に『もっと見る＞』ボタンが表示され クリックで記事（次ページ）が追加表示されます。
表示記事は以下のように表示されます。
表示記事の最下部に『もっと見る＞』ボタンが表示されます。
最新記事一覧の設定とタブ名を入力する
カテゴリーA B C D（ID）入力欄いずれかを『無記入』または『999999』と入力すると、最新記事一覧が表示できます。
カテゴリーの名前が表示されるタブの領域（最新記事一覧タブ名）に『任意の名称』がつけられます。
忘れずに！設定が完了したら最後に『Save』する
設定が全て完了したら最後に『Save』しましょう。
ロリポップをご利用の方は以下をご覧ください。
※ 本記事の設定では『AFFINGER管理』のメニューを編集します。
ロリポップレンタルサーバーをお使いの方は、ドメインの『WAFの設定』を一時的に無効 にしてください。
◀︎『403 Error』が出た場合。
-
-
AFFINGER6＆ロリポップ！レンタルサーバー『403 Error』が出た時の対処方法！
ロリポップ！レンタルサーバーを使用してAFFINGER6（ACTION)のヘッダー等の表示系をカスタマイズするとセーブ時に『403 Error』が表示されセーブできない！ こんな時はロリポップユーザー専用ページにログインしてWAFの設定を無効にするだけ！
＼初心者でも安心！コスパ最強の洗練されたWordPressテーマ／
＼＼『すごいもくじLITE』が付いてくる！限定特典キャンペーン実施中！／／
- 少しづつ増え続ける当サイトオリジナル特典付！-
まとめ！AFFINGER6 カスタマイズ【タブ式カテゴリー記事一覧をトップページに設置する方法！】
トップページを機能的にかつスッキリさせるカスタマイズ：タブ式カテゴリー記事一覧をトップページに設置する方法をご紹介しました。AFFINGER６の標準機能なので、時間をかけずに簡単にカスタマイズできます。
「トップページをチャチャっとカスタマイズしたい！」という方におすすめです！是非、試してみてかださい。^^;
「最後まで、ご観覧いただきありがとうございました。」
また、次の記事で…お会いしましょう。＼^^／
