AFFINGER6を使っているなら
簡単にお洒落に決めよう!
お洒落×閲覧率UP
今回はカスタマイズ性が高い
AFFINGER6で簡単に設置できる
- サイドバーにオススメ『人気記事』
- トップに設置『タブ式カテゴリー』
こちらの設置方法を公開していきます。
![とら](https://torari-man.com/wp-content/uploads/2021/08/34111d1506edb6066ed79a9caaeef6f0.jpg)
![みけ](https://torari-man.com/wp-content/uploads/2021/08/756fc446520d5eb638d898eec659df7d.jpg)
\ 当ブログ使用テーマ /
パッと目を引く!
人気記事とタブ式カテゴリー
![](https://torari-man.com/wp-content/uploads/2021/10/74467e3e7147b764880b7994bb09d4d9.jpg)
人気記事
×
タブ式カテゴリー
最大の魅力として、
訪問者へ視覚で訴えられることです。
そして、見て欲しい記事をアピールできます。
- 読者がパッと見て他の記事が分かる
=複数の記事に興味を持ってもらう - 設定で特定の記事をアピールできる
=見て欲しい記事の閲覧率上昇 - サイトがお洒落に見える
=独自性が増しファンが増える
AFFINGER6なら
設定箇所と内容が
分かれば簡単にできる!
![とら](https://torari-man.com/wp-content/uploads/2021/08/310bff3919b9b85eadb0666a802e3009.jpg)
人気記事ってどんなやつ?
![](https://torari-man.com/wp-content/uploads/2021/10/7221d1acf2ae6962b065e56fc8962d41.jpg)
人気記事は
『おすすめ記事』です。
良く勘違いされやすいですが、
PVが増えて自動で並び替え
されるような機能ではありません。
読者にアピールしたい記事一覧です。
本サイトの
サイドバーにも表示させています。
![](https://torari-man.com/wp-content/uploads/2021/10/037b1a80e81e3ab37562c393a8f78d80.jpg)
ちなみにPCとスマホでは
表示箇所が異なります。
スマホの場合
![](https://torari-man.com/wp-content/uploads/2021/10/e36642fa468fe667a470376074d498bc.jpg)
スマホの場合はサイトの
下部へ画面いっぱいに表示される。
![みけ](https://torari-man.com/wp-content/uploads/2021/08/7fe72ce43e1f9e581f62b6c9f983155a.jpg)
![とら](https://torari-man.com/wp-content/uploads/2021/08/310bff3919b9b85eadb0666a802e3009.jpg)
スマホでの表示有無設定可能
サイドバーの表示設定で
表示箇所の調整を行えます。
設定方法によりますが、
サイドバーは次のような特性です。
- パソコンはサイドに表示
- スマホのサイドバーは
サイトの下部に追加挿入
そのため、サイドバーに情報を増やすと
スマホでは下に長いサイトになります。
サイドバーに乗せている情報が
スマホの人にも見てもらいたいか?
よく考えて表示の有無を設定しましょう。
スマホの来訪者の方が
圧倒的に多いです
私は多くの人に
記事を見てもらいたいので、
サイドバーの表示をONにしています。
パソコンでは追尾設定が重要
パソコンのサイドバーには
追尾設定が行えます。
追尾設定とは、
記事を読むためにスクロールする際、
追尾してサイドに表示固定する設定です。
設定で外すこともできますが、
ページの下部ではサイドバーが空白になります。
基本的には追尾設定をONにしましょう。
![とら](https://torari-man.com/wp-content/uploads/2021/08/34111d1506edb6066ed79a9caaeef6f0.jpg)
確認方法も教えます♪
タブ式カテゴリーって?
![](https://torari-man.com/wp-content/uploads/2021/10/c39c8ff87542e3c7b37c1118eaa43b59.jpg)
タブ式カテゴリーとは
カテゴリーの表示を
簡易切替できる便利機能
タブ式の設定をすると、
クリックで各カテゴリーの
記事が簡単に表示されます。
わざわざカテゴリーごとの
URLに飛ぶ必要はありません。
本サイトでも採用しています。
![](https://torari-man.com/wp-content/uploads/2021/10/c8b3c8d0ec36ba7312e0a9c27e99ec74.jpg)
魅力としては
視覚的に訴え
簡単に切り替えができる
一般的なカテゴリーだと、
クリックして別ページに飛んで、
カテゴリー内の記事一覧が見えます。
タブ式だと手軽に切り替えて見れる。
![みけ](https://torari-man.com/wp-content/uploads/2021/08/756fc446520d5eb638d898eec659df7d.jpg)
![とら](https://torari-man.com/wp-content/uploads/2021/08/34111d1506edb6066ed79a9caaeef6f0.jpg)
他の記事にも興味が湧く!
人気記事を設定しよう!
![](https://torari-man.com/wp-content/uploads/2021/10/05c1b4cfb1d19e689e8cd47c48afb15f-1.jpg)
それでは早速
人気記事を設定していこう!
基本設定
AFFINFER管理から
「ヘッダー下/おすすめ」を選択。
おすすめ記事一覧まで進みましょう。
![](https://torari-man.com/wp-content/uploads/2021/10/05c1b4cfb1d19e689e8cd47c48afb15f.jpg)
- おすすめ記事一覧に表示する文字
⇒題名。デフォルトは人気記事 - 任意の人気記事を指定
⇒左から順に記事IDを記載 - サイドのスクロールに表示
⇒チェックして表示しましょう! - その他の各表示箇所
⇒サイドに表示しているので、不要
これでサイドバーに
任意の記事を表示できます。
![](https://torari-man.com/wp-content/uploads/2021/10/648a27f944bd85031fff5b701b0c3085.jpg)
重要ポイント
- 記事IDは
投稿一覧より確認 - 設定記事は
左から3番目までが重要 - 追尾スクロールは
左から3番目迄が固定表示
読者へのアピールは
1~3番目の記事が効果的!
![みけ](https://torari-man.com/wp-content/uploads/2021/08/c0fa1c221f7a72f7439350af2d5a2418.jpg)
サイドバー表示の有無設定
AFFINGER管理から
「全体設定」を選択。
サイト全体のレイアウトへ進みます
![](https://torari-man.com/wp-content/uploads/2021/10/ae49af6e3da44ae2114eeff0a2c2b9c8.jpg)
- スマホのサイドバーを非表示
⇒レ点を外すことで表示される
※ページ下部へ追加挿入
これはお好みで設定しましょう。
私はスマホでも表示設定しています。
表示させている理由は
- スマホでも閲覧率を上げたい
- 別の記事からのPV増加を見込む
- サイドにアドセンス広告を入れてる
- サイトスピードはほぼ影響なし
このような感じです。
ご自身のサイドバー情報量によりますが、
シンプルにしたければ非表示も有りです。
閲覧確率を上げるなら
表示することを推奨します。
追尾スクロールの確認
AFFINGER管理から
「その他」を選択。
![](https://torari-man.com/wp-content/uploads/2021/10/3f44d5aba8c1cdc5ce558214810b8c82.jpg)
- PC閲覧時にスクロール追尾しない
⇒レ点チェックを外す
初期設定では
上記設定になっているはずです。
仮に追尾されていない場合には、
ページ下部にいくとサイドバー部分が
空白の状態となり、意味がなくなります。
また、追尾固定される際には
上位3番目までが追尾表示されます。
実際に設定して見てみましょう!
![とら](https://torari-man.com/wp-content/uploads/2021/08/310bff3919b9b85eadb0666a802e3009.jpg)
タブ式カテゴリーの設定
![](https://torari-man.com/wp-content/uploads/2021/10/59ac79a5e0e10ff6928d8dd0fd77b3e6.jpg)
訪問者に記事を知ってもらうために
タブ式カテゴリーを設定しましょう!
①基本設定
AFFINGER管理から
「トップページ」を選択
タブ式カテゴリー覧に進もう。
![](https://torari-man.com/wp-content/uploads/2021/10/950ad9c0ee0440633af1065639bb6a3e.jpg)
- タブ式カテゴリーをフロントに表示
⇒レ点チェック - カテゴリーA~Dを設定する
⇒カテゴリーIDを入力 - タブA~Dを設定する
⇒好みのタブ色を選択 - タブの種類を選択
⇒お好み。私は「角丸」 - 表示記事数を選択
⇒4~6記事程度がオススメ
これでトップに
タブ式カテゴリーが表示されます。
![](https://torari-man.com/wp-content/uploads/2021/10/cac82937739a0a4f4a7c5a59b0b10e2f.jpg)
ワンポイントアドバイス
カテゴリーAが最初に表示されます。
一番のアピールカテゴリーを設定しよう!
カテゴリーIDの調べ方
各カテゴリーIDは
WordPress画面で簡単に確認できます。
投稿より
「カテゴリー」を選択
![](https://torari-man.com/wp-content/uploads/2021/10/af97a7c6cd014bc15ffbf6c98f1f1087.jpg)
カテゴリー名の右側に表示されています。
タブ式カテゴリーを設定する際は
こちらのカテゴリーIDを使用します。
![みけ](https://torari-man.com/wp-content/uploads/2021/08/c0fa1c221f7a72f7439350af2d5a2418.jpg)
視覚的に攻める!
人気記事とタブ式カテゴリー
![](https://torari-man.com/wp-content/uploads/2021/10/efe065cfb391fda737a2502a59a34c7c.jpg)
人気記事
×
タブ式カテゴリー
- 視覚的に記事をアピール!
- 視覚で訴えて興味をひく
- お洒落にサイトカスタマイズ
- 人気記事は『おすすめ記事』
積極的にアピールしよう - 追尾機能を有効活用
3番目迄の記事が認知度UP - タブ式カテゴリーで
各記事のアピールできる
せっかく訪問してもらった読者。
どうせなら
別記事もアピールしたい!
そんな時は
- 人気記事設定
- タブ式カテゴリー設定
この2つで
さりげなくも積極的にアピール!
AFFINGER6で簡単に設定できました。
興味の持たれる可能性を
1%でも上げていこう!
![とら](https://torari-man.com/wp-content/uploads/2021/08/310bff3919b9b85eadb0666a802e3009.jpg)
記事のPVが増えた!