Menambahkan Efek Bayangan pada Template Johny Wuss Versi 2

Posted by

As salamu 'alaikum, sohib Van D Teach!
Kali ini ane mau sharing tentang bagaimana caranya menambahkan efek shadow alias bayangan di latar belakang (background) blog sohib.
Ini khusus buat template Johny Wuss responsive versi ke dua ya!
Kalau mau cari buat Johny Wuss versi sebelumnya bisa berkunjung ke blog SEOCIPS yang akan memandu sohib sekalian sampai selesai.

Menurut SEOCIPS, kita harus cari kode CSS-nya blog kita dulu. Cari kode #outer-wrapper {
Pas nyari itu, bingung. Eeeh... ternyata beda versi toh templatenya.

Gambar 1.1. Efek bayangan untuk memperindah tampilan blog sohib.
Berawal dari bingung itulah. Mau nanya ke orang terdekat ngga ada yang tahu. Okelah kalau begitu, ane coba ngakalin bermodalkan browser Mozilla Firefox. Caranya?

Pertama
Coba sohib buka web demo-nya (pastinya yang punya bayangan ya!).

Kedua
Sohib klik kanan web itu dan pilih 'lihat sumber laman' atau 'view page source'.

Ketiga
Nah, browser Mozilla Firefox sudah membuka kode HTML dan CSS blog tersebut. Sohib cari deh kode yang dimaksud, caranya?

Keempat
Nah, caranya... Sohib pencet tombol Ctrl dan F di keyboard sohib. Kemudian ketikkan kodenya .outerpic-wrapper{background:#fff;

Kelima
Nah, ternyata ada. Bukalah edit HTML blog anda. Tambahkan kode box-shadow: 0 10px 10px #999;-moz-box-shadow: 0;overflow: hidden;-webkit-box-shadow: 0 10px 10px #999; SETELAH kode
.outerpic-wrapper{background:#fff; SAMPAI kode width:100%;

Keenam
SELESAI

Semoga artikel ini bermanfaat bagi sohib semua.


Blog, Updated at: 17:39

0 comments:

Post a Comment

1. Komentar ini dapat menggunakan akun Wordpress, anonim, dan OpenID.

2. Mohon kritik dan saran demi meningkatkan kualitas artikel blog ini.

3. Diperbolehkan berkomentar menggunakan link aktif yang bermanfaat (bukan jual beli).