ページをスクロールすると表示される『トップへ戻る』ボタン。最近では実装するのが当たり前になっているようですね。
ページをどれだけ下にスクロールしても、いつでも好きなタイミングでページのトップに戻ることができるのですから、確かに便利なボタンです。
情報量の多いサイトには必須ともいえるでしょう。
【Simple Scroll to Top Button】は、トップへ戻るスクロールボタンを設置することのできるプラグイン。
ボタンの形状やサイズなどのデザインを変更することができます。
こんな場合にオススメ
- ページスクロールで『トップへ戻る』ボタンを表示したい
プラグインを使ってできること
- ページスクロールで表示される『トップへ戻る』ボタンを設置する
- ボタンの形状、サイズなどのデザインを変更することができる
目次
インストール
インストール方法
- ダッシュボード > プラグイン > 新規追加 とクリックする
- Simple Scroll to Top Buttonで検索する
- 今すぐインストールをクリック。インストール後有効化する
または、配布サイトからダウンロードして、インストール。
手動でインストールする方法はコチラ
トップへ戻るボタンの表示方法
プラグインを有効化すると、自動的にトップに戻るスクロールボタンがページの下部に表示されるようになります。
【Simple Scroll to Top Button】の設定
STEP
Scroll to Topを開く
プラグインを有効化すると、管理画面 > 設定 内に『Scroll to Top』が表示されるので、そこから設定を行います。
STEP
項目の設定
Button
| Symbol | スクロールボタンのシンボルを選択 |
|---|---|
| Background shape | スクロールボタンの形を選択 |
| Symbol color | シンボルの色を選択 |
| Background color | スクロールボタンの色を選択 |
| Button size | スクロールボタンのサイズを指定 |
Effects・Autoload
| Transparency | スクロールボタンを透過させるかの選択 |
|---|---|
| Scroll duration | スクロール速度の指定 （数値が大きいほどゆっくりスクロールされる） |
| Display button on | スクロールボタンを表示するページを選択 Every frontend page：すべてのページで表示 Home Page Only：ホームページ（トップページ）のみ表示 |
STEP
保存
項目を設定したらSave changesをクリックし、設定を保存します。
動作確認環境
- バージョン 4.44
- WordPress 5.7.2
このプラグインは上記の環境で動作を確認しましたが、ご使用の環境によっては、動作しないなどの不具合が起きる可能性がありますので、ご注意ください。
まとめ
- 【Simple Scroll to Top Button】は、トップへ戻るスクロールボタンを設置することのできるプラグイン。
- 簡単にボタンの形状やサイズなどのデザインを変更することができます。