スポンサーリンク

2013年11月15日金曜日

Zenback非同期コードをBloggerブログに貼る方法

新しい記事 以前の記事

平均20%+高速化!​Zenbackのスク​リプトコードが新しく​なりました。


とのメールタイトルで本日夕刻に、
メールを受信していました。


変わった内容としましては、


■ 変わったポイント
・もっと素早く ページ読込完了速度向上
・もっと優しく 非同期読み込みに対応

他にユーザの実測値など、

以下内容のようなものがZenbackブログには掲載されています。


■ 20%以上の速度向上?
 弊社での調査でも平均27%以上の速度UPが見られました。
ユーザ様がご検証いただいたデータでも28.2%、25.7%、20.9%と
軒並み動作速度が向上したとのご連絡を頂いています。
 皆さまのお手元でも簡単にビフォーアフターの速度検証できますので、
ぜひお試しください。
そしてソーシャルなどでご報告いただけましたら、弊社ブログでも
 ご紹介させていただきたいです!
コードの差し替え、動作速度検証について詳しくは、こちらの記事をご参照ください。
> 平均20%+高速化!Zenbackのスクリプトコードが新しくなりました
> http://blog.zenback.jp/2013/11/20zenback-0a1e.html

はてさて、
それならばと、

私もサイト表示速度は気にしていた方なので、

早速、
Zenbackサイトにて非同期コードを入手しまして、
Bloggerブログの記事直下に今まで通り挿入…。


以下に非同期コード全容を記載します。

<!-- X:S ZenBackWidget --><div id="zenback-widget-loader"></div><script type="text/javascript">!function(d,i){if(!d.getElementById(i)){var r=Math.ceil((new Date()*1)*Math.random());var j=d.createElement("script");j.id=i;j.async=true;j.src="//w.zenback.jp/v1/?base_uri=http%3A//sekirarablog.blogspot.jp/&nsid=112351448469097807%3A%3A112589542933953795&rand="+r;d.body.appendChild(j);}}(document,"zenback-widget-js");</script><!-- X:E ZenBackWidget -->




うまくいくはずもなく…。

以前に記載した記事で、
zenbackコードを記事下に綺麗に貼る方法


というのがあります。

そこで、
また、コード内に

// <![CDATA[
// ]]>


どこかに挿入してあげなければなりません。


それがどこかというのは、

以前とほとんど変わらずの位置です。


上記がZenbackより提供された元々の非同期コードです。


しかし、
これをそのまま記事内に挿入するだけでは、

Bloggerブログからエラーを吐かれて、
プレビュー・保存すらできません。



なので、

以下の様に
// <![CDATA[
// ]]>

を追加します。


<!-- X:S ZenBackWidget -->
<div id="zenback-widget-loader"></div>
<script type="text/javascript">// <![CDATA[
!function(d,i){if(!d.getElementById(i)){var r=Math.ceil((new Date()*1)*Math.random());var j=d.createElement("script");j.id=i;j.async=true;j.src="//w.zenback.jp/v1/?base_uri=http%3A//sekirarablog.blogspot.jp/&nsid=112351448469097807%3A%3A112589542933953795&rand="+r;d.body.appendChild(j);}}(document,"zenback-widget-js");// ]]>
</script><!-- X:E ZenBackWidget -->


  • 3行目の最後に// <![CDATA[
  • 4行目の最後に// ]]>

を追加します。


すると、

以前のようにBloggerブログさんに怒られることもなく、

プレビューもできるし保存も可能となります。


そして、

サイト表示速度はいかに…!!


ということですが、
今のところ私は測定していません。

若干、
サイトが表示される時にチラチラするかなという感じがしました。
(すぐに元に戻りますが…。)



他のユーザの方々の検証結果が、

Zenbackブログに掲載されているようなので、
紹介しておきます。

平均20%+高速化!Zenbackのスクリプトコードが新しくなりました - Zenback ブログ




なお、

2013年11月7日16時以降にZenback管理画面から入手したコードは、

全て新しいコード(非同期コード)に、
切り替わっているとの事です。



ただ…、

同じBloggerブログでも記事内(記事下)にZenback表示されているのに、

コードの追加していなくても普通に表示されているBloggerブログもあったりする…。
テンプレートが違うからなのかな・・・。



Bloggerブログで記事内に表示したいけれど、

Zenbackコードが以前と変わって(非同期コード)使いたいけれど、
記事内に挿入するとエラーを吐かれる。


という方は、
試してみてください。

スポンサーリンク



スポンサーリンク

この記事が気に入ったらいいね!
お願いします(#^.^#)

↓↓↓

最新情報をお届けします

言えないことはTwitterで!!


こんな記事も書いてます



関連性の高い記事


0 コメント:

コメントを投稿

次の投稿 前の投稿 ホーム
Related Posts Plugin for WordPress, Blogger...