Create current menu in Blogger



This is a continuation of the codevious tutorial, which is "Create menu in Blogger"
If you already have the menu as in the codevious tutorial, this step is the right step to make the current menu

The steps are:
1. Find this code:

<b:widget id="LinkList01" locked="false" title="Openning" type="LinkList">
<b:includable id="main">

<b:if cond="data:title"><h2>
<data:title></data:title></h2>
</b:if>
<div class="widget-content">
<ul><b:loop values="data:links" var="link">
<li><a expr:href="data:link.target" href="http://www.blogger.com/blogger.g?blogID=2529869826028165086"><data:link.name></data:link.name></a></li>
</b:loop> </ul>
<b:include name="quickedit">
</b:include></div>
</b:includable>
</b:widget>

2. Then replace with this code

<b:widget id="LinkList01" locked="false" title="" type="LinkList">
<b:includable id="main">
<b:if cond="data:title"><h2>
<data:title></data:title></h2>
</b:if>
<div class="widget-content">
<ul><b:loop values="data:links" var="link"> <b:if cond="data:blog.url==data:link.target">
<li><a class="current" expr:href="data:link.target" href="http://www.blogger.com/blogger.g?blogID=2529869826028165086"><data:link.name></data:link.name></a></li>
<b:else>
<li><a expr:href="data:link.target" href="http://www.blogger.com/blogger.g?blogID=2529869826028165086"><data:link.name></data:link.name></a></li>
</b:else></b:if> </b:loop> </ul>
<b:include name="quickedit">
</b:include>

3. Add CSS, Find this code: #LinkList01 ul {
list-style: none;
padding: 0;
margin: 0;
}

#LinkList01 ul li a {
padding: 1px 10px 2px 10px;
display: block; background-color:# EEE;
text-decoration: none;
color: # 555;
margin-bottom: 1px;
}

#LinkList01 ul li a: hover {
background-color: # 333;
color: # FFF;
}

Copy this code then paste below:
#LinkList01 ul li a.current {
background-color: # 333;
color: # FFF;
}

As is the end result:

#LinkList01 ul {
list-style: none;
padding: 0;
margin: 0;
}

#LinkList01 ul li a {
padding: 1px 10px 2px 10px;
display: block; background-color:# EEE;
text-decoration: none;
color: # 555;
margin-bottom: 1px;
}

#LinkList01 ul li a: hover {
background-color: # 333;
color: # FFF;
}

#LinkList01 ul li a.current {
background-color: # 333;
color: # FFF;
}

Done ........
It was easy to do .......
hehehehehehe

Good luck!!!
Official wiyono blog