如何在blogger顶部加入导航标签

本文摘要部分：

导航标签，其实质就是链接。如果我们能够在blogger的顶部加入链接，不但能够使访问者直接看到我们所要展示的网站，提高网站的访问几率，而且我们可以将其做成本站的导航链接，方便访问者更好的浏览本站。其在<页面元素>中的效果如下，即为Navbar导航条下的<Menubar>，我们可以在这加入导航链接。

图1

其具体操作步骤如下：
帖子其余部分：

1、在模板代码中查找Variable，一般在模板的靠前部分，在这我们先定义两个颜色变量，设置导航字体颜色和鼠标经过时的颜色，将下面的代码加入合适的地方；


<Variable name="headerTextColor"
description="headerTextColor"
type="color" default="#000" value="#006699">
<Variable name="headerCornersColor"
description="headerConersColor"
type="color" default="#000" value="#940f04">


2、查找"]]></b:skin>"，将下面的代码加在"]]></b:skin>"的前面，以定义导航栏区域；


#menubar h2 {display:none;}
#menubar ul {
list-style: none;
}
#menubar li {
float: left;
}
#menubar a:link, #menubar a:visited, #menubar a:hover {
padding: 5px;
display: block;
color: $headerTextColor;
}
#menubar a:hover {
background-color: $headerCornersColor;
}


3、在Html里添加相应的区域，即下面的红色代码。


<div id='header-wrapper'>
<b:section class='menubar' id='menubar' maxwidgets='1' showaddelement='yes'>
<b:widget id='LinkList2' locked='true' title='Menubar' type='LinkList'/>
</b:section>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='false' title='Beautiful Beta (Header)' type='Header'/>
</b:section>
</div>


4.保存模板之后，就可以到<页面元素>的<Menubar>里添加链接了，效果如图1所示。