【超簡単】ページの先頭に戻るボタンを設置する!

私のブログ記事は割合と長い(テープ起こし記事は、自分で書いててもウンザリするほど長い)ので、「クリック一発でページの先頭に飛べるボタンがあれば便利だなぁ」とは思っていた。私はその昔、HTMLをテキストエディタでシコシコ書いてはFTPしてサイトを作っていた石器時代の人なので、やろうと思えば簡単サ!‘`,、(‘∀`) ‘`,、
って、やっぱりプラグインで簡単かよ!( ゚д゚ )クワッ!!

WPFront Scroll Topプラグインをインストールする

そのものズバリ!過ぎるプラグインなので、あまつさえ自力で実装を考えていた自分が恥ずかしくなるほどだが、いつものようにお手軽にインストールして使ってみよう。
WordPressにログインし、「プラグイン」→「新規追加」とクリックする。

図のように「キーワード」に「WPfront Scroll Top」と入力すると「WPfront Scroll Top」が検索結果に表示されるので、「今すぐインストール」ボタンをクリックする。インストールしたら「有効化」も忘れずに。

設定は3箇所だけ

WordPressなだけに、たかだかページの先頭に戻るだけのボタンにしても、色々とプラグインが存在する(逆に言えば、こんな単機能なプラグインですら悩むほどある)。
私がWPFront Scroll Topプラグインをチョイスしたのは、矢印アイコンが豊富(73種類)なのと、複雑な設定が可能なクセに簡単な点である。また、オリジナルの矢印アイコンを設定可能なのもポイントが高い。やはり、自分のブログぐらいオリジナリティを追求したいものだ。とは言え、機能としては必要だが、それほど凝る必要はないと思うのも人情だ。
とりあえず「設定」→「Scroll Top」をクリックし、簡単・便利に使いたい人は次の3つの設定だけすれば良い。

チェック(有効)
チェック(有効)JavaScriptで機能しており、非同期で読み込むので動作が速くなる

どれでも好きなボタンを選べば良い

「変更を保存」ボタンをクリックすれば、たちどころに「ページの先頭に戻るボタン」が表示されるハズである。

オリジナルなボタンを作るぜぇ!

と言っても、ゼロから作るほどヒマでもなければ絵心もないし。が、73種類あるボタンの中で「コレだ!」というモノもない。でも機能としてはすぐに欲しいジレンマ(笑)。
私は利用しなかったが、次のサイトはオリジナルボタンの参考に良いかも知れない。

結局私はスマホユーザのことも考え(PCでは小さいと思ってもスマホでは意外に大きく表示される)、次のアイコンを改造することにした。

改造は大げさだが、フォトレタッチソフトを使って私のサイトカラーに変更しただけなんだが。で、カスタムURLなどと面倒な設定がイヤだったので、WPFront Scroll Topプラグインのボタンが入っているサーバディレクトリ(./wp-content/plugins/wpfront-scroll-top/images/icons)に改造した(?)ボタンアイコンのファイルをFTPし、あたかもオリジナルなボタンのフリをして設定している。

※FTPが出来ない人はメディアライブラリにボタン(アイコン)画像を保存し、そのURLを取得して設定画面で「カスタムURL」に設定する必要がある

おわりに

本当に単機能かつ下らないのだが、このボタンがあるのと無いのとでは操作の利便性が段違いになるのでバカに出来ない。思えばWindows98の頃からマイクロソフト社製マウスにホイールなるモノが生えて普及し始めたが、その前は(ry
PCユーザに限らず特にスマホユーザや、マウスを使わないタブレットユーザにも等しく便利なボタンであろうことは間違いない。
・・・つくづく思うが、WordPressはこんな機能までがプラグイン実装なので、改めて驚く(意外過ぎて私には盲点だった)。日本人的感性ならば標準搭載機能だと思うが、欧米人的発想はこんな機能までもがオプションであり、かつ(良いように捉えれば)プラグインとして拡張可能でオリジナリティが出せると言える。私からしたらどうでも良いんだけど、無視出来ない的な(苦笑)。

 

 

この記事が気に入ったら
いいね ! をお願いします


ITで何かお手伝い出来ることはありませんか?

CTA-IMAGE

本サイトでは、外部サービスと連携して「ITの困った」を解決します!

WordPressカテゴリの最新記事