Blogger Hack - 讓側邊工具列sidebar可以展開摺疊
在經營blog 一段時間後，日入的東西也越來越多，這時側邊工具列落落長的一整排，看起來實在很難過。
網路上我找到了兩種方法，一個是無腦安裝法，如下所示：
另一個則是自己手動加上的
我選擇了後者，Abin 前輩那裡的解說，易讀性相當高，跟著照做應該不會有什麼問題，如果你也跟我一樣剛學習使用 blogger ，你可以看一下我這篇文章，可以省走一些彎路
在 </head>之前，貼上底下 javascript程式碼。
<script type='text/javascript'>
<!-- Function used for Sidebar Element Toggling: ElementToggle()-->
function ElementToggle(id) {
var element = document.getElementById(id).getElementsByTagName('div');
for(i = 0; i < element.length; i++) {
attribute = element[i].getAttribute('id');
if(attribute == 'toggle')
{
if (element[i].style.display == 'none')
element[i].style.display = 'inline';
else
element[i].style.display = 'none';
}
}
}
</script>
接著再查找想收合的widget 名稱，並插入程式碼即可。
如果你不明白 widget 是啥的話，可以看底下這篇文章：
我以常用的 文章標籤(英文：Label)為例，直接 Ctrl+F 找 <b:widget id='Label，原則上，像我自己，只新增了一個「Label標籤」功能，所以我用<b:widget id='Label 下去找，就直接找到了底下程式碼：
- 如果你要找的是其它功能，請自行將Label改成其它名字或是用<b:widget id='下去查找所有的 widget。
- 你如果沒有事先從「範本」>>「網頁元素」>>「加入網頁元素」>>新增「標籤」功能，它不會出現喔。
<b:widget id='Label1' locked='false' title='文章標籤' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2>
<!--=======cccccode收合功能====文章標籤========-->
<a href='javascript:void(0);' onclick='javascript:ElementToggle("Label1");'>[+/-]</a>
<!--=======cccccode收合功能====文章標籤========-->
<data:title/>
</h2>
</b:if>
<div class='widget-content' id='toggle' style='display:none;'>
<ul>
<b:loop values='data:labels' var='label'>
…底下程式碼省略…
接下來
- 由上到下，確定第二個紫色字體等於第一個紫色字體，要相同，程式才會啟動。
- 將整段藍色字體程式碼(註解請自行去除)複製貼上到綠色字體<data:title/>的上面或下面，在上則在標題前面，反之則在後面。
- 接著把紅字複製貼上，這時你的widget 預設是收起來的，如果你希望一開始是打開的，就把style='display:none;' 給刪掉即可。
講完，收工。
Recent Comments