Monday, 5 August 2013
Simple Side Bar


----------------------------------------------------------------------------------------------
FIND B SKIN TAG AND REPLACE BELOW CODE
]]></b:skin>
------------------------------------------------------------------------------------------------
/* Sidebar Content
----------------------------------------------- */
#sidebar-wrapper { float: left; margin-top: 5px; width: 200px; height 200px;}
.sidebar .widget {
float:left;
height:210px;
width:210px;
background-color:#009AFA;
border:2px solid #9AFA00;
margin-bottom:17px;
margin-right:17px;
padding:9px;
}
.sidebar ul {float: left;line-height: 24px;}
.sidebar li {}
.sidebar li a{
background-color: #252C33;
border: 1px solid #2D363E;
color: #FFFFFF;
display: block;
margin-bottom: 5px;
padding: 3px 3px 3px 10px;
width: 200px;
}
.sidebar li a:hover{
background-color: #2D363E;
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifLF8TsKT5tMQ00g8WLlyj6V17hZsncOTogwUtVzllUZMVNydCHP2yunMlhhK_6xnVKrZWQmzFBE9X00ROOKd0OCglTkC7cLet-Ej_Mpg2lI5hsfb3YfZOsb7Ybk_ut30_Gcm4YTEa4kPR/s13/sidebar-hover.gif);
background-position: 170px 8px;
background-repeat: no-repeat;
border: 1px solid #333D47;
}
h2 {
color: #fff;
display: block;
float: left;
font-family: Trebuchet MS;
font-size: 13px;
font-weight: normal;
margin: 4px 0 10px;
padding-left: 10px;
text-transform: lowercase;
width: 200px;
}
---------------------------------------------------------------------------------------
FIND END CONTENT WRAPPER DIV AND REPLACE BELOW CODE
--------------------------------------------------------------------------------------
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML1' locked='false' title='' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
<b:widget id='HTML3' locked='false' title='' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
<b:widget id='HTML2' locked='false' title='' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
</b:section>
</div>
<div class='clear'/>
<!-- spacer for skins that want sidebar and main to be the same height-->
<div class='clear'> </div>
</div> <!-- end content-wrapper -->
Subscribe to:
Post Comments (Atom)
0 comments:
Post a Comment