BLOG THEMEMustamar Natsir | www.mustamar.com

Mustamar Natsir http://www.mustamar.com ask@mustamar.com @mustamar

BLOG

CMS

BACKEND FRONTEND

PRIVATE PUBLIC

THEME

Apa itu BLOG THEME?

Blog ThemeBlog Theme adalah

sekumpulan file-file pemrograman, yang dapat diakses oleh user (pengunjung blog) lewat jalur frontend, dan tugasnya merepresentasikan konten blog.

Image: courtesy of creativedisc.com

Anatomi Theme• Header Area• Navigation Area• Main Content Area• Pendukung (Sidebar,

Widget, dll.)

Image: courtesy of creativedisc.com

Memilih Theme

Memilih ThemeFaktor yang harus dipikirkan:• Pemilik Blog (kamu?)• Pembaca Blog• Sistem– Koneksi internet– Search Engine– Device >> PC? Mobile?

Panduan Memilih Theme• Theme Mengambarkan Topik & Target.

Image: courtesy of perezhilton.com & sunghajung.com

Panduan Memilih Theme• Branding Area.

Image: courtesy of creativedisc.com

Panduan Memilih Theme• Warna dan Layout.

Image: courtesy of creativedisc.com and problogger.net

Panduan Memilih Theme• Navigasi Baik.

Image: courtesy of creativedisc.com

Panduan Memilih Theme• Konten blog JELAS

Image: courtesy of creativedisc.com

Panduan Memilih Theme• Posisi & Jumlah

Elemen Pendukung, optimal dan dapat benar-benar mendukung fungsi blog.

Image: courtesy of creativedisc.com

Panduan Memilih Theme• Mendukung fungsi yang ada di editor

postingan.

Panduan Memilih Theme

• Elemen Halaman OK– Heading (H1, H2, H3,

H4, dst.)– Listing (ordered &

unordered)– Paragraph>>

Alignment.

Panduan Memilih Theme

• Fitur Komentar OK

Mustamar Natsir

ask@mustamar.com

http://www.mustamar.com

Hi, kenalan dong. Saya Mustamar, blogger paling keren se-Makassar. SUMPAH!!!

Image: courtesy of creativedisc.com

Panduan Memilih Theme• Author Page & Info– Di tiap postingan– Di halaman author– Avatar?– Profil?– Tulisan dari author

Image: courtesy of problogger.net & mashable.com

Panduan Memilih Theme• Posisi iklan:– Tidak mengganggu konten– Tidak mengganggu mata– Tidak mengganggu layout secara keseluruhan– Posisi iklan tetap punya nilai tinggi

Panduan Memilih Theme• System Friendly– Koneksi internet– Device yang digunakan (PC? Mobile? Ukuran

Monitor Secara Umum?)– Search Engine Friendly

Bagaimana Mendapatkan Theme?

Mendapatkan Theme• Pakai yang GRATISAN• Pakai yang BERBAYAR• Bikin Sendiri!

Theme GratisanAturan Pakai:• Biasanya dilarang menghilangkan author link• Biasanya dilarang untuk dijualbelikan• Biasanya dilarang untuk dipakai mencari

nafkah• Tidak ada garansi!• Community support.

Theme GratisanTempat mendapatkannya:

- WordPress: http://www.wordpress.org/extend/themes/

- Blogger: http://www.btemplates.com/www.bloggerthemes.net

Theme BerbayarAturan Pakai:• Penggunaan biasanya tergantung lisensinya.• Developer & community support.• Tersedia Garansi

Theme Buatan SendiriYang diperlukan:• Menguasai HTML dan CSS dasar.• Menguasai platform blogmu, dan

pemrogramannya. (PHP untuk WordPress, XML untuk Blogger, dll.)

• Punya jiwa seni secukupnya• Punya pemahaman mengenai layout• Software pendukung (text editor, image editor,

local server, dll.)

Theme Buatan SendiriMulainya dari mana?1. Kuasai HTML dan CSS. http://www.w3schools.com 2. Menguasai platform blogmu. http://codex.wordpress.org/

http://www.google.com/support/blogger/?hl=en http://www.google.com/support/blogger/bin/answer.py?hl=en&answer=176245

3. Pahami layout. 4. Mulailah dengan yang sederhana, atau mencontoh theme yang sudah

ada.5. Manfaatkan internet dan bergaul forum komunitas theme designer.6. Contoh tutorial:

http://themetation.com/2008/07/14/how-to-create-wordpress-themes-from-scratch-part-1/

Theme Buatan SendiriProses Pembuatan Theme1. Tentukan topik theme blog yang akan dibuat2. Membuat sketsa layout & konsep3. Sketsa –> Digital Layout (image processing)4. Image –> HTML Template + CSS (slicing)5. Sisipkan kode-kode yang dibutuhkan oleh platform blog kamu6. Test Theme (demo)7. Perbaikan8. Test lagi (demo lagi)9. Theme jadi10. Install theme

Theme sudah ada.Pakainya Gimana?

Installasi ThemeBlogger/Blogspot:• Login di blogmu (www.blogger.com )• Pilih link menu “Design” pada section blog yang

mau diganti themenya.• Pilih sub menu “Edit HTML”• Browse filenya (dari komputer), lalu upload, atau

Copy – Paste kode XML, ke editor yang disediakan,• Preview, untuk melihat tampilan,• Klik “Save Template”

Installasi Theme

Installasi ThemeBlogger/Blogspot:• Template Designer (Design >> Template Designer) juga

bisa digunakan untuk mempermudah desain & customize theme.

Installasi ThemeWordPress: (http://www.wordpress.com) • Login di blogmu • Pilih menu Appearance >> Themes• Aktifkan theme yang diinginkan.

Installasi ThemeWordPress (seft hosted):• Di menu Appearance >> Themes, pilih tab “Install Themes”• Gunakan Search Bar untuk mencari theme di WordPress Theme Directory• Atau gunakan “Feature Filter” untuk mencari theme berdasarkan fitur• Pilih link menu “Upload” untuk theme hasil downloadd atau buatan sendiri.

Download materi ini di:

www.mustamar.com

Ada pertanyaan?Mustamar Natsir http://www.mustamar.com ask@mustamar.com @mustamar

Fyuh… Akhirnya…