Webの記録

WordPress プラグイン「Dynamic To Top」で上に戻るボタンを簡単に設置♪

投稿日:

この記事は約 3 分で読めます。

よくいろんなサイトを閲覧していて、ページの下へスクロールしていくと・・・「上に戻る」ボタンを見かけます。

そこで今回は、Wordpressのプラグイン「Dynamic To Top」を使ってみることにしました。

特徴

  • ソースコードをいじる事なく、簡単に設置が出来る
  • 色、カタチ、設置位置、動きなどを自由に設定画面でカスタマイズが出来る
  • 投稿・固定・個別ページでの表示が可能。(home.phpでは表示が出ませんでした)

設置方法

プラグインサイトより、「Dynamic To Top」をインストールし、有効化にする。

ダッシュボードの左側のメニュー「外観」から、「To Top」を選択すると、設定画面が出てきます。


 

設定画面でお好みに設定します。最後に「Save Changes」で保存。設定完了です!

設定画面の説明
  1. Scroll time:スクロールアップのタイムの設定
  2. Fade-in distance:トップからボタンが表示されるまでの距離。pxで設定
  3. Easing:ボタンをクリックした時の動き方
  4. Position:ボタンの位置
  5. Prevent on mobile:モバイルサイトで無効にする時は「Yes」にチェック。<br/>
    ※「Preview over black, grey or white.」:プレビュー用のボタンの背景を黒・グレー・白になる
  6. Text version:ボタンにテキストを入れたい場合は「Yes」にチェック
  7. Button text:表示させたいテキストを入力
  8. Top/bottom padding:ボタンの縦幅の調整
  9. Sides padding:ボタンの横幅の調整
  10. Font size:フォントサイズ
  11. Text color:テキストの色
  12. Bold Text:テキストを太字にする時は「Yes」にチェック
  13. Text shadow:テキストに影を付ける時は「Yes」にチェック
  14. Text shadow color:テキストの影の色
  15. Background color:ボタンの色
  16. Border color:ボタンのボーダー色
  17. Border width:ボタンのボーダー幅
  18. Border radius:ボタンの角丸設定
  19. Inset highlighting:ボタンのハイライト
  20. Shadow:ボタンの影

-Webの記録
-,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

This blog is kept spam free by WP-SpamFree.

関連記事

WordPress 「Contact Form7」でエラーメッセージが出たときに確認したこと

この記事は約 1 分で読めます。 「Contact Form7 4.4」をバージョンアップした途端、エラーメッセージが出るようになりました。 エラーメッセージが出たことで、再度設定を見直すキッカケがで …

no image

日本語文章校正ツールを使ってみた。

この記事は約 1 分で読めます。 今回は、Yahoo!Japan校正支援Webサービスを利用した校正支援ツールを試してみました。 誰かに伝える文章を書く時に使えそうな、Webツール「日本語文章校正ツー …

no image

「WordPress Popular Posts Stats」で人気記事を表示させてみた♪

この記事は約 1 分で読めます。 WordPressのプラグイン「Wordpress Popular Posts Stats」を使って、自分のサイトでよく読まれている人気記事を表示させてみることにしま …

no image

WordPressのオベンキョウ①

WordPressで、自分のサイトを作る事にしました。

モバイル フレンドリー テストで合格しているのに、「スマホ対応」ラベルが付かない時

この記事は約 1 分で読めます。 スマホで検索していると「スマホ対応」と表示されるようになって、しばらく経ちました。 検索している時の順位も、「スマホ対応」と表示されてないページより、表示されているペ …