Posted by : Rani Baru Wiranata Feb 25, 2013


If you are interested in this way, you can simply follow the steps - these steps:
1. Login to blogger with your ID.
2. Click the design.
3. And click the Edit HTML tab.
4. As always it is good every edit html, download full template so that the template used safely, if anything goes wrong.
5. Do not forget to click the "Expand Widget Templates"
6. Find the code below or similar to this code :

</header>
Note: Each template is usually different code. If it does not find the code as above, you can see examples of the different templates with features like the following :


 <div class='region-inner header-inner'>
      <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Blog TITEL you(Header)' type='Header'/>
</b:section>
</div>
 7. Then place the following code after the code as above :

   <div id='kolom-bawah-header-container'>
<div id='kolom-bawah-header1' style='width: 225px; float: left; margin:0; '>
<b:section class='kolom-bawah-header' id='kolom-bawah-header-1' preferred='yes' style='float:left;'>
<b:widget id='Text1' locked='false' title='Bawah header 1' type='Text'/>
</b:section>
</div>
<div id='kolom-bawah-header2' style='width: 225px; float: left; margin:0; '>
<b:section class='kolom-bawah-header' id='kolom-bawah-header-2' preferred='yes' style='float:left;'>
<b:widget id='Text4' locked='false' title='Bawah header 2' type='Text'/>
</b:section>
</div>
<div id='kolom-bawah-header4' style='width: 225px; float: right; margin:0; '>
<b:section class='kolom-bawah-header' id='kolom-bawah-header-4' preferred='yes' style='float:right;'>
<b:widget id='Text3' locked='false' title='Bawah header 4' type='Text'/>
</b:section>
</div>
<div id='kolom-bawah-header3' style='width: 225px; float: right; margin:0; '>
<b:section class='kolom-bawah-header' id='kolom-bawah-header-3' preferred='yes' style='float:right;'>
<b:widget id='Text2' locked='false' title='Bawah header 3' type='Text'/>
</b:section>
</div>
<div style='clear:both;'/>
</div>
 
 Note : You can replace the red code in the code above, it is the value of the width of each gadget. Please you adjust the width of your own template.

8. Then you look again at the code below or similar to this code :

]]></b:skin>

9. Copy the code below and paste or place the following code before the code ]]></b:skin> :

#kolom-bawah-header-container { border: .3px dotted #cccccc;}
.kolom-bawah-header { margin: 0 10px 0 10px; padding:5px;
color: #666666; line-height: 1.5em; font-size:12px;}
.kolom-bawah-header h2 {
padding-bottom:.15em; text-align:center;
font:"normal normal 80% 'Comic Sans MS','Lucida Sans Unicode','Trebuchet MS',Sans-serif";
color:#333333;
line-height:1em; letter-spacing:.1em;
border-bottom: 1px solid #cccccc;}
.kolom-bawah-header ul { list-style:none; margin:0 0 0; padding:0 0 0;}
.kolom-bawah-header ul li {
background: url(http://i421.photobucket.com/albums/pp296/rnbutpur/bullet-1.gif) no-repeat;
margin:0 0 0; padding-left: 16px;
padding-bottom: 0.5em; line-height:1.2em;}
.kolom-bawah-header .widget {margin:0 0 .5em; padding:0 0 1em;}

10. SAVE TEMPLATE


Good luck and hopefully useful ....
Do not forget to take time for you like it ...... thank you.
You can also subscribe to the latest articles from me




Leave a Reply

Subscribe to Posts | Subscribe to Comments

- Copyright © RBW BLOG - Date A Live - Powered by Blogger - Designed by Johanes Djogan -