ki-hi-ro.com WEB制作フリーランスエンジニア
  • Service
    • WEBサイトの更新サポート
    • 新規サイトコーディング
  • Introduce
    • メッセージ
    • 自宅兼事務所
    • Twitter
  • Blog
    • 技術ブログ
    • 学習ブログ
    • 雑記ブログ
  • Others
    • スケジュールのお知らせ
    • お問い合わせ
    • WEBに関する無料相談
  • Top
  • Service
  • Introduce
  • Blog
  • Contact

Easy Table of Contentsでスクロールの高さを調整するには?

先ほど、ブログページの目次をクリックした時に、ヘッダーの高さを考慮してスクロールの高さを調整しました。

どうやって調整したのかについて書いていきます。

目次には、WordPressのプラグイン「Easy Table of Contents」を使用しました。

手順1: 設定画面に移動する

まずは、設定 > 目次をクリックして、プラグイン設定画面に移動します。

設定 > 目次

WordPress管理画面のサイドバーです。

プラグイン設定画面

WordPress管理画面のメイン画面です。

手順2

下の方にスクロールしていき以下2点の値を調整します。

  • スムーズスクロールのオフセット
  • モバイルのスムーズスクロールのオフセット

スムーズスクロールのオフセット

例えば「スムーズスクロールのオフセット」を200pxに設定した場合、目次のタイトルをクリックした時にPCで目次の位置よりも200px上にスクロールされます。

モバイルのスムーズスクロールのオフセット

「モバイルのスムーズスクロールのオフセット」はスマホのスクロール位置を調整する時に使用します。

関連記事

2022.04.30 WordPress 記事内リンクを別タブで開くようにする方法
2022.03.25 WordPress カスタムフィールドの出力方法
2022.03.25 WordPress 出力する記事を指定する

サービス一覧

  • WEBサイトの更新サポート
  • 新規サイトコーディング

自己紹介

  • メッセージ
  • 自宅兼事務所
  • Twitter

ブログ

  • 技術ブログ
  • 学習ブログ
  • 雑記ブログ

その他

  • スケジュールのお知らせ
  • お問い合わせ