Halo vroh lama tak post jadi mau post ini aja deh 

Membuat Sebuah Kotak Untuk Edit Style Template Blog

 Untuk demonya bisa dilihat di bagian footer blog ini. Oke berikut caranya...

1) Masuk Blogger

2) Template 

3) Edit HTML

4) Cari kode ]]></b:skin>

5) Pastekan kode dibawah ini tepat diatasnya (Gwe disini pake 6 kotak, jika kurang tambahin sendiri dan untuk tampilannya silahkan di edit sendiri mulai dari border, border color, border radius, posisi, background color, dll)

.kotak1 {
z-index: 99;
width: 45px;
height: 72px;
border: 3px solid #006acc;
border-top: 0px solid #000;
border-right: 3px solid #006acc;
border-bottom-right-radius: 9px;
border-bottom-left-radius: 9px;
position: absolute;
background: #000;
margin-left: 291px;
margin-top: -210px;
}
.kotak2 {
z-index: 99;
width: 45px;
height: 72px;
border: 3px solid #006acc;
border-left: 3px solid #006acc;
border-right: 3px solid #006acc;
border-top-right-radius: 9px;
border-top-left-radius: 9px;
border-bottom: none;
position: absolute;
background: #000;
margin-left: 291px;
margin-top: -72px;
}
.kotak3 {
z-index: 99;
width: 45px;
height: 72px;
border: 3px solid #006acc;
border-top: 0px solid #000;
border-right: 3px solid #006acc;
border-bottom-right-radius: 9px;
border-bottom-left-radius: 9px;
position: absolute;
background: #000;
margin-left: 655px;
margin-top: -210px;
}
.kotak4 {
z-index: 99;
width: 45px;
height: 72px;
border: 3px solid #006acc;
border-left: 3px solid #006acc;
border-right: 3px solid #006acc;
border-top-right-radius: 9px;
border-top-left-radius: 9px;
border-bottom: none;
position: absolute;
background: #000;
margin-left: 655px;
margin-top: -72px;
}
.kotak5 {
z-index: 99;
width: 45px;
height: 40px;
border: 3px solid #006acc;
border-top: none;
border-bottom: none;
border-right: 3px solid #006acc;
border-radius: 16px;
position: absolute;
background: #000;
margin-left: 291px;
margin-top: -125px;
}
.kotak6 {
z-index: 99;
width: 45px;
height: 40px;
border: 3px solid #006acc;
border-top: none;
border-bottom: none;
border-right: 3px solid #006acc;
border-radius: 16px;
position: absolute;
background: #000;
margin-left: 655px;
margin-top: -125px;
}

6) Cari tempat lokasi untuk kotaknya (misal <footer id='footer-wrapper'> atau <header id='header-wrapper'> atau juga bisa <content id='content-wrapper'>)

7) Pastekan kode berikut tepat diatas tempat lokasinya

<div class='kotak1'/>
<div class='kotak2'/>
<div class='kotak3'/>
<div class='kotak4'/>
<div class='kotak5'/>
<div class='kotak6'/>

8) Pratinjau dahulu jika sudah SAVE