加上了垂直导航栏

原因嘛
1.缩放字体的东西总放在“测试模块”里面有点不像话;
2.改标题栏的时候把“回到首页”的链接给咔咔掉了...但是这么重要的功能没有肯定是不行的

所以，只好搞个垂直导航栏安置这些东西

方法嘛，抄袭自Dream Dynasty，当然，为了面子，我还是象征性的改了一点点东西的

需要说一下的
1.为了尽量作到对各种屏幕分辨率都能兼容，导航栏被靠在主题框架的左侧，这样即使在很低的屏幕分辨率下，应该也还能看到。
2.透明度改了一下，现在是默认透明度0.4,鼠标点上以后变成1，我个人比较习惯这种方式。
3.移动方向那个...不知道为什么，如果改成点上以后向左侧移动，就会出现问题....不知道为什么，试过left:-5px;也试过right:5px,都不对:(
4.设置了font-size，虽然里面并不会真的出现什么字，但是字号的变化会影响排版，所以这里把它定死了。
5.不知道为什么，在ie下面的排版有点搞笑...忍...不知道怎么回事,我尽力了~~~

Step 1:

在header-wrapper里面加入
<b:section class='Manubar' id='Manubar' maxwidgets='1' showaddelement='yes'/>

Step 2:

加入以下CSS
/* 导航栏，modified my modeman
----------------------------------------------- */

#Manubar {
font-size:small;/*为了使得这个东西不会受到字体放缩的影响*/
margin-left:-41px;
position:fixed;
text-align:left;
width:30px;
}

#Manubar a img {
opacity:0.4;
}

#Manubar a:hover img {
left:5px;
opacity:1;
position:relative;
top:0px;
}

#Manubar img {
margin-bottom:-5px;
}
#Manubar hr{
margin-top: 4px;
margin-bottom:4px;
}

/*IE only*/
* html #Manubar { /*IE only,解决ie下面一部分搞笑的问题，不过不是全部:(*/
position:absolute;
}
* html #Manubar img{ /*IE only,解决ie下面另外一部分搞笑的问题*/
position:fixed;
margin-bottom:-20px;
opacity:0.4;
}
* html #Manubar hr{
margin-top: 16px;
margin-bottom:-2px;
}
ie下面的排版和ff不太一样，所有一些参数是为ie设置的，不过总的来说，我平时主要考虑的是ff下面的效果。另外由于我用到了分割线，所以也设置了一下分割线的参数

Step 3:

在模板的页面元素中，你会发现左上角现在也可以添加页面元素了，到那个地方新建一个页面元素，然后加入你需要的项目，下面是我用的代码，基本上看一下就能明白
<span>
<a href="http://eerenyuanback.blogspot.com/" title="Home"><img alt="Home" src="http://eerenyuan.googlepages.com/homepage.png" class="Manubar"/></a>
<hr/>
<a href="javascript:textresize(1)" title="Larger Font Size"><img alt="Font+" src="http://chenkaie.blog.googlepages.com/FontSizePlus.gif" class="Manubar"/></a>
<br/>
<a href="javascript:textresize(0)" title="Default Font Size"><img alt="Font0" src="http://chenkaie.blog.googlepages.com/FontSizeOrigin.gif" class="Manubar"/></a>
<br/>
<a href="javascript:textresize(-1)" title="Smaller Font Size"><img alt="Font-" src="http://chenkaie.blog.googlepages.com/FontSizeMinus.gif" class="Manubar"/></a>
<br/>
</span>

修改：

发现在如果希望在ie下面有鼠标效果，需要用类似这样的东西
<img onmouseout="makevisible(this,1)" onmouseover="makevisible(this,0)" src="xxxx" style="opacity: 0.2;">
太麻烦了，反正ie下面大量的东西都不正常，也不在乎多这一个了，所以懒得改了

修改2：

在ie下面已知的问题包括:

1.没有透明度变化
2.位置变化的方式也跟ff下不同
3.纵向的排版和在ff下不同----因为透明度不太一样，所以这里故意设置得不太一样
4.最后的按钮结束以后一定要加一个回车外加一个<br/>或者一个<hr/>,否则在ie下面最后一个按钮的敏感区域会变小----不知道是为什么

修改3：

在ie下面还是不要让按钮移动的好，加入以下css
* html #Manubar a:hover img {/* 钉死IE下面的图像*/
left:0px;
position:relative;
top:0px;
}