Cara Membingkai Area Posting dan Sidebar

Cara Membingkai Area Posting dan Sidebar. Dengan memberikan bingkai pada sekelompok teks maupun gambar yang ada pada postingan maupun pada sidebar, maka blog akan tampak menjadi rapi, menarik dan menyenangkan. Hasil yang dimaksud seperti yang ditunjuk oleh panah pada gambar di samping (bingkai pada sidebar). Karena itu, lagsung saja dipraktekkan seperti langkah berikut. 

Dengan cara yang sangat mudah dan sederhana seperti berikut, semua Gadget yang telah ada maupun yang akan ditambahkan pada sidebar akan menjadi berbingkai secara otomatis. Adappun langkah-langkah  Cara Membingkai Area Posting bisa diikuti seperti berikut ini.

Cara Membuat Border / 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

Cara membuat Border / Frame / Bingkai Pada Sidebar BLOG

1).. 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 (contoh hasil penemuan kode seperti gambar berikut)

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

Demikian artikel mengenai Cara Membingkai Area Posting dan Sidebar, semoga saja bisa memberikan manfaat siapa saja yang memerlukan tutorial ini.

Artikel Terkait