Memberi Efek Border Pada Gambar Postingan Blog
Diupdate
oleh
Mr. G
--
Memberi Efek Border Pada Gambar Postingan Blog. Salah satu yang sering menjadi perhatian para blogger, selain artikel yang disajikan dalam blognya adalah tampilan blog. Tampilan blog yang menarik tentu akan mebuat pengunjung yang datang menjadi berkesan. Namun memberikan banyak efek tampilan yang berlebihan juga akan membuat pengunjung kadang merasa terganggu, untuk itu usahakan untuk memasang widget dan juga efek yang lain secara sewajarnya saja.
Pada kesempatan ini, saya akan membagikan sebuah efek yang bisa digunakan untuk sekedar mempercantik tampilan blog, terutama pada tampilan gambar yang ada didalam postingan. Efek border pada gambar postingan ini sedikit akan membuat gambar yang ada dalam postingan lebih menarik dan tentunya juga tidak akan memberatkan loading blog saat dibuka.
Adapun tampilan gambar dalam postinngan, bisa Anda lihat dalam gambar dibawah ini, pada tepi gambar terdapat border dengan warna abu-abu dan putih yang melingkari gambar.
Pada kesempatan ini, saya akan membagikan sebuah efek yang bisa digunakan untuk sekedar mempercantik tampilan blog, terutama pada tampilan gambar yang ada didalam postingan. Efek border pada gambar postingan ini sedikit akan membuat gambar yang ada dalam postingan lebih menarik dan tentunya juga tidak akan memberatkan loading blog saat dibuka.
Adapun tampilan gambar dalam postinngan, bisa Anda lihat dalam gambar dibawah ini, pada tepi gambar terdapat border dengan warna abu-abu dan putih yang melingkari gambar.
Cara Membuat Efek Border Pada Gambar Postingan
1. Silahkan masuk ke dashboard blogger Anda.
2. Pilih template lalu pilih edite template
3. Silahkan Tekan CTRL + F Untuk memudahkan pencarian
4. Cari kode : ]]></b:skin> atau kode : </style>
5. Setelah ketemu copy kode dibawah ini dan paste tepat di atas kode : ]]></b:skin> atau kode : </style>
/* border all images */
.post-body img{background-color:#F0EFEF;border:3px solid #CACECF;margin:0 4px 2px 0;padding:4px;border-radius:6px;}
.post-body img{background-color:#F0EFEF;border:3px solid #CACECF;margin:0 4px 2px 0;padding:4px;border-radius:6px;}
6. Untuk merubah warna border, silahkan ganti kode warna merah dan hidau dengan kode warna yang Anda inginkan.
7. Untuk memperbesar tampilan bordernya silahkan Anda rubah ukuran pixelnya.
Demikian postingan singkat kali ini, mengenai cara Memeberi Efek Border Pada Gambar Postingan Blog, semoga ada manfaatnya. Salam blogger and happy blogging.
7. Untuk memperbesar tampilan bordernya silahkan Anda rubah ukuran pixelnya.
Demikian postingan singkat kali ini, mengenai cara Memeberi Efek Border Pada Gambar Postingan Blog, semoga ada manfaatnya. Salam blogger and happy blogging.
Ada pertanyaan?
Diskusikan dengan penulis atau pengguna lain