つかいかた

テーマストアからインストールしたら、以下のコードを「デザイン設定」→「フッタ」にコピー・アンド・ペーストしてください。

<script>
<script>
var previousPageYOffset = 0;
var sidebar = document.getElementById("box2");
var blogTitle = document.getElementById("blog-title");
var offsetTop;

var onScroll = function (event) {
  var bbox = sidebar.getBoundingClientRect();

  if (sidebar.style.position != "fixed") {
    if (bbox.bottom < window.innerHeight) {
      sidebar.style.position = "fixed";
      sidebar.style.top = "";
      sidebar.style.bottom = 0;
    } else if (offsetTop < bbox.top) {
      sidebar.style.position = "fixed";
      sidebar.style.top = offsetTop + "px";
      sidebar.style.bottom = "";
    }
  } else {
    if ((bbox.top != offsetTop && window.pageYOffset < previousPageYOffset)
      || (bbox.top == offsetTop && previousPageYOffset < window.pageYOffset)) {
      sidebar.style.position = "absolute";
      sidebar.style.top = window.pageYOffset + bbox.top + "px";
      sidebar.style.bottom = "";
    }
  }
  if (blogTitle.getBoundingClientRect().bottom - bbox.top <= 1) {
    blogTitle.style['border-bottom'] = "";
  } else {
    blogTitle.style['border-bottom'] = "solid 1px #dedede";
  }
  previousPageYOffset = window.pageYOffset;
};

var scrollSideBar = function (event) {
  sidebar.style.position = "";
  sidebar.style.top = "";
  sidebar.style.bottom = "";
  if (1023 < window.innerWidth) {
    offsetTop = blogTitle.offsetTop + blogTitle.offsetHeight;
    sidebar.style.top = offsetTop + "px";
    if (sidebar.getBoundingClientRect().height + offsetTop < window.innerHeight) {
      sidebar.style.position = "fixed";
      window.removeEventListener('scroll', onScroll);
    } else {
      sidebar.style.position = "absolute";
      window.addEventListener('scroll', onScroll);
      onScroll();
    }
  } else {
    window.removeEventListener('scroll', onScroll);
  }
};

window.onresize = scrollSideBar;
scrollSideBar();
</script>