Membuat Frame Area Posting Dan Sidebar

Salah satu upaya agar tampilan blog lebih enak dipandang mata adalah dengan membuat Frame / bingkai atau border berupa kotak yang membuat batas antar area posting (main-wrapper), widget di sidebar maupun footer.dan kebetulan kemarin saya baru Membuat Frame Area Posting Dan Sidebar di blog Tutorial Dan Bisnis ini.

Untuk lebih jelasnya pada gambar screenshoot dibawah ini terlihat Frame / Bingkai berupa garis tepi atau border pada setiap area posting dan widget di sidebar.

 

 

 

 

 

 

Inilah Cara Membuat Frame Area Posting Dan Sidebar yang saya lakukan :

a. Cara Membuat Frame / Bingkai Pada Area Posting (main wrapper)

1. Pertama login ke akun blogger atau dashboard.
2. Pilih menu Template –> Edit HTML
3. Selanjutnya cari code ini : .post {    tekan CTRL+F untuk memudahkan mencari
4. Tambahkan kode dibawah ini tepat dibawah code .post {

   padding: 5px;
   Border-top: 3px solid #000000;
   Border-bottom: 3px solid #000000;
   Border-left: 3px solid #000000;
   Border-right: 3px solid #000000;
   Margin-bottom: 10px;

5. Lakukan preview atau pratinjau dulu, jika sudah ok Lalu simpan template

b, Cara membuat Frame / Bingkai Pada Sidebar

1. Pertama login ke akun blogger atau dashboard.
2. Pilih menu Template –> Edit HTML
3. Cari code ini : ]]></b:skin>   Agar lebih mudah mencari tekan control+F
4. Tambahkan kode dibawah ini tepat diatas code ]]></b:skin>

   sidebar .widget{
   padding:5px 5px 5px 5px;
   border:1px solid #C11209;
   margin-bottom:5px

5. Lakukan preview atau pratinjau dulu, jika sudah ok Lalu simpan

Keterangan : Semua angka dan warna bisa diganti sesuai selera

• Padding: 5px; = Jarak antara text post dengan garis pinggir 5px; makin tinggi angka jarak dari tepi akan semakin lebar
• Border-top: 3px solid #000000; = garis pinggir atas 3px semakin tinggi angka,   maka akan semakin tebal garisnya
• Border-bottom: 3px solid #000000 ; = garis pinggir bawah 3px
• Border-left: 3px solid #000000 ; = garis pinggir kiri 3px
• Border-right: 3px solid #000000 ; = garis pinggir kanan 3px
• Margin-bottom: 10px; = jarak antar post yang satu dengan lainnya 10px
• Code warna #000000 adalah warna hitam

Catatan : Bentuk Frame bisa diganti sesuai selera                   

• solid      : bingkai menjadi garis biasa ( ___________ )
• dotted   : bingkai menjadi titik-titik ( .............................. )
• dashed : bingkai menjadi garis putus-putus ( --------------------- )
• double  : Bingkai 2 garis biasa   ( = )
• Ridge
• Groove
• Inset
• Outset
• Radius ( Sudut melengkung )
• dan lain-lain

Sampai disini  topik bahasan kita kita tentang Membuat Frame Area Posting Dan Sidebar selamat mencoba membuat halaman blog lebih menarik dan nyaman dimata pengunjung, tinggal tambah optimasi lebih SEO Friendly sehingga nyaman juga dimata Google dan si Cantik Alexa .

---

1. Thanks telah mampir, yo kita saling vote dan comment..
2. Bila berkenan tolong share/bagikan dengan tombol share dibawah.
3. Gratis langganan artikel blog ini, silahkan klik Subscribe Disini, atau masukan email disidebar yg telah disediakan

---