blog cms template
DESCRIPTION
Materi Workshop Blog Progresif Kelas #2 untuk @BloggerSUMUT oleh @nichpakaichTRANSCRIPT
Mengatur Tampilan Blog
Kelas #2Workshop Progresif
BloggerSUMUT
nichpakaich#BloggerSUMUT
Halo, saya Nichpakaich
Content Management System
Content (Tulisan)
Canvas
(Theme / Template)
CMS
(Blog)
Secara Sederhana …
Urusan Content mah, Gampang!
Mempersiapkan Content
Kalau Tampilan?
HTML & CSS
Hyper-Text Markup Language
• Bahasa pemrograman untuk mempresentasikan sebuah halaman web
Cascading Style Sheet
• Mengendalikan format komponen sebuah halaman web secara terstruktur
HaloDunia.HTML
<html><head>
<title> {Nama Anda} </title></head><body>
<p>Halo Dunia</p></body></html>
HaloDunia.HTML
HTML
<body><p>Halo Dunia</p><img src="http://bloggersumut.net/logo_bloggersumut.net_200.jpg">
</body></html>
HaloDunia.HTML
CSS
<title> {Nama Anda} </title> <style>
p { font-size: 36px; background: #209900;color: #dfdfdf;
}</style></head>
HaloDunia.HTML
Pendalaman HTML & CSS
Topik dasar berikut akan sangat membantu:
• Tag HTML<strong> <em> <u> <font><img> <table> <iframe>
• CSSfont-facecolorbackground
Kapan Menggunakannya?
Memilih Theme/Template
Bagaimana cara memilih theme atau template blog?
Wordpress Theme
Blogger Template
Perhatikan 3 Hal Ini
Elemen Tampilan
•Estetika•Pencitraan
Elemen Fungsional
•Flexibilitas(plugins, gadget/widget)•Kemudahan yang ditawarkan
Elemen Pengunjung
•Kenali kelompok pembaca(umur, gender, lokasi)
Elemen Tampilan
• Butuh berapa kolom? • Suka model majalah atau kronologis?• Bagaimana dengan anchor-text?• Heading style-nya bagus?• Suka header-nya?• Font-nya unik?
Layout
Content
Header
Sidebar
Footer
Elemen Fungsionalitas
• Ada fitur “Read more” gak?• Navigasi halaman ada?• Komponen layout bisa dipindah-
pindah?(gagdet / widget ready)
• Bisa share langsung ke teman-teman?
• SEO Friendly kah?
Elemen Pengunjung
Yang membaca blog Anda itu..• Ibu-ibu kah? Atau Remaja Gaul?• Jangan-jangan aki-aki yang untuk
baca koran sudah harus pakai kaca pembesar?
• Apakah mereka suka membaca sambil mendengarkan lagu?
• Atau orang yang baru melek internet?
Memperkaya Tampilan Blog
Memanfaatkan Gadget/Widget untuk Blog
Blogger Gadget
Blogger Gadget
1
2
Blogger Banner
http://bloggersumut.net/logo_bloggersumut.net_200.jpg
Wordpress Widget
di “seret saja”
Wordpress Widget Banner
http://bloggersumut.net/logo_bloggersumut.net_200.jpg
TIPS
Beberapa masukan untuk menguasai cara memilih template/theme dan memperkaya tampilan blog
Tips
Tambah jam terbang berseluncur (browsing)
Tips
Jika sudah buntu, jangan malu untuk mencari pertolongan profesional atau yang sudah berpengalaman
Tips
TERIMA KASIH@nichpakaich
Sampai jumpa di Workshop Progresif BloggerSUMUT selanjutnyaKelas #3: Promosi Blog