之前小編在 WordPress 主題下載站給大家介紹過一款可以實現實現 WordPress 側欄固定浮動效果的外掛，詳細可以點選：《給 WordPress 邊欄新增固定懸浮小工具的外掛》，但是很多朋友反應外掛使用過沒效果，那麼今天介紹的方法，將是用程式碼實現的！小白能夠聽懂的！

其實大多需要 WordPress 側欄固定浮動效果的朋友都是因為覺得 WordPress 部落格網站的側邊欄通常都不是太長，而隨著頁面往下拉，導致右側顯得很空，及時首頁的側欄高度和網站高度能夠一樣高的時候，在文章頁面裡，還是會顯得右側會空下來，因為不一樣的文章，高度也不一樣，這個時候十分需要一個 WordPress 側欄固定浮動效果的功能，好讓右側不那麼空，也可以增加使用者的點選慾望，對於有廣告的使用者，將廣告加入側欄固定浮動後，使用者點選量會增加，從而增加收入！

那麼我們現在詳細的解說下實現 WordPress 側欄固定浮動效果的具體方法：

教程 2014/0101 更新

運用到下面的程式碼 （當然是在邊欄 sidebar.php 檔案內新增）:

  1. <div id="float">
  2. </div>
  3. "text/javascript" src="http://www.***.com/a.js"></script>

div 內可以自由新增要懸浮的 div 內容，而下面運用的 js 檔案的內容為：

  2. function buffer(a,b,c){var d;return function(){if(d)return;d=setTimeout(function(){a.call(this),d=undefined},b)}}(function(){function e(){var d=document.body.scrollTop||document.documentElement.scrollTop;d>b?(a.className="div1 div2",c&&(a.style.top=d-b+"px")):a.className="div1"}var a=document.getElementById("float");if(a==undefined)return!1;var b=0,c,d=a;while(d)b+=d.offsetTop,d=d.offsetParent;c=window.ActiveXObject&&!window.XMLHttpRequest;if(!c||!0)window.onscroll=buffer(e,150,this)})();

大家可以新建個 a.js 檔案來呼叫，或者直接將上面的 js 程式碼放到你們 WordPress 已呼叫的 js 內！最後，給 style.css 裡新增樣式為：

  1. .div2{top:10px;z-index:999;position:fixed;_position:absolute}

教程到這，相信基本都會了吧。。。