ワードプレスブログのトップへ戻るボタンをカスタマイズする方法

サイトを下の方にスクロールして行くと、右下に現れる「トップへ戻るボタン」。
押すとぴゅーっとトップに戻るので便利ですよね。
Minimal WPのテーマには全て最初から装備されているのですが、
これをオリジナルのアイコンに変更したい時のカスタマイズ方法をご紹介します。

トップへ戻るボタンをカスタマイズする方法

まずはワードプレステーマの中のjsフォルダの中に入ってる、
「scrolltopcontrol.js」というファイルを開きます。
12行目の以下のところが表示されるボタンの部分です。

controlHTML: ‘＜span style=”color:#CCC;font-size:28px”＞↑＜/span＞’,

デフォルトでは一番シンプルに矢印のテキストになってますが、

↑

ここはhtmlも使えるので、好きな矢印ボタン画像にしたりも簡単に出来ます。
「’」と「’」の間に直接htmlで指定するだけです。

controlHTML: ‘＜img src=”http://exsample.com/wp-content/uploads/up.gif”＞’,

例えばこんな感じに、アップロードした矢印画像のURLを指定します。

そうすると指定した画像が表示されるようになります。
以上！スーパー簡単ですね！

＊「＜」と「＞」は半角でね！

★