Cara Membuat Template Blog Sendiri dari Awal Sampai Professional

masnasih.com - Halo Sob. Kali ini saya akan share tentang bagaimana Cara Membuat Template Blog Sendiri dari Awal Sampai Professional dan menghasilkan template yang responsive, keren, seo friendly, dan fastest. Banyak temen-temen blogger yang bertanya-tanya tentang hal ini, karena blogger pemula seringkali merisaukan masalah tampilan.

Masalah ini mungkin terlihat sepele, tapi berdampak sangat fatal bagi kelangsungan hidup sebuah blog. Biasanya temen-temen blogger pemula menginginkan template blog yang mereka anggap paling bagus, keren dan sempurna, tapi setelah mencari kemana-mana mereka tak menemukannya, akhirnya mencoba untuk membuatnya sendiri.

Nah disini masalahnya. Mungkin bagi mereka yang basic nya adalah orang IT, hal ini tidak terlalu bermasalah. Namun jika mereka adalah orang yang tidak punya basic IT, tentunya akan menghabiskan banyak waktu untuk belajar dasar-dasar ilmu web developer, dan mereka akan sibuk dengan belajar membuat templatenya daripada membuat konten blognya. 

Dari sini saya tergelitik untuk membuat artikel ini, karena saya rasa artikel ini adalah jawaban dari permasalahan temen-temen pemula yang ingin membuat template blog, dan belum mempunyai basic IT. Saya sendiri tidak punya riwayat pendidikan dengan jurusan IT, tapi dengan bersusah payah mempelajari semuanya dari nol (berbagai macam situs web yang membahas Web Developmen baik dalam negeri maupun luar negeri sebagian sudah saya pelajari), dan akhirnya saya menemukan pola sederhana dari pembuatan template blog yang luar biasa.

Cara Membuat Template Blog Sendiri dari Awal Sampai Professional

Sebelum saya share pola sederhana dari pembuatan template blogger. Saya ingin menjawab beberapa pertanyaan yang sering diajukan oleh temen-temen blogger yang mungkin sampai sekarang belum terjawab pertanyaannya.

Bagaimana Cara Membuat Template Blog Sendiri Online?

Jika kamu ingin membuat template online sendiri berikut ini adalah situs web yang bisa kamu manfaatkan. Tapi apakah ini masih work apa nggak, saya kurang tau karena saya cuma mengambil referensi dari situs lain yang artikelnya di posting pada tahun 2012.

Profil Brand (sudah nggak work)

