-->
  • Privacy Policy
  • Contact Us
  • Disclaimer

Blogger Pontang

SHARE TRIK DAN TIPS | SCRIPT PHP | FREE HOSTING | BISNIS | JAVA SCRIPT | SEPUTAR BLOGSPOT | INFO UNIK DAN LAINNYA

Mengenai Saya

My photo
Faqih
View my complete profile
Powered by Blogger.
  • Home
  • Privacy Policy
  • Contact Us
  • Disclaimer

Sunday, 3 January 2010

Mengganti Background Dengan Gradient Image

mechanical_warfare_800x600 Salah satu cara agar pengunjung betah berlama-lama di blog kita adalah dengan menggunakan template yang menarik. Selain kecepatan loading blog juga tentunya sangat berpengaruh pada pengunjung blog, template yang menarik tentu akan sedikit menambah bumbu dalam blog kita.

 

Untuk membuat template yang menarik, salah satunya dengan konsep pewarnaan judul postingan, background postingan atau judul sidebar dengan background template yang pas.

 

Untuk membuat background blog, kita bisa menggunakan fasilitas dari http://tools.dynamicdrive.com/gradient. Dengan tools tersebut, kita bisa membuat gambar gradasi, contoh gambar gradasi bisa sobat lihat dibawah ini :

 

gradasi 2 gradasi 1

 

Baiklah, daripada pusing kita langsung praktek aja ya !

  • Langsung saja tuju web layanan gradient image maker, masuk ke gradient dari dynamicdrive.
  • Pada halaman depan sobat, pilih model gradasi yang akan sobat gunakan

     

    pilih model
  • Pilih saja model yang pertama, kemudian isi gradient width dengan 10, dan gradient height dengan 800 ( angka ini tidak mutlak harus 10 dan 800, sesuaikan dengan keinginan sobat saja ).

     

    color

     

    Pilih warna untuk top color dan bottom color, ingat warna yang bottom color karena akan kita letakkan di template kita nantinya.
  • Jika sudah, sekarang klik Get full size image, dan sobat simpan gambar yang sudah jadi di komputer.
  • Upload gambar tersebut ke hosting yang akan sobat gunakan, bisa menggunakan photobucket, google sites atau jika ingin yang lebih mudahnya sobat bisa membuat blog baru dengan blogspot, khusus untuk menyimpan gambar, seperti yang selama ini saya lakukan.
  • Sebagai contoh gambar yang sudah jadi bisa sobat lihat dibawah ini :

     

    gradasi 3 
  • Coba klik Kanan pada gambar diatas, lalu pilih properties. Perhatikan Image Properties, pada location ada url yang kemudian akan kita gunakan pada background blog nantinya.

     

    image

 

Langkah selanjutnya adalah proses mengganti background template-nya :

  • Login ke blogger dengan ID sobat
  • Klik tab Edit HTML
  • Cari kode seperti berikut (biasanya terletak di bagian atas) :
  • body { width:980px; background:#FFFFFF; font:12px verdana,arial,sans-serif; text-align:left; color:#000; margin:0 auto; padding:0 }
  • Kemudian ganti sehingga menjadi seperti berikut :
  • body { width:980px; background:#000000 url(http://lh5.ggpht.com/_7Y9pl24WpQY/S0C5snca_2I/AAAAAAAACoo/9eZ3Rd5PIOE/gradasi%203_thumb%5B4%5D.jpg?imgmax=800) repeat-x; font:12px verdana,arial,sans-serif; text-align:left; color:#000; margin:0 auto; padding:0 }
  • Kemudian Simpan Template.

 

Eleman apa yang harus di tambahkan ?

#000000 url(http://lh5.ggpht.com/_7Y9pl24WpQY/S0C5snca_2I/AAAAAAAACoo/9eZ3Rd5PIOE/gradasi%203_thumb%5B4%5D.jpg?imgmax=800) repeat-x;

 

Kode yang berwarna merah sobat ganti dengan url tempat sobat mengupload gambar gradasi-nya.

 

Mengapa saya mengganti warna putih (#FFFFFF) dengan warna hitam (#000000)? karena pada saat membuat gambar gradasi, saya menggunakan bottom color dengan warna hitam (#000000).

 

Baiklah, itu saja kira-kira tutorial blog kali ini, semoga berhasil mengganti background template dengan gambar gradasi-nya. Nerd 

Sejarah pada tanggal 07:37

No comments:

Post a Comment

‹
›
Home
View web version

About

Search Engine Optimization

Patner Links

  • Google Blogs
  • Catatanku

Follow by Email

Subsribe to get post update from this blog in your email inbox.

Copyright © Blogger Pontang. Redesign by You Must Know