template blog

6
Membuat Sendiri Template Blogspot Membuat, Memodifikasi dan Memasang Template untuk Blog Anda

Upload: amin-isnanto

Post on 28-Nov-2014

285 views

Category:

Documents


1 download

DESCRIPTION

Template Blog

TRANSCRIPT

Membuat Sendir iTemplateBlogspotMembuat, Memodifikasi danMemasang Template untukBlog Anda

Membuat SendiriTemplateBlogspotMembuat sendiri template untuk Blogspot tidaklah sesulit yang dibayangkan.Pembuatan template tidak memerlukan keahlian pemrograman web sepertiyang sering ditakutkan oleh para pengguna blog. Apalagi banyak situsmenyediakan fasilitas Template Generator, yang akan membantu pembuatantemplate dengan "sangat mudah".

Buku Membuat sendiri renplate Blogspot membahas tentang,seluk beluktemplate untuk Blogspot. Pembahasan mulai dari cara mendapatkanteniplate, memodifikasinya dan kemudian memasang template tersebut padablog, sampai cara membuat template sendiri. Materi dibahas secara runut,langkah demi langkah sehingga diharapkan dapat mempermudahpemahaman Anda yang ingin membuat template sendiri.

Buku ini cocok digunakan oleh para pelajar, mahasiswa, guru dan bahkanpara profesional serta pengguna internet lainnyayang ingin mendesain sendiriblog yang dimilikinyasesuai keinginan.

Materiyang dibahas dalam buku antara lain:o Pendahuluan, sekilas tentang blogspot.o Pembahasan tentang Layout dan Template Internaldari Blogspotr Memanfaatan Template darisitus lain.o Persiapan membuat Template sendiri, termasuk teknik menyimpan gambar

desain template di Situs lmage Hosting.o Mengenaltemplate generator untuk membuat template sendiri.. Teknik menggunakan template generator dengan studi kasus pada situs

Firdamatic, PsycHo dan TrixTGv2.

Penerbit PT Elex Media KomoutindoJl. Palmerah Barat 29-37, Jakarta 10270Telp. (021) 536 50110,536 50111Ext.3214Web Page: http://wwwelexmedia.co.id

Doftor Isi

q-c Pengantar ' . . ' . . . . . " . ' " """ ' v

Im::r lsi """"""vi i

Bah 1 PENDAHULUAN.'.. . . . . . . """""""" 1

BLOGSPOT DAN KEMUDAHANNYA "'" '". . . ' ' ' "".1Langkah Mudah dalam Pembuatan' """""" 1

Dashboard Pengaturan yang Mudah Digunakan """"""2

Desain Mudah dan Menarik . . " . """"""""" 3

Kemudahan Membangun Peftemanan """" 5

REGISTMSI BLOG . ' . . . . . . . ' . " , . . . . "" .6

mab 2 LAYOUT BLOGSPOT DAN TEMPIATE INTERNAL"""" 13

PAGE ELEMENTS., , . . . . . . , . ' . . " " . . ' . . ' 14

Mengubah Letak Elemen " ' . " . ' . . ' . " ' ' . . " "" ' 15

Mengedit Elemen' . . . . " """"" ' 16

Menambah Elemen ". . """"" ' 17

FONT AND COLORS.. . . . ' . . , . . "" . . " ' 21

EDIT HTML. " ' . . " ' . " "22

PICK NEW TEMPLATE '" . ' " . , ' " ' ' " '24NEW TEMPLATE vs OLD TEMPLATE ". ' ."""""26

BAB 3 MEMANFAATKAN TEMPLATE DARI SITUS LAIN.'""..29

SITUS BLOGGER TEMPLATES '"... 31

