Postingan ini dikhususkan untuk blog yang selama ini mengikuti postingan EPG Studio dan yang telah memiliki tiga sidebar yaitu sidebar atas dan yang duanya ada dibawah sidebar atas.
Jika anda belum melengkapi dengan ketiga sidebar tersebut silahkan kunjungi postingan ini untuk membuatnya :
* MENAMBAH SIDEBAR JADI DUA
* TAMBAH LAGI SIDEBAR BLOG ANDA JADI 3 BUAH
Setelah sidebar anda menjadi tiga, barulah anda lanjutkan baca postingan ini.
Tiga sidebar yang dimiliki EPG Studio diberi nama : Sidebar-wrapper, Sidebarbaru-wrapper dan Sidebaratas-wrapper.
Tiga sidebar yang akan ditambahkan harus memiliki ukuran yang sama dengan ketiga sidebar diatas dan penamaannya harus berbeda dengan nama sidebar yang telah ada.
Nama sidebar yang ditambahkan di blog EPG Studio diberi nama sebagai berikut :
1. Sidebartengah-wrapper : memiliki ukuran sama dengan sidebar atas wrapper.
2. Sidebarbawah-wrapper : memiliki ukura yang sama dengan sidebar-wrapper.
3. Sidebarbawahbaru-wrapper : memiliki ukuran yang sama dengan sidebarbaru-wrapper.
Setelah siap dengan nama ketiga sidebar yang akan ditambahkan, ikuti langkah-langkah berikut ini :
1. Masuk ke Edit HTML.
2. Back up dulu templatenya kalau takut gagal.
3. Cari kode ini :
#sidebarbaru-wrapper {
width: 230px;
float: right;background:#0066CC; border:0px solid $bordercolor;white;
padding:5px 5px .25em;
padding-left:5px;
word-wrap: break-word;
overflow: hidden;
}
(mungkin pada sebagian template memiliki istilah yang berbeda).
4. Copy kode dibawah ini kemudian paste tepat dibawah kode tadi :
#sidebartengah-wrapper {
border: 0px solid #0066CC;
background:#3D81EE;
width:470px;
float:right;
padding:5px;
margin-bottom:5px;
}
#sidebarbawah-wrapper {
width: 230px;
float: $endSide;background:#0066CC; border:0px solid $bordercolor;white;
padding:2.5px 2.5px 2.5px .5em;
word-wrap: break-word;
overflow: hidden;
}
#sidebarbawahbaru-wrapper {
width: 230px;
float: $endSide;background:#0066CC; border:0px solid $bordercolor;white;
padding:5px 5px .25em;
word-wrap: break-word;
overflow: hidden;
}
5. Selanjutnya cari kode ini :
<div id="sidebarbaru-wrapper">
<b:section class="sidebar" id="sidebarbaru" preferred="yes"></div><lu>
Copy kode dibawah ini kemudian paste tepat diatas kode tadi.
<div id='sidebarbawahbaru-wrapper'>
<b:section class='sidebarbawahbaru-wrapper' id='sidebarbarubawah-wrapper' showaddelement='yes'>
</b:section>
</div>
<div id='sidebarbawah-wrapper'>
<b:section class='sidebarbawah-wrapper' id='sidebarbawah-wrapper' showaddelement='yes'>
</b:section>
</div>
<div id='sidebartengah-wrapper'>
<b:section class='sidebaratas' id='sidebartengah' showaddelement='yes'>
</b:section>
</div>
6. Klik tombol Simpan template
Jika ingin sidebar yang baru kita tambahkan tampil dalan bentuk kotak-kotak, lakukanlah langkah-langkah berikut.
1. Masih di Edit HTML.
2. Cari kode ini .sidebaratas .widget{ untuk menempatkan sidebartengah .widget
3. Copy seluruh kode dibawah ini kemudian paste tepat dibawahnya.
.sidebartengah {
color: $sidebartextcolor;
line-height: 1.5em;
}
.sidebartengah ul {
list-style:none;
margin:0 0 0;
padding:0 0 0;
}
.sidebartengah li {
margin:0;
padding-top:0;
padding-$endSide:0;
padding-bottom:.25em;
padding-$startSide:15px;
text-indent:-15px;
line-height:1.5em;
}
.sidebartengah .widget{
background:#3D81EE;
border:2px solid #66B5FF;
margin:0 0 0em;
padding:0.5em;
}
4. Cari kode ini .sidebar .widget{ untuk meletakan .sidebarbawah-wrapper .widget{ dan .sidebarbawahbaru-wrapper .widget{
5. Copy seluruh kode dibawah ini dan paste tepat diatas kode .sidebar .widget{
.sidebarbawah-wrapper .widget{
background:#3D81EE;
border:2px solid #66B5FF;
margin:0 0 0.5em;
padding:0.5em;
}
.sidebarbawahbaru-wrapper .widget{
background:#3D81EE;
border:2px solid #66B5FF;
margin:0 0 0.5em;
padding:0.5em;
}
6. Warna yang digunakan pada tips ini semuanya merupakan warna yang digunakan pada EPG Studio. Silahkan anda ganti sesuai dengan warna kesukaan anda.
7. Setelah selsai pengeditan klik Tombol Simpan Template.
8. Isilah sidebar baru dengan sesuatu yang bermanfaat bagi blog anda.
9. Selamat mencoba, semoga berhasil dan bermanfaat...!!!
Jika anda belum melengkapi dengan ketiga sidebar tersebut silahkan kunjungi postingan ini untuk membuatnya :
* MENAMBAH SIDEBAR JADI DUA
* TAMBAH LAGI SIDEBAR BLOG ANDA JADI 3 BUAH
Setelah sidebar anda menjadi tiga, barulah anda lanjutkan baca postingan ini.
Tiga sidebar yang dimiliki EPG Studio diberi nama : Sidebar-wrapper, Sidebarbaru-wrapper dan Sidebaratas-wrapper.
Tiga sidebar yang akan ditambahkan harus memiliki ukuran yang sama dengan ketiga sidebar diatas dan penamaannya harus berbeda dengan nama sidebar yang telah ada.
Nama sidebar yang ditambahkan di blog EPG Studio diberi nama sebagai berikut :
1. Sidebartengah-wrapper : memiliki ukuran sama dengan sidebar atas wrapper.
2. Sidebarbawah-wrapper : memiliki ukura yang sama dengan sidebar-wrapper.
3. Sidebarbawahbaru-wrapper : memiliki ukuran yang sama dengan sidebarbaru-wrapper.
Setelah siap dengan nama ketiga sidebar yang akan ditambahkan, ikuti langkah-langkah berikut ini :
1. Masuk ke Edit HTML.
2. Back up dulu templatenya kalau takut gagal.
3. Cari kode ini :
#sidebarbaru-wrapper {
width: 230px;
float: right;background:#0066CC; border:0px solid $bordercolor;white;
padding:5px 5px .25em;
padding-left:5px;
word-wrap: break-word;
overflow: hidden;
}
(mungkin pada sebagian template memiliki istilah yang berbeda).
4. Copy kode dibawah ini kemudian paste tepat dibawah kode tadi :
#sidebartengah-wrapper {
border: 0px solid #0066CC;
background:#3D81EE;
width:470px;
float:right;
padding:5px;
margin-bottom:5px;
}
#sidebarbawah-wrapper {
width: 230px;
float: $endSide;background:#0066CC; border:0px solid $bordercolor;white;
padding:2.5px 2.5px 2.5px .5em;
word-wrap: break-word;
overflow: hidden;
}
#sidebarbawahbaru-wrapper {
width: 230px;
float: $endSide;background:#0066CC; border:0px solid $bordercolor;white;
padding:5px 5px .25em;
word-wrap: break-word;
overflow: hidden;
}
5. Selanjutnya cari kode ini :
<div id="sidebarbaru-wrapper">
<b:section class="sidebar" id="sidebarbaru" preferred="yes"></div><lu>
Copy kode dibawah ini kemudian paste tepat diatas kode tadi.
<div id='sidebarbawahbaru-wrapper'>
<b:section class='sidebarbawahbaru-wrapper' id='sidebarbarubawah-wrapper' showaddelement='yes'>
</b:section>
</div>
<div id='sidebarbawah-wrapper'>
<b:section class='sidebarbawah-wrapper' id='sidebarbawah-wrapper' showaddelement='yes'>
</b:section>
</div>
<div id='sidebartengah-wrapper'>
<b:section class='sidebaratas' id='sidebartengah' showaddelement='yes'>
</b:section>
</div>
6. Klik tombol Simpan template
Jika ingin sidebar yang baru kita tambahkan tampil dalan bentuk kotak-kotak, lakukanlah langkah-langkah berikut.
1. Masih di Edit HTML.
2. Cari kode ini .sidebaratas .widget{ untuk menempatkan sidebartengah .widget
3. Copy seluruh kode dibawah ini kemudian paste tepat dibawahnya.
.sidebartengah {
color: $sidebartextcolor;
line-height: 1.5em;
}
.sidebartengah ul {
list-style:none;
margin:0 0 0;
padding:0 0 0;
}
.sidebartengah li {
margin:0;
padding-top:0;
padding-$endSide:0;
padding-bottom:.25em;
padding-$startSide:15px;
text-indent:-15px;
line-height:1.5em;
}
.sidebartengah .widget{
background:#3D81EE;
border:2px solid #66B5FF;
margin:0 0 0em;
padding:0.5em;
}
4. Cari kode ini .sidebar .widget{ untuk meletakan .sidebarbawah-wrapper .widget{ dan .sidebarbawahbaru-wrapper .widget{
5. Copy seluruh kode dibawah ini dan paste tepat diatas kode .sidebar .widget{
.sidebarbawah-wrapper .widget{
background:#3D81EE;
border:2px solid #66B5FF;
margin:0 0 0.5em;
padding:0.5em;
}
.sidebarbawahbaru-wrapper .widget{
background:#3D81EE;
border:2px solid #66B5FF;
margin:0 0 0.5em;
padding:0.5em;
}
6. Warna yang digunakan pada tips ini semuanya merupakan warna yang digunakan pada EPG Studio. Silahkan anda ganti sesuai dengan warna kesukaan anda.
7. Setelah selsai pengeditan klik Tombol Simpan Template.
8. Isilah sidebar baru dengan sesuatu yang bermanfaat bagi blog anda.
9. Selamat mencoba, semoga berhasil dan bermanfaat...!!!
