「一番上に戻るボタン」付けてないブログ、やり方教えてやるから今すぐ付けろ。読みにくいんだよ【はてなカスタマイズ】

　ブログを始めてから色んなブログを読むようになったんですが、「一番上に戻るボタン」がついてないブログがあるんですよね。

f:id:kogawahayato:20170423133046j:plain

　これです。これ。こういうやつ。押すと上までギューンって戻るやつ。なんで付けないの？　何か意図があるの？　無いならつけてよね！　無いと読みにくいと思います。読みにくいよね？　1記事読み終わって、さて他にはどんな記事があるのかな、トップページに移動してみようと思ったら、ボタンが無い。マウスホイールをぐるぐるする必要がでてきます。それは面倒くさい。そういえばこのブログってなんていうブログだっけ？　とか思ってホイールぐるぐるさせるのはもうウンザリなんです！

日曜日に書いた記事がバズった(炎上した？)件についての反省会 - Travel Banana

付け方教えてやる
- コレとコレとコレをコピペするだけじゃ！
- 参考記事
まとめ
こんな記事も書いてます

付け方教えてやる

　なんで付けないの？　いやホントに。やり方知らないとか？　僕が教えるまでもなく検索すれば色々でてくるのに？　本当に意味がわかりません。僕の快適ブログライフのために、まだ付けていないはてなブロガーの皆さんは早急にこのボタンをつけてください。付けない理由があったら教えてください。

　あ、ワードプレスの人は割と簡単につけられるみたいなんでさっさと設定しちゃってください。はてなはちょっと面倒臭い感じなので説明します。

ブログアイコン作ったこととブログデザインにあんまり興味がない理由 - Travel Banana

コレとコレとコレをコピペするだけじゃ！

デザイン→ヘッダ→タイトル下

コレを"タイトル下"にコピペ

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">

<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>

フッター

コレを"フッター"にコピペ

<div id="page-top">

<a id="move-page-top"><i class="fa fa-chevron-circle-up fa-5x"></i></a>

</div>

<script>

$(window).scroll(function(){

var now = $(window).scrollTop();

if(now > 500){

$("#page-top").fadeIn("slow");

}else{

$("#page-top").fadeOut("slow");

}

});

$("#move-page-top").click(function(){

$("html,body").animate({scrollTop:0},"slow");

});

</script>

デザインCSS

コレを"デザインCSS"にコピペ

/*上に戻る*/

#page-top {

display:none;

position:fixed;

right:10px;

bottom:20px;

margin: 0;

padding: 0;

text-align:center;

}

#move-page-top{

color:rgba(0,0,0,0.4);

text-decoration:none;

display:block;

cursor:pointer;

}

#move-page-top:hover{

color:rgba(0,0,0,0.6);

}

@media only screen and (min-width: 400px){

#page-top{

right:35%;

margin-right: -450px;

}

}