アメブロで個別記事にのみZenbackを表示する方法 | 南大阪・松原市で働く行政書士のブログ

アメブロで個別記事にのみZenbackを表示する方法

このブログはトップページへアクセスすると、一度に5記事表示されるようにしてあります。

その為画像の多い記事などが続くと、表示されるのに時間がかかってしまいます。

それに加えてブログパーツでZenbackを設置している為、こちらの読み込みも少し待たなければなりません。
詳細は→アメブロにzenbackを導入して記事下に表示させる方法

結果的に、ブログを開けてから読めるようになるまでに変なタイムラグが発生し、読みやすいブログとは言えない状態になっていました。


そこで改善策を検討。


Zenbackを外してしまうという選択肢もありますが、共有ボタンの設置などなかなか便利な機能も捨てがたく少し迷います。


要は「複数記事を一覧表示している時にはZenbackが表示されず」、「個別記事にのみZenbackが表示される」方法があればいいのではないか?という考えに行き着いたので、色々検索。


どうやら方法としては何通りもやり方があるようですが、かなりわかりやすく書かれたこちらの方の記事を発見しました。

上記の記事より当ブログに該当する箇所だけ転載

Zenbackにて入手したコードへ以下の赤字の部分を追加します。
<!-- X:S ZenBackWidget -->
<script type="text/javascript">
var url=location.href;
if (url.match(/^.+\/entry\-[0-9]*\.html[a-zA-Z0-9!-~]*$/g )) {

(zenbackで作られたコード)
}
</script>
<!-- X:E ZenBackWidget -->
<script>
$(function() {
$("#zenback_loady").insertBefore(".foot");
});
</script>

ちなみに赤文字でない部分は全てZenbackにて作成されるコードなので、その隙間に赤文字部分をはめていくような手順となります。


早速導入。

希望通り個別記事表示の時だけZenbackが表示されるようになりました。


ただしばらくZenbackを運用してみた感じ、どうも関連記事の精度やキャッシュの更新具合に?となることが多く、もう少し様子を見て使い続けるかどうか考え直す事になりそうです。

アメブロカスタマイズ目次