僕トク的なアレ

My Tips is here.

はてなブログにJ-Queryを導入する方法。

面右下にTOPに戻るボタンを実装しました。

J-Queryを使用可能にするためには、HTML内に下記のソースコードの記述が必要です。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>


これは、Google先生が僕達みたいな、迷える子羊のため用意してくれたJavascriptファイルで、
自分でファイルを用意しなくても、このリンクを貼り付けるだけでJ-Queryが使えるようになります。


、肝心のソースコードを貼る場所ですが。

bodyの閉じタグ直前に置きましょう。

これには理由があって、通常コードを上から順番に読み込みます。
scriptタグをbodyタグ内の最後に記述する事によって、HTMLとCSS(WEBサイトの中身)
を優先的にブラウザで表示させる事ができ、ユーザーの閲覧の体感速度が上がります。

要は、このサイト軽いなー!って思ってもらえるということです。
(実際の量は変わっていない。)




てなブログの場合は、
管理画面のデザイン編集欄から、フッタにソースコードを追加する箇所に上記のコードをコピペすれば
J-Queryを使う用意は完了です。


f:id:Rnmtsu:20141225151656j:plain

クリックして

f:id:Rnmtsu:20141225151852j:plain

こんな感じにコピペして完了です!





せっかくJ-Queryを導入記事を書いたので、J-Queryでゴリゴリでブログをカスタマイズしていく記事でも作ろうかな。。。