Profilebrand {http://www.profilebrand.com/blogger-templates/} : disini tersedia fasilitas edit template gratis, kebanyakan templatenya bertema jaringan sosial ( facebook, twitter, myspace dll ) 

Pimp My Profil (masih work)

Pimp my Profile {http://www.pimp-my-profile.com/generators/blogger.php} : Di situs ini kamu bisa membuat template blog, Myspace, dan friendster. Tapi sepertinya templatenya nggak responsive alias jadul.

Do Template

DoTemplate {http://www.dotemplate.com/dt/viewThemes.do?i=0} : Disini ada 12 template XHTML dan CSS compliant dasar yang dapat kamu pilih sesuka hati. Kamu juga bisa mengubah warna, font, teks, posisi teks dan sebagainya pada background, container, footer, menu dan boks. Tak cukup sampai disitu, kamu juga bisa memberi efek seperti drop shadow, gradien dan round corner. Ada juga pilihan untuk mengupload gambar dari PC. Setelah selesai mendesainnya, Template siap di download. Pastika koneksi internet stabil karena saya udah nyoba kok lemot :D

CSSEZ

CSSEZ {http://cssez.com/} : Situs ini adalah generator template online buat blog wordpress dan movable type. Jadi ini bukan buat blogger ya. Kalo mau nyoba bisa registrasi dulu. Disini kamu bisa, mengatur lebar kolom, padding, margin, border, font dan style link. Fitur Lainnya adalah bisa mengupload gambar.

Drupal Theme Generator

Drupal Theme Generator {http://xlecom.com/?q=node/152} : Situs generator theme ini berbasis MS Excel untuk situs atau blog drupal yang menggunakan template PHP dan Xtemplate (Bukan buat blogger). Fitur-fiturnya adalah generator theme random color, preview theme secara langsung, html color assistant, dan integrasi CSS, javascript, PHP dan kode html pada theme dari file eksternal dan masih banyak lagi. 

Eris Template Generator

Eris Template Generator {http://www.erisfree.com/d2/apart.php} : Situs Web Generator ini menyediakan 11 Tampilan buat blog kamu dengan tiga pilihan kolom tampilannya. Layanan ini mendukung diaryland, diary-x, movabletype, blogger, wordpress, b2 dan free html site template lainnya. Kamu bisa menambahkan tagline, meta tag dan termasuk link ke index, arsip, email, notes, profile, buddylist dan juga 5 entri untuk diaryland, 10 entri untuk movable type, kalender untuk b2, blogroll untuk wordpress, XHTML compliant dan content copyright, webring, chat screen name dan button. Wah banyak banget ya.

Firdamatic

Firdamatic {http://www.wannabegirl.org/firdamatic} : Situs Web Generator template online untuk blogger dan movable type ini mempunyai pilihan dua kolom dan tiga kolom, kamu dapat mengisi informasi pada boks relevan di form online yang tersedia dan klik generate template, selain itu kamu juga bisa menambahkan judul situs, url gambar dan memilih huruf dan warnanya.

Make Template

www.maketemplate.com {http://www.maketemplate.com/} : Situs Web Online generator ini bisa untuk membuat template situs PHP, bersamaan dengan file CSS dan HTML. Kamu juga dapat mengkustomisasi style sheet, header, sidebar, dan footer dengan menambahkan sendiri font, warna, margin dan alignment pada form online template generator. Kamu juga dapat membuat sendiri scriptnya yang bisa kamu kopi dan simpan untuk keperluanmu.

PsycHo

PsycHo {http://psyc.horm.org/} : Situs Web Generator online template open source ini bisa diaplikasikan pada platform blogger, persian blog, dan blogFa. Kamu bisa mengatur sendiri judul halaman, warna background body template, judul background, deskripsi, teks, spacing dan memilih sampai 4 pilihan kolom. Ada fitur preview templatenya dan menyimpan kodenya. 

Templatr

Templatr {http://templatr.cc/} : Situs web ini menyediakan lebih dari 21 layout dan pilihan formatting untuk berbagai elemen halaman termasuk halaman utama, header, footer, titles, margin, padding, border dan banyak lagi untuk keperluan wordpress blog (bukan blogger ya). Selain itu, layanan ini juga menyediakan upload, kamu bisa mengupload grafis/gambar dan mendownload template setelah selesai Template pun siap digunakan.

Weebly

Weebly {http://www.weebly.com/} : Situs Web Generator template yang rapi ini memiliki 15 desain pre-built yang bisa kamu kustomisasi dengan menambahkan elemen seperti iklan, feed icon, map, contact form, teks dan layout gambar, kolom google dan youtube video dan lain sebagainya. Setelah selesai membuatnya, kamu bisa mempublikasikan situs/blog tersebut di blogmu.

Wordpress Them Generator

WordPress Theme Generator {http://www.yvoschaap.com/wpthemegen/} : Layanan generator online yang bisa membantumu untuk membuat theme wordpress sendiri dengan mudah tanpa pengetahuan html dan css language. Layanan ini menyediakan berbagai pilihan seperti memilih sendiri nama blog, ukuran body, lokasi sidebar dan ukurannya, menambahkan kolom ketiga, layout menu, warna dan skema teks, kamu juga dapat menambahkan tag cloud, arsip dan kotak pencarian. Ada juga fitur mengupload logo blog kamu secara online dan membuat link-nya dari template. Setelah selesai, kamu dapat mempreview dan mendownloadnya dalam file zip.

Silakan dicoba sendiri Sob. Bingung mau milih yang mana kan? hehe..

Yuk lanjut ke pertanyaan kedua.

Bagaimana Cara Membuat Template Blog Sendiri dari Awal?

Untuk membuat template blog dari awal tentunya kamu harus belajar dulu basic-basic ilmu web developer seperti belajar HTML, CSS, PHP, dsb.. Kalo tujuan kamu adalah membuat template blogger kamu tidak perlu belajar PHP karena di blogger tidak menggunakan PHP. Selanjutnya akan saya bahas di poin inti.

Lanjut ke pertanyaan ketiga

Bagaimana Cara Membuat Template Blog dengan Software?

Ada beberapa Software yang bisa kamu gunakan untuk membantu mempermudah dalam pembuatan template blog. Berikut ini adalah Software Pendukung :

• Photoshop (Buat desain contoh/sampel tampilan template yang kamu inginkan)
• Dreamweaver (untuk membuat template, disini banyak fiturnya dan lengkap banget, tapi kalo tujuan kamu adalah membuat template blogger, kamu tidak cukup jika hanya menggunakan aplikasi ini, kamu harus belajar bahasa tema yang digunakan di blogger. Di pembahasan inti nanti akan saya sampaikan).
• Notepad (untuk membuat/edit template secara manual)
• dsb

Jadi, sofware tersebut hanyalah alat pendukungnya saja yang mungkin jika diterapkan di blog akan berbeda.

Pertanyaan Keempat

Bagaimana Cara Membuat Template Blog Sendiri dengan Notepad?

Ini sudah terjawab di atas. Dengan menggunakan software ini artinya kamu membuat template secara menual dan harus menguasai kode-kodenya. 

Pertanyaan Kelima

Bagaimana Cara Membuat Template Blog Sendiri dengan Photoshop?

Photoshop hanyalah untuk mendesain contoh templatenya atau hasil akhir yang diinginkan. Bukan untuk mendesain templatenya itu, Paham Nggak? jadi cuma sampel tampilannya aja.

Pertanyaan Keenam

Bagaimana Cara Membuat Template Blog Sendiri dengan Dreamweaver?

Sudah saya sampaikan juga, kalau tujuanmu adalah membuat tempate blogger. Maka tidak akan cukup jika hanya menggunakan software ini, karena bahasanya berbeda.

Pertanyaan ketujuh

Bagaimana Cara Membuat Template Blog dari Android?

Hehe... kalo ini juga manual, Saya juga pernah membuat template blog dengan android, Pake aplikasi notepad. Ribet Sob.

Pertanyaan Kedelapan

Bagaimana Cara Membuat Template Blogger dengan Bootstrap?

Tetep aja, nggak semudah yang kamu bayangkan sob, membuat template dengan menggunakan bootstrap tidak 100% bisa membuat template blogger yang siap digunakan. Kamu harus mempelajari bahasa lain yang di gunakan oleh blogger. Karena, Fungsi Bootstrap adalah untuk membuat tampilannya saja bukan membuat templatenya. Jadi, Ibaratnya Bootstrap adalah kuli bangunannya dan bahasa template blogger adalah materialnya. Secanggih apapun seorang kuli bangunan, kalo dia disuruh untuk membuat rumah menggunakan air saja tentunya nggak bisa kan? Pasti butuh semen, pasir dsb. Mungkin itu kiasan sederhana menurut saya (red..).

Pertanyaan terakhir

Dari Tadi Muter-muter nggak Jelas, Mana pembahasan intinya?

Hehe... Oke Google. saya puter-puterin biar kamu tau dulu rasanya belajar dari awal. Kalo kamu membaca artikel ini saja tidak kuat, maka jangan berharap untuk bisa membuat template keren seperti template yang sudah saya buat (Keren dari hongkong).

Baiklah. berikut ini adalah tips yang saya tulis berdasarkan pengalaman saya, yaitu berupa pola sederhana untuk membuat template blogger keren, responsive, simple, fastest, seo friendly dsb.

Sebelum kamu melanjutkan membaca, Silakan Subscribe/berlangganan blog ini dulu melalui kolom subscribe di sebelah kanan atas (untuk pc/laptop) dan di bawah postingan (untuk tampilan HP), biar saya tambah semangat membuat artikelnya. 

Setelah berlangganan. Silakan lanjutkan membaca.

Cara Membuat Template Blog Sendiri dari Awal Sampai Professional

Peralatan yang diperlukan :

1. PC/Laptop (Recomended), Smartphohe (Not Recomended)
2. Koneksi Internet (yang kenceng ya)
3. Software Browser (mozzila, chome [Recomended])
4. Makanan dan minuman secukupnya hehe...

Materi yang harus kamu kuasai (minimal dasar-dasarnya) adalah :

1. HTML (Kamu bisa belajar di W3Schools.com)
2. CSS (Bisa belajar di) w3scools
3. Javascript (w3scools)
4. Bahasa Blogger (nggak tau bahasa apa) disinilah bahasa yang jarang diketahui oleh temen-temen blogger. Sedikit sekali atau bahkan hanya ada satu dua blogger yang menulis bahasa ini. Saya menemukannya di Blognya dte.web.id (Punyanya Mas Taufik Nurrohman) Blog paling lengkap pembahasannya menurut saya. Silakan dicek sendiri.

Okelah ini dia materi inti dari artikel ini.

Jadi, untuk membuat template blogger seperti template yang saya pakai ini langkah-langkah benarnya adalah seperti ini.

Ambil kerangka template blogger yang responsive

Buka dte.web.id dan cari kerangka yang disediakan oleh Mas Taufik. Ada dua pilihan yang bisa kamu pilih yaitu kerangka template 2 kolom dan kerangka template 3 kolom. Pilih salah satunya. Kalo saya pakai yang 2 kolom. Atau bisa mengikuti Link ini Kerangka template. Untuk mengetahui lebih lanjut kode-kode yang digunakan di blogger bisa belajar disini template-data.blogspot.com

Edit template sesukamu

Untuk mengedit template tentunya kamu harus mempunyai basic ilmu HTML, CSS, JavaScript, dan juga bahasa blogger. Jadi silakan belajar dulu di w3school, dan blognya dte.web.id. Kalo udah belajar disitu silakan belajar di blog-blog pendukungnya yang lebih praktis.

Edit template agar fast dan SEO

Ini adalah langkah yang terakhir dari pembuatan template. di blog yang melegenda di Indonesia seperti, Arlina Design, Kompi Ajaib, dan blog-blog lainnya, kamu bisa menemukan tutorial-tutorial yang berkaitan dengan cara edit template agar berkecepatan super dan seo friendly. Dan saya juga tidak membatasi kamu untuk mencari materi lainnya di internet untuk keperluan seo tersebut Sob.

Selesai

Demikianlah artikel tentang Cara Membuat Template Blog (Blogger) Sendiri dari Nol dengan Hasil yang Keren. Semoga dengan adanya artikel ini pikiranmu bisa sedikit terbuka untuk mempelajari cara membuat template dengan langkah-langkah yang tepat. 

Dari saya cukup sekian. Saya hanya membukakan pintunya dan memberitahu jalannya, dan kamulah yang melakukannya. Semoga Berhasil Sob.

Baca Artikel Blogging Lainnya.