AFFINGER6：トップページにタブ式カテゴリーを表示させる方法

下のようなタブ式カテゴリーを表示させる方法です。

タブ式カテゴリーを表示させる為の準備

タブ式カテゴリーを表示させるには「カテゴリー」を作成しておく必要があります。

まだ「カテゴリー」を作成していな方はまず「カテゴリー」を２つ程度作成しましょう。

※　タブ式カテゴリ一を表示させるにはカテゴリIDを２つ以上設定する必要があります。

カテゴリーの作成については別記事で説明していますのでそちらを参考にしてみてください。

こちらの記事もチェック！

トップページにタブ式カテゴリーを表示させる方法

トップページにタブ式カテゴリーを表示させるのはとても簡単です。

まず「AFFINGER管理」→「トップページ」→「タブ式カテゴリ一覧」を選択します。

タブ式カテゴリ一覧の項目を設定して保存すれば「タブ式カテゴリー」を表示することができます。

タブ式カテゴリ一覧

A：表示設定と表示させるカテゴリーの設定

B：タブの背景色と文字色の設定

C：タブデザインの設定

D：表示記事数や表示順の設定

E：最新記事一覧タブ名

A：表示設定と表示させるカテゴリーの設定

「タブ式カテゴリ一覧をフロントページに表示する」にチェックを入れます。

カテゴリー入力欄に表示させたいカテゴリIDを入力します。

カテゴリIDは「投稿」→「カテゴリ」で確認することができます。

B：タブの背景色と文字色の設定

タブの背景色と文字色の設定ができます。

タブの背景色を変更するとこんな感じです。

C：タブデザインの設定

タブのデザインは５種類から選択できます。

• デフォルト
• 角丸にする
• スクエアにする
• ボーダーにする
• タブ（シンプル）にする

デフォルト

デフォルトの実際表示はこんな感じです。

角丸にする

角丸の実際表示はこんな感じです。

スクエアにする

スクエアの実際表示はこんな感じです。

デフォルトと変化がわかりませんでした。

ボーダーにする

ボーダーの実際表示はこんな感じです。

タブ（シンプル）にする

タブ（シンプル）の実際表示はこんな感じです。

D：表示記事数や表示順の設定

表示記事数や表示する順番の設定が可能です。

※「無限ループにする」はEX（上位版）限定の機能になります。

E：最新記事一覧タブ名

最新記事一覧のタブを設定できます。

設定するにはカテゴリAの入力欄を空欄にします。

最新記事一覧タブ名の入力欄に表示させたい文字列を入力します。

「NEW」や「最新記事」などと入力するのがいいと思います。

最新記事一覧タブを設定した実際表示はこんな感じです。

以上がトップページにタブ式カテゴリーを表示させる方法になります。

設定は「Save」ボタンをクリックして保存しないと反映されないので、忘れずに保存をしてください。

ブログの記事を書くのにAIライティングツールを利用すると効率を上げることができます。

現在は多くのAIライティングツールがあります。

そのほとんどが無料お試しでの利用が可能です。

お試し期間が限定のツールもありますが、中には機能制限はありますがずっと無料で利用できるツールもあります。

無料お試しがずっと可能なAIライティングツールをまとめてみたので、是非試してみてください。

\\ 無料お試し利用がずっと可能なAIライティングツール//

AFFINGER6：記事一覧

• AFFINGER6で出来ること【まとめ】-AFFINGER6を徹底解説
• （通常版）AFFINGER6と（上位版）AFFINGER6 EXの違い【まとめ】
• AFFINGER6を実際に利用したガチ評価-２年以上愛用して感じたメリットとデメリット
• AFFINGER6は初心者が購入しても大丈夫？-初心者にお勧めの理由

AFFINGER6の購入とインストール方法

• AFFINGER6の購入方法と購入プランの選び方
• AFFINGER6（アフィンガー6）のインストール方法-初心者でも安心！購入プランから徹底解説！
• AFFINGER６（アフィンガー６）EX版の購入とアップグレードの方法

AFFINGER6の設定関係

• AFFINGER6導入後にまず何をしたらいいの？-初心者にお勧めの初期設定４項目
• AFFINGER6（アフィンガー６）にお勧めのプラグイン【初心者向け】
• AFFINGER６のアップデート方法（２パターンを解説）
• AFFINGER６（アフィンガー６）でGoogleアナリティクスを導入する方法
• AFFINGER6：Googleサーチコンソールへの登録方法
• AFFINGER6のステマ規制対策-広告表記を表示させる方法

AFFINGER6の使い方

• AFFINGER6の使い方【まとめ】-初心者向けガイド-

AFFINGER6のデザインカスタマイズ

• AFFINGER6のカスタマイズ方法-初心者向けガイド-