Cara Edit atau Modifikasi Template Blog/Website Agar Tampilan Lebih Sempurna dan Rapih

Mengedit atau memodifikasi tampilan blog itu menyenangkan tapi kalu masih pemula pusingnya minta ampun dan sebenarnya tidak sulit jika kita mengetahui sedikit banyak tentang script CSS (Cascading Style Sheets), HTML, dan Javascript. Hal tersebut ingin kita lakukan biasanya karena ingin membuat tampilan blog agar lebih keren, memberi warna dan suasana baru, atau mungkin kita bosan dengan tampilan blog yang itu-itu saja.

Membaca script / kode tentu adalah hal yang menyebalkan terkhusus untuk blogger pemula termasuk Saya dulunya. Namun bila kita mengerti sedikit banyak tentang kode itu, hal yang tadinya menyebalkan bisa menjadi menyenangkan loh bahkan ampe pacar sendiri di lupakan. Langsung saja simak cara / tutorialnya berikut ini.

1. Masuk dan Login ke Akun Blogger Anda

2. Buka Blog yang Anda Edit > pada menubar Blogger sebelah kiri klik Template > pada Menu Template klik EDIT TEMPLATE

3. Sejenak tinggalkan dulu Edit Template sekarang Buka Blog Anda di Browser misal :www.informasiwowfakta.blogspot.com > setelah tampil Klik kanan bagian yang di Edit > pilih > Periksa Element/Inspect Elemen

• Untuk pengeditan Saya sarankan menggunakan browser Mozilla Firefox karena untuk memodifikasi CSS lebih mudah dan leluasa, atau Chrome juga tidak masalah.
• Kode HTML yang sebelah kiri, dan kode CSS yang disebelah kanan Inspect Element.
• Mengedit kode HTML dengan klik kanan kode HTML yang diinginkan,  kemudian Edit As HTML, atau tekan F2 saja pada kode tersebut. Maka tampilannya seperti pada Gambar 1 (Lihat dibawah postingan).
• Mengedit kode CSS yaitu klik Property / Value CSS yang ada disebelah kanan Inspect Elemen, kemudian ganti atau modifikasi sesuai keinginan. Pada contoh dibawah ini, Saya mengganti value / nilai dari warna background elemen .menu. Contoh pada Gambar 2 (Lihat di bawah postingan).
• Pengguna Firefox, pada bagian inspect element, pilih Style Editor/ Editor Gaya, untuk fokus ke pengeditan CSS. Editing HTML nya pada Inspector / Inspektur tab Inspect Element. Contoh pada Gambar 3 (Lihat di bawah postingan).
• Pilih style utama blog Sobat yang hendak diedit, atau periksa satu persatu kumpulan CSS yang ada disebelah kiri gambar berikut. Silahkan Sobat, mengotak atik CSS yang ada pada kolom tengah. Contoh pada Gambar 4 (Lihat di bawah postingan).
• Jangan sungkan untuk menghapus atau menambahkan kode pada CSS maupun HTML, karena pengeditan ini sifatnya sementara saja, dan hanya terjadi pada komputer Sobat.
• Tetap lanjutkan saja pengeditan, jika sudah menemukan atau menyelesaikan desain yang diinginkan, save atau salin kode HTML dan CSS yang baru tersebut, ke Edit HTML yang ada pada Blog sobat, search saja di blog dengan CTRL+F agar memudahkan menemukan kode yang akan diganti.
• Dan lagi lagi, jangan berhenti berusaha mencoba terus menerus, jika belum berhasil coba dan coba lagi, karena semakin sering kita menemukan masalah dan memecahkannya, semakin banyak pula pengalaman kita dalam mendesain web.
• Gunakan juga tool color generator dan editor HTML CSS blog ini, yang mungkin memudahkan Sobat dalam pengeditan.

Atau bisa juga Anda mengedit lewat ADIT HTML langsung dengan cara :

1. Pada menubar Blogger sebelah kiri klik Template > pada Menu Template klik EDIT TEMPLATE

 2. klik arah panah hitam di samping kiri untuk membuka kode kalanjutannya

Catatan :

Kode yang Arsir adalah kode untuk membuat menu breadcrumb

Silakan kretifitaskan ketrampilan Anda untuk membuat dan mendesain blog sebagus mungkin

Selamat berpusing-pusing.......

Share on Facebook

Share on Twitter

Share on Google+

Share on LinkedIn

Subscribe to receive free email updates: