以前、
ユーザビリティを考慮すると
個別記事の下部両サイドに、
スポンサーリンク
前後記事のタイトル表示をした方がいいのではないか
こんな感じに表示されるようになります。
そして、
その後GoogleDriveを使っての、
CSSファイルの外部化という記事も投稿しました。
≫Bloggerブログ CSS外部化する方法。ページ表示速度を高速化
https://googledrive.com/host/**************/ ...
同じように、
GoogleDriveでJavascriptファイルも共有設定にて、
外部からの読み込みが可能なので、
今度は、
当ブログにて使用している一部の、
.jsファイルも同じ
Googleのサービスで統一する為に、
- GoogleDriveにて設定した方が良いだろうという事、
- GoogleDriveの方が読み込みが速いということもあり、
CSSファイルの外部化と同様に、
JavascriptファイルもGoogleDriveにて設定しました。
その結果、
ページ表示速度が、
さらに約5~10%程度速くなりました。
『やり方』
基本的には、
以下(上記)URLの時と同様なのですが、
まずは、
以下URL内にリンクされている
blinker.jsファイルを
ローカルにダウンロードします。
そしたら、
CSSファイルの外部化の時と同様に、
ローカルに保存したblinker.jsファイルを、
GoogleDriveにアップロードし共有設定を変更します。
≫Bloggerブログ CSS外部化する方法。ページ表示速度を高速化
https://googledrive.com/host/**************/ ...
そして、
blinker.jsファイルをアップロードした際、
共有設定にした時に表示されたURLをコピーしておきます。
こんな感じのURLになります。
https://docs.google.com/file/d/***********************/edit?usp=sharing
この中で重要な部分は、
紫色の部分です。
そして、
GoogleDriveでのURL
https://googledrive.com/host/***********************/
の同じく紫色部分に、
上記共有設定した際の
https://docs.google.com/file/d/***********************/edit?usp=sharing
の紫色部分を、
https://googledrive.com/host/***********************/
の紫色の部分に記載します。
具体的には、
以下の様になります。
https://googledrive.com/host/0ByGfTGP3BREvZERaSzhLZkVqNXc/
そして、
テンプレートのHTML編集にて、
header内に、
以下の様に記述します。
<script src="https://googledrive.com/host/0ByGfTGP3BREvZERaSzhLZkVqNXc/"></script>
以上で、
Javascriptファイルの外部化ができます。
ページャ部分の、
HTMLの"a"要素には、
すでに、
以前のHTML編集にて、
"blinker"クラスを追加し、bLinkerをロードするコードを追加
してあるので、
そちらはいじる必要はないです。
コメント