Simplicityで「トップに戻るボタン」を簡単に変更する方法

スクリーンショット 2016-10-02 14.55.42

こんにちは。部長ナビ(@nabi_1080)です

さて、当ブログはナイスなWordPressテーマ「Simplicity」を使いまくって早1年となるわけですが、やはり、いつでも「読者ファースト」の運営を心がけたいモノですね

スポンサーリンク

デザインももちろん重要だが、僕が最近気になっていたのは「トップに戻るボタン」が小さくないか?と言うこと

ええ。小さいと思います

特にモバイル。横幅が狭い、縦長のボタンなので、ちょっと小さいですよね

それで、調べてみたら、かなり簡単に変更できたので紹介します

まず、デザインを選ぶ

Font Awesome Icons
Font Awesome, the iconic font and CSS framework

まずは、このサイトの「Directional Icons」から、好きなのを選びます

スクリーンショット 2016-10-02 14.49.01

↑この中から選びましょう!

僕は上矢印を選びましたが、何でも良いです

スクリーンショット 2016-10-02 14.57.00

クリックすると、こんなの出るので、「fa-arrow-circle-up」の部分をコピーします

Simplicityの管理画面→ダッシュボード→サイトをカスタマイズ→全体・リストの下の方

スクリーンショット 2016-10-02 14.49.25

こんなのあるので、「トップへ戻るボタンのアイコン」の所をさっきコピーしたヤツを貼り付けて保存します。コレで終了。あっという間

どうなったか

スクリーンショット 2016-10-02 14.49.42

↑こうなった

右下のボタンがそうですね

大きさが大きくなって、SO NICE

モバイルも確認しましたが、横幅が増えたので、押しやすくなりました!

簡単なので、ぜひやってみてねー

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

この記事の関連カテゴリ

サイト内検索