ハテナブログに追跡型バナーをつけたいのですが、どうやってつければよいかわかりません。

こんな感じでしょうか。

<style>
#chase-banner {
    position: fixed;
    right: 1em;
    bottom: 1em;
}
</style>
<a id="chase-banner" href="http://a-kuma3.hatenablog.com/" title="本宅">
    <img src="http://cdn1.www.st-hatena.com/users/a-/a-kuma3/profile.gif">
</a>

a タグの href がリンク先で、img タグの src が画像の URL です。

上記のコードを、「デザイン」→「カスタマイズ」→「フッタ」のところに貼り付けてください。


ぼくのブログに設置してみました。
右下に出てるぼくのアイコン画像が、追跡型バナーのつもりです。
http://a-kuma3-alt.hatenablog.jp/

早速つけてみたのですが、

バナーと言ってたのは、縦長の広告でしたか。
「追跡型」と言ってたのは、こんなイメージのものですか？
http://a-kuma3-alt.hatenablog.jp/


サイドバーに HTML モジュールを追加して（って、ここまではできてますね）、以下のコードを貼り付けてください。

<span id="chaser-module-mark"></span><!-- 目印 -->

<!-- ここに忍者のスクリプトを貼る -->
<script src="http://adm.shinobi.jp/s/..."></script>

<style>
.chaser-module {
    position: fixed;
    top: 16px;  /* ★固定する位置 */
}
</style>
<script>
(function() {
    document.addEventListener("DOMContentLoaded", function() {
        var e = document.getElementById("chaser-module-mark");
        if (e) {
            var PAD = 16;   /* ★固定する位置 */
            var mod = e.parentNode.parentNode;
            var mod_original_top = 0;
            var fixed = false;
            window.addEventListener("scroll", function(ev) {
                if (fixed) {
                    if (document.documentElement.scrollTop <= mod_original_top - PAD) {
                        mod.classList.remove("chaser-module");
                        fixed = false;
                    }
                } else {
                    var t = mod.getBoundingClientRect().top;
                    if (t <= PAD) {
                        mod_original_top = document.documentElement.scrollTop;
                        mod.classList.add("chaser-module");
                        fixed = true;
                    }
                }
            });
        }
    });
})();
</script>

ウィンドウの内側ピッタリで止まるよりも、少しすき間を空けた方が良いかなと思い、位置の調整をしています。
「★」をつけた 2ヶ所の 16 がすき間です。