SITUS Btemplates . . ' . . . . . " ' . . . . """ ' 41

vt l

BAB 4 MEMBUATTEMPTATE SENDIRI.. ..............47MEMPERSIAPKAN SOFTWARE .... . . , . . . . , . . . . . . . . . . .47

Adobe Photoshop , . . . . . . . . . . . . , . . .48CorelDraw., , . . . . . . . .49Web Editor. . . . . , . . .50Browser Internet .. . . . . . . . . . . . . . . . .50

MENDESAIN TEMPLATE ,.. . . . . . . . , . , .50coNToH PEMBUATAN 1OGO... . . . . . . , . . . . . . . . . , . . . . .52CONTOH PEMBUATAN HFADER .....61PERSIAPAN rArN.. , . . . . . . . . . . . . . . . . . . . . .68

BAB 5 MENYIMPAN GAMBAR DI SITUS IMAGE HOSTING,..69TENTANG SITUS IMAGE HOSTING... . . . . . . , . . . . . . .69

Google Picasa.. . . , . . . . . . . . . , . . . . . . . , 69Photobucket . . . : . . . . . . . . . , . . . . . . . . . . .70Situs Fl ickr . . . . . . . . . . .7LPict Image Hosting ... . . . . . . . . . . . .72Free Image Host ing . . . . . . . . . . . . . . . .72

coNToH PENGGUNMN GOOGLE prCASA.... , . . . . . . . . . . . . . . , . . . . . 73Registrasi dan Login .. . . . . . . . . . . .73Memasukkan Gambar Baru. . . . . . . . . . . . . . . . . . . . . .76Mengambil Link untuk Template ,. . . . . . . . . . , . . g0

MENGGUNAKAN PHOTOBUCKET.... . . . . . . . . . . . . . . . .83Registrasi dan Sign Up.. . . . . . . . . . . . . . . . . , . . . . . . . . . g3

BAB 6 MENGGUilAKAN TEMPTATE GENERATOR:FIRDAMATIC ... . . . . . . . . . , . . . . . . . . . . . . . .69TENTANG TEMPI.ATE GENEMTOR ,... . . . . . , . . . . . .89

Firdamatic. . . . . . . . , .90Psycho . . . . . . . . . . . . . .90Dotemplate. . . . . . . .91

vi i i

DrupalTheme "" '92TemPlatr.. . . """"" 93

WordPress Theme ."""""""' 93

FIRDAMATIC: BIKIN TEMPLATE ITU MUDAH ......"..""""" 93

MengaKifkan Firdamatic """"94

Identif ikasi Blog .. ' . ." ' . . """" ' 95

Mengatur Header . ' . . . . . ."""" ' 96

Body Blog . . ' . ' . . . . . ' . . . . : . ' . . . """ ' 98

Proses Generate. . . . . . ' . . . . ' . . . ' . . .99

MEMASANG TEMPLATE KE BLOG ...'"......".."104

SEKILAS TENTANG KODE HTML ... . . . . . . . . . . . . ' . . .107

Inisial isasi Program"... . . ' . . . . . .108

Kode CSS... . . . . . . .109

Kode untuk Left Side Bar... ' . . . . . . . . ' . . . . . . ' . . . .113

Kode untuk Konten... ' . . . . ' . . . . .116

Nt7 HENGGUNAKAN TEMPLATE GENERATOR: PSYCHO 119

TENTANG pSyCHO ..,. . . . . . . . . . . . . . . . .119

Membuat Template dengan Psycho... ' . . ' . . . ' . . . . . . ' . ' . . . . . . . 121

Basic Setting .....L22

Title Setting ....'..126

Column Setting

Left Side Scheme.. . . . . . . . ' . . . . ' . . ' . . .1. . ' . " . . . . . ' .133Left Side Theme.. . . , . . . . . . , . . . . . . .136

Post Setting ...'..138

MENyTMpAN HASIL ... . . . . . . . . . . . . . . . .141

MEMASANG KE BLOG ANDA .."....145

MENGEDIT TEMPLATE ... . . ."""" ' ;146

Memasukkan Image ..-. . . . . . . . 'L47