PRこの記事には商品プロモーションを含む場合があります。

PROGRAMING

【AFFINGER5】 サイドバー「おすすめ記事一覧」をスクロール対応させる方法

引用元:Web illustrations by Storyset

Taka
みなさん、こんにちわ!Takaです。

ブログを運営している人の中には、

ブログに『スクロールに追従するサイドバー』を付けたい!
けどやり方がわからない…

と思っている方も少なくないと思います。

実は、テーマにAffinger5を使用している場合は、簡単に『スクロールに追従するサイドバー』を作成できるんです( ̄▽ ̄)
本記事では、ブログにスクロール対応のサイドバーを付ける方法を解説していきます。

「おすすめ記事一覧」をスクロール対応させる方法

以下が作業の流れです。

まず、作業完了後にどのようになっているかのイメージをのせておきます。

<作業完了後のイメージ>

Taka
本記事の作業が完了したら、こんな感じ(👆)になります。

では初めて行きましょう( ´∀` )

おすすめ一覧の追加

まずはWordPressにログインします。


上記のような画面が表示されるので次の手順に従って設定していきましょう。

  1. 左側メニューから「AFFINGER5 管理 ⇒ AFFINGER5 管理」を選択。
  2. 管理画面が表示されるので、メニューの「おすすめ記事一覧」を選択
  3. 「おすすめ記事一覧の作成」項目で表示する文字を入力
  4. 人気の記事を指定
    ※記事の指定では投稿一覧画面の「ID」番号を指定します。
  5. 「サイドのスクロールに表示する(抜粋非表示)」にチェック
  6. 「保存」ボタンをクリック

ここまで完了したら、実際にサイトを表示してみましょう。

サイドメニューに「おすすめ記事一覧」が表示され、スクロールに追従してくる場合はこれで完了となります。

ここまでの作業が完了けど、思い通りの動作をしない場合は次の手順に移ります。

不要な設定の無効化

サイドメニューの「おすすめ記事一覧」がスクロール対応しない場合は、Affinger5の不要な設定が適用されている可能性があります。

「AFFINGER5 管理 ⇒ AFFINGER5 管理 ⇒ その他」を選択し、次の画面を表示します。

「PC閲覧時にサイドバーの最下部広告エリアをスクロール追尾しない」のチェックを外して「保存」ボタンをクリックします。

以上で、終了となります。お疲れさまでした。

-PROGRAMING

Copyright© タカログ , 2023 All Rights Reserved Powered by AFFINGER5.