Desain Template Blogger: Mulai Membuat Template Blogger Anda Sendiri

Desain Template Blogger: Tutorial 11
<< Tutorial 10: Membuat Template 3-Kolom atau Lebih ...
>> Tutorial 12: Cara Meletakkan Foto sebagai Latar Belakang
kembali ke Daftar Isi



Setelah memahami dan mengerti tutorial-tutorial sebelumnya, saatnya untuk membuat dan merancang template sendiri di Blogspot. Dalam tutorial ini, saya akan memberikan langkah-langkah untuk membuat template sendiri secara cepat dan dengan mudah.


Hal pertama yang perlu Anda pahami tentang merancang template adalah bahwa teknik desain itu unik dan berbeda tiap individu. Pada akhirnya, sepenuhnya terserah bagaimana Anda melakukannya - jika dan hanya jika Anda telah terbiasa dan telah membuat beberapa template sendiri. Tetapi jika Anda baru memulai, lebih baik mengikuti panduan langkah demi langkah untuk mempercepat proses sehingga Anda tidak tersesat.

Langkah 1: Pilih template yang sudah jadi sebagai acuan: 

Sebagai pemula, cara yang termudah dan tercepat untuk merancang template adalah memulainya dengan template yang sudah ada. Tetapi jangan melakukannya dengan maksud untuk menjiplak itu.
Pilihlah template sebagai acuan yang dekat dengan tujuan dari template yang akan dirancang. Pemilihan template sebagai acuan ini dimaksudkan agar kita tidak menuliskan kode-kode template dari awal dan menghindari terlibat dengan urusan programming.

Tetapi ketika melakukan ini, tidak bermaksud untuk melakukan pengkodean sedikit dan kemudian mengklaim bahwa versi terakhir adalah desain sendiri, itu Salah dan Tidak Etis. Template awal hanyalah titik awal untuk membantu proses pengkodean. Template awal yang berguna untuk acuan adalah bagian Body (yang menetapkan tata letak keseluruhan / layout dan jumlah kolom) , kode CSS (misalnya # main-wrapper,. Sidebar, # sidebar2, blog-pager, dll) dan beberapa 'default' kode yang tidak boleh dimodifikasi atau dihilangkan.

Ketika Anda memilih template awal, saya akan saran Anda untuk memilih template yang relatif sederhana untuk membantu Anda melalui proses desain dengan mudah. Jika Anda tidak yakin mana template untuk memulainya, Anda dapat menggunakan Generik Blogger, sebuah 3-column template dasar. Jika Anda ingin menggunakan template 2-kolom, baca Tutorial 10 untuk mengetahui bagaimana memodifikasi template ke template 2-kolom atau mengubah lokasi sidebar.

Langkah 2: Menetapkan Jumlah dan Letak Kolom di Sidebar:

Jika seorang pemula, pastikan memulai dengan template yang mirip dengan desain yang akan dirancang, misalnya jika ingin merancang template 3 kolom, jangan beracuan dengan template 2 kolom. Jika ingin menambah atau mengubah sidebar, baca Tutorial 10 tentang membuat template 3 kolom.

Langkah 3: Menetapkan Lebar Kolom:

Hal pertama yang perlu dilakukan setelah mendapatkan template awal sebagai acuan adalah mengatur lebar dari template. Untuk mengatur lebar yang perlu dilakukan adalah memodifikasi kode di CSS, baca Tutorial 7: mengatur ukuran template. Bagian yang biasanya untuk mengatur lebar adalah

  • body
  • outer-wrapper
  • content-wrapper
  • header-wrapper
  • main-wrapper
  • sidebar-wrapper (atau sidebar1, sidebar2, dan selanjutnya)
  • footer-wrapper
Pengaturan lebar yang sedikit rumit adalah yang ada di container-wrapper karena didalamnya terdapat bagian Main dan Sidebar, jika lebar tidak diatur dengan baik, maka Sidebar dapat berada dibawah Main.

Langkah 4: Menguji:

Jika merancang template yang baru, maka kita harus tahu bahwa perubahan yang kita lakukan telah mengubah rancangan sesuai dengan yang diinginkan. Bagaimana mengujinya? yaitu dengan mengirimkan artikel yang memiliki kutipan (blockquote), daftar bernomor, daftar tidak bernomor dan membuat beberapa widget untuk melihat bahwa tampilan sidebar sesuai dengan yang diinginkan.

Langkah 5: Memodifikasi kode CSS untuk mengubah tampilan:

Disinilah kita memulai mengutak-atik kode CSS, untuk menyesuaikan tata letak blog dan tampilan sesuai dengan yang diinginkan. Proses ini biasanya memakan waktu yang paling lama, kita akan bolak-balik memodifikasi kode karena hal yang sangat jarang untuk langsung mendapatkan sesuatu yang sempurna untuk pertama kali. Baca Tutorial 4: Struktur Bagian Kode CSS, Tutorial 5: Mengatur Properti Kontainer di CSS dan Tutorial 6: Bagian dan Elemen Umum dalam Template Blogger.

Langkah 6: Menguji di browser lain:

Cara ini sebenarnya sangat menjengkelan dan menjenuhkan, tetapi harus kita lakukan, kenapa?
Dikarenakan yang lihat web yang telah kita rancang nantinya sangatlah bervariasi, ada pengguna opera, firefox, internet explorer dan lain-lain, dan kadang kala tampilan yang kita rancang akan bagus di browser yang satu tetapi belum tentu untuk browser yang lain, untuk itulah uji coba perlu dilakukan agar web kita terlihat bagus untuk dilihat oleh semua orang.
Ada tool yang bagus untuk menguji tampilan website agar kompatibel disemua browser, cobalah uji di Browsershots.org.

Langkah 7: Menggunakan gambar sebagai latar belakang:

Jika bosan dengan menggunakan warna yang polos ditemplate kita, kita bisa menggantinya dengan gambar. Gambar ini dapat digunakan sebagai latar belakang dari keseluruhan template atau untuk bagian-bagian tertentu saja, misalnya Post, Sidebar, Footer, Header, dll. Bagian ini dibahas di Tutorial 12: Memodifikasi kode dalam penggunaan gambar sebagai latar belakang.

Langkah 8: Menyelesaikan Template:

Langkah ini adalah langkah yang terakhir, yaitu menguji template, melihat dengan hati-hati tampilan blog dan memeriksanya apakah semua kode yang dituliskan dapat bekerja dengan baik atau tidak.



___________________
Sumber: Our Blogger Templates
Download template Generik dari mediafire

Artikel Sejenis



1 comment:

Pembaca Setia

Apakah artikel dalam blog ini bermanfaat bagi anda?

Berlangganan

cek email anda untuk link verifikasi berlangganan setelah menekan tombol submit
 
If you're on a slow connection, try Mobile Version
Copyright 2014 WHIZ group. Layout Design By Anshul Dudeja. All Right Reserved.