Masang Blog - kali ini akan membahas trik dan tips Cara Mudah Merubah Warna Template Pada Blog lengkap dengan gambar jadi saya yakin anda tidak akan kesulitan untuk mencobanya..
Kenapa saya katakan cara mudah? Karena pada cara ini anda tidak harus mahir dalam hal pengkodean CSS maupun HTML. Tentu ini sangat cocok bagi para blogger newbie untuk merubah warna pada template blog.
Sebelum ke caranya, Saya disini menggunakan tool bawaan browser Mozilla 33.0, jika anda mau mempraktekannya yuk samakan dulu pake mozilla 33.0 ingat versinya minimal 33.0. Karena di versi tersebut kita akan menemukan pilihan warna langsung dari tool tersebut. Bagi mozilla yang jadul mungkin agak ribet cari kode warna di google kesana kemari.
Sebenarnya anda juga bisa menggunakan browser Google Chrome, sama kok untuk warna sudah disediakan di toolnya.
Langsung saja, cekidot
- Pertama, siapkan dulu login ke blog anda dan masuk ke menu Template dan klik Edit HTML. Biarkan saja tab nya jangan sampai di close. Lalu buka blog di new tab pada browser anda. Saya pada kali ini praktek menggunakan blog ini masangblog.blogspot.com.
- Kedua, pada halaman blog klik kanan dan pilih Inspect Element, lalu di bawah browser anda akan muncul seperti di gambar berikut:
- Di tahap ke tiga ini saya kasih contoh akan merubah warna pada navbar blog saya. Cara-cara urutannya lihat di gambar.
Keterangan: Klik nomor satu dulu lalu arahkan kursor ke objek yang mau di rubah. Jika mau merubah menu navigasi maka kursor arahkan ke navigasi. Lalu di nomor 3 ada kode CSS untuk navbar yang telah anda klik. disana anda akan menemukan kata-kata seperti width (lebar) height (tinggi) background (latar yang di dalamnya ada warna) dan margin.
- Karena kita akan merubah warna pada navbar maka fokus kita adalah pada element yang bernama background. Jika anda lihat maka di background memang ada WARNA yang bisa anda klik dan rubah ke warna yang sesuai anda inginkan. Kita coba yuk klik warna nya dan kita RUBAH ke warna yang kita inginkan menjadi seperti ini:
Lihat menu warna navigasi berubah warna menjadi ungu tua - Pada tahap ini anda sudah memahami dan melihat seberapa jauh warna pada TEMPLATE anda dan anda sudah mencoba mengganti warna pada navbar.
Nah dengan anda merubah warna background di atas belum berarti anda sudah merubah warna pada template yang sesungguhnya. Jika anda ingin merubahnya secara real maka anda harus merubah pada edit template pada blog anda. Anda belum meng-close kan sesuai saran saya di atas?
Ok langsung saja ke tahap penerapan ke blog-nya
Cara mengganti warna pada template blog
Kita masih dalam merubah navbar, pada contoh di blog saya.
- Pertama anda harus tau posisi di manana letak background yang akan di rubah tadi, caranya anda copy nama element-nya yaitu #NavbarMenu, Seperti di gambar:
- Lalu kembali ke edi HTML dan cari nama #NavbarMenu. Ingat cara cari nama atau kode pada edit HTML adalah Ctrl+F.
- Jika nama #NavbarMenu hasilnya lebih dari satu maka caranya lihatlah yang kode-kode setelahnya sama.
- Setelah anda menemukan #NavbarMenu yang pas selanjutnya anda ganti kode warna yang berada setelah tulisan "background". Misal asalnya begini background:none repeat scroll 0% 0% #4C66A4; (warna biru) lalu anda rubah menjadi background:none repeat scroll 0% 0% #410836; (warna ungu).
- Kode warna background:none repeat scroll 0% 0% #410836 dapatnya dari hasil copy dari sini:
- Jika sudah di rubah maka tinggal save di edit template tersebut dan lihat hasilnya warna navbar sudah berubah asalnya biru menjadi ungu.
Sebenarnya cara ini sangat mudah dan simple namun jika saya jelaskan lewat kata-kata jadinya agak sedikit ribet. Jika anda sudah mempraktekannya maka saya yakin yang ke dua kalinya anda sudah mahir.
Jika sudah bisa anda bisa merubah warna pada bagian mana saja pada template anda, seperti merubah warna font, warna background pada body, warna sidebar dll.
Sekian Cara Mudah Merubah Warna Template Pada Blog semoga membantu mempermudah merubah tampilan warna template anda.
loading...
0 Response to "Cara Mudah Merubah Warna Template Pada Blog"
Posting Komentar