2009-02-03T01:58:00.000-08:00

Cara Membuat Template di Blogger

Yak akhirnya jadi juga, seperti yang aku janjikan kemarin yaitu "Cara Membuat Template Blogger". Mulai dari mana ya? nnnngg.. ohya, tak jelasin dulu deh tentang artikel ini. Gini, dalam trik berikut, kita akan mencoba membuat template yang paling sederhana dan paling mudah. Sebenarnya dalam mebuat template di blogger harus mengerti tentang CSS dan HTML, tapi untuk kali ini kita hanya memerlukan sedikit kemampuan tersebut karena kita akan membuat template yang paling sederhana, tapi jangan salah walaupun caranya sederhana tapi hasilnya bisa sangat luar biasa, tergantung dari desainernya. Ok deh mulai aja deh ya, kayaknya udah pada nggak sabar nih.

Gini, cara termudah dalam membuat template blogger yaitu dengan mendownload sebuah template kemudian kita otak-atik sendiri, jadi kita tidak perlu membuat dari awal. Untuk bahan praktek kali ini kita coba memakai template yang aku dah pernah aku buat, downlad disini bahannya. Sebelum kita mulai gue saranin lo buat blog baru aja biar gak ngerusak blog asli kamu.

Tahap Desain

Template yang akan kita buat disini memiliki empat komponen utama yaitu Background, Header, Main dan Footer. seperti yang ada dalam gambar berikut:

Jadi kamu harus membuat keempat komponen tersebut. Cara buatnya gimana? kamu harus bisa menggunakan software image editor seperti Photoshop, Corel, Paint dll. Cara pembuatan desainya lebih jelasnya seperti ini:
1. Buat desain seperti gambar diatas
2. Pada bagian background usahakan bersifat "Tile / Pattern" (kecil dan berulang-ulang).
3. Untuk Main dibagi lagi menjadi beberapa kolom, boleh 2 kolom, 3 kolom atau terserah deh. Dan biasanya terdiri dari bagian utama (posting) dan sidebar.
4. Kemudian potong-potong perbagian.
5. Untuk bagian Header motongnya harus full.
6. Bagian background, main dan footer motongnya sedikit aja karena bersifat "tile"
7. Desain diatas kalo dipotong-potong akan menjadi seperti ini :

background
header
main
footer

8. Upload potongan-potongan tersebut pada sebuah webhosting atau layanan penyimpanan file lainya. Contohnya di geocities atau Photobucket dll.

Nha modeng po ra?

Sekarang kita memasuki ke tahap penyusunan di blogger. gini langkah-langkahnya. Ohya udah di download belum tadi bahanya, kalo belum download dulu diatas itu. Ok kita mulai:
1. Kembali ke blogger dan ke menu "Edit HTML".
2. Trus klik tombol "Brows" untuk mengupload template yg udah kamu donwload tadi.
3. Kemudian Cari kode seperti ini:

body { margin: 0px; padding: 0px; text-align: left; font:$bodyfont; color:$textcolor; background: #323232 url('http://kendhin.890m.com/template/bg.jpg') repeat-x top left; }

4. Ganti text yang dicetak tebal dengan lokasi gambar background yang kamu buat.
5. Cari kode seperti ini :

#center {background: #ffffff url('http://kendhin.890m.com/template/main.jpg') repeat-y top center;}

6. Ganti text yang dicetak tebal dengan lokasi gambar main kamu.
7. Cari kode seperti ini:

#header { margin: 0; height:196px; width:898; color: $pagetitlecolor; background: url('http://kendhin.890m.com/template/head.jpg') no-repeat top center; }

8. Ganti text yang dicetak tebal dengan gambar header.
9. Cari kode seperti ini:

#footer { margin: 0; width: 898px; height:80px; padding: 0px; background: url('http://kendhin.890m.com/template/foot.jpg') repeat-y top center; }

10. Ganti text yang dicetak tebal dengan gambara foter.
11. Masih ada beberapa hal yang harus kamu perhatikan. coba cari kode-kode berikut:

#outer-wrapper { width: 898px; margin: 0px auto 0; text-align: justify; }

kode width: 898px menunjukkan lebar dari blog kamu, kamu bisa mengubahnya sesuai keinginanmu, tapi harus disesuaikan dengan lebar desain gambar yang kamu buat.

#main { float: left; width: 445px; margin: 5px; padding: 0px 0px 0px 10px; line-height: 1.5em; word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; }

kode width: 445px; adalah lebar daerah main yang berisi posting, kamu bisa merubahnya.

#sidebar { float: right; width: 153px; padding-right: 50px; font-size: 83%; color: $sidebartextcolor; line-height: 1.4em; word-wrap: break-word; overflow: hidden; }
#ads-wrapper {float: left; width: 195px; padding-left: 10px; word-wrap: break-word; overflow: hidden; }

kode width: 153px; adalah lebar sidebar bagian kanan. Dan kode width: 195px; adalah lebar sidebar bagian kiri. Terus kode padding-right: 50px; jarak antara tulisan atau isi sidebar sebelah kanan dengan garis batas kanan. Dan kode padding-left: 10px; adalah jarak antara isi sidebar kiri dengan garis batas kiri.

#header { margin: 0; height:196px; width:898; color: $pagetitlecolor; background: url('http://kendhin.890m.com/template/head.jpg') no-repeat top center; }

kode height:196px; width:898; adalah ukuran tinggi dan lebar bagian header, kamu bisa menyesuaikannya dengan ukuran header kamu.

#footer { margin: 0; width: 898px; height:80px; padding: 0px; background: url('http://kendhin.890m.com/template/foot.jpg') no-repeat top center; }

kode width: 898px; height:80px; adalah ukuran lebar dan tinggi bagian footer.

12. Nah kalo udah selesai coba di preview template kamu, sudah sesuai kah? atau hancur?
13. Kalo sudah di Save.

:f akhirnya selesai juga aku buat artikel tentang pembuatan template, capek ya? tapi ingat sekali lagi ini adalah metode membuat template yang mudah dan sederhana, jadi sebenrnya isi dari template lebih rumit lagi, munkin kapan-kapan akan kita bahas detail dari bagian-bagina template tersebut.
OK SELAMAT BERJUANG......

Baca Selengkapnya......

Hal-hal Yang Harus Diperhatikan Dalam Mengganti Template Blogger

Blog adalah ibarat rumah kita, dan tentunya kita ingin blog tersebut tampil menjadil lebih cantik dan indah. Banyak cara yang dilakukan untuk membuat blog menjadi lebih cantik, diantaranya dengan menambah pernak pernik dan juga dengan mengganti tampilan/template blog. Jika kita mengganti template dengan template yang sudah disediakan blogger maka itu adalah cara yang paling mudah, tinggal pilih simpan langsung jadi. Namun template yang disediakan sangat sedikit dan tampilannya juga standar, sehingga kita seringkali mencari template lain yang lebih cantik, karena sekarang banyak sekali situs-situs yang menyediakannya dengan gratis. Namun jika kita menganti template dengan template lain yang disediakan oleh selain blogger, maka itu tidaklah semudah sebagaimana dengan menggunakan template yg disediakan blogger, karena ada beberapa efek sampingnya, diantaranya yaitu kamu akan kehilangan element2 kamu ato malah blog kamu jadi rusak. Nha berikut ini akan aku jelaskan hal-hal apa aja yang harus diperhatikan jika kamu pingin ganti template dengan jasa lain.

Pertama kamu harus membackup dulu tempalte kamu jika template baru kamu tidak berhasil diinstall, caranya masuk ke menu "Layout --> Edit HTML", trus klik link bertuliskan "Download Full Template" terus simpan file yang diberikan.

Kedua yaitu membackup elemen-elemen atau widget-widget yang sudah pernah kamu pasang, caranya gini, Masuk ke menu "Page Element", nha disitu kan banyak tuh element-element yang udah kamu pasang trus dibawahnya kan ada link bertiliskan "edit" klik link-link tersebut satu persatu, copy isi dari elemen itu dan taruh dalam notepad. Kalo kamu nanti dah ganti template dan mau memasang elemen-elemen tersebut tinggal copy dari notepad terus pasang di "add page elements".

Ketiga, jika template dan elemen-elemen sudah kamu backup langkah selanjutnya yaitu mengupload template yang sudah kamu download. Biasanya file template yang di download berextenxi "xml" tapi kadang-kadang ada juga yang berekstensi "zip atau rar", kalo begitu kamu harus mengekstraknya dulu sehingga kamu akan mendapat file berekstensi "xml". Trus gini cara ngaploadnya, Kembali ke menu "Edit HTML", trus disitu kan ada tombol "brows" klik tombol tersebut terus cari file template yg pingin kamu pakai sudah kamu download, trus klik tombol :upload".

Keempat, biasanya kamu akan mendapat konfirmasi seperti gambar dibawah ini, itu artinya elemen-elemen kamu akan dihapus. Klik tombol "Confirm & Save"

Kelima, jika ternyata yang muncul adalah seperti gambar dibawah ini maka itu artinya ada yang tidak beres dengan template kamu dan kamu tidak bisa memakai template tersebut di blog kamu, jadi kamu ganti aja dengan template yang lain.

Keenam, coba preview blog baru kamu, merasa sudah cocok ikuti langkah ketuju. Jika kamu mendapati ada gambar header yang sebelumnya kamu pake buat header masih muncul di template baru kamu dan posisinya sepertinya tidak cocok, maka kamu harus menghilangkannya dulu gambar header tersebut, caranya masuk kembali ke menu "Page Element", dibagian header coba kemu edit dan hapus gambar kamu. Jika di bagian header tidak ada link "edit" coba kamu ganti dulu templatenya dengan template yang disediakan oleh blogger dan kembali ke "Page Element" trus "edit dibagian header dan hapus gambar header kamu kemudian ikuti lagi langkah-langkah ketiga

Ketuju, Kembalikan elemen-elemen yang sudah kamu backup tadi sehingga kini kamu memiliki template baru dan elemen-elemen yang dulu tidak ilang.

Kedelapan, Selamat bermumet-mumet

Baca Selengkapnya......

Free Blogger (Blogspot) Template Gratis

Free Download Template Untuk Blogger / Blogspot. Gratis, tinggal downlod trus pasang di blog kamu.

Silahkan Donwload disini : http://x-template.blogspot.com

Baca Selengkapnya......

Cara Memback-up Template Blogger

Kendhin

Template

Buat para Blogger mania pasti sering dong mengoprek-oprek template yang disediakan, soalnya templatenya sedikit and fasilitasnya kurang tidak seperti yang ada di wordpress. Tapi Blogger punya kelebihan yaitu kita bisa memodifikasi template yang ada semau kita, tidak seperti di wordpress. Di wordpress jika kita mau mengedit template harus bayar dulu, iiihhhh, emangnya kita kaya po? kita kan orang-miskin ya nggak? . Tapi sebelum kita mengoprek-oprek template alangkah bijaksananya jika kita memback-up dulu templatenya, Lho? fungsinya apa?, supaya kalo kita ngoprek-ngopreknya salah bisa dikembalikan kembali seperti semula, seperti di restore gitulah. Nha, gimana caranya memback-up template di blogger? gini nih caranya:

Pertama-tama tentu kamu harus Login dulu dong, trus Pilih Layout -->> Edit HTML. Nha disitu kan ada gini before editing ypoour template, you may want to save a copy of it. Download Full Template> , klik yang ada tulisan Download Full Template terus simpan file tersebut, biasanya file dalam format xml.

Nha kalo mo memasang template baru atau template yang sudah diedit ato mo mengembalikan template ke sebulmnya kamu tinggal klik tombol Upload yang ada dibawahnya. OK BOZZ.. Good Luck Ya.....

Baca Selengkapnya......

Free Template Blogger

Kendhin

Template

Silahkan Download Template-yang ada disini, semuanya gratis. untuk melihat contohnya Klik Preview, untuk mendownload klik kanan--> Save as pada link download

Preview

Download

Preview

Download

Preview

Download

Preview

Download

Silahkan Download Template-Template Yang lain Disini

Baca Selengkapnya......

Template 3 Kolom 3TTB01

Yak, Template 3 kolom akhirnya jadi juga. setelah lembur semalaman ahirnya berhasil aku membuat template 3 kolom. Template ini kuberi nama "3TTB01", berkesan gelap dipadu dengan warna ungu. Yang ini juga gratis bisa kamu download dan kamu pakai. kalo pingin download disini
contoh previewnya di bawah ini:

Untuk download template-template yang lain silahkan LIHAT DISINI

Baca Selengkapnya......

Template Pertama

Fiuuuuhhhh... Akhirnya berhasil juga aku membuat template sendiri. Setelah hampir satu bulan aku terjun di dunia blog hari ini (27/12/2007) aku berhasil membuat template. Template ini di dominasi dengan warna biru dan berlatar belakang komputer. Template ini hanya memiliki 2 kolom. Template ini aku beri nama "2TTB01" maksudnya (2 kolom Trik-Tips Blog seri 01). Template ini bisa kamu download dan kamu pakai secara GRATIS (tapi kalo mau membayar buat rasa terima kasih juga gak papa) kalo mau melihat contohnya disini dan kalo mau download disini (klik kanan --> Save As). Tapi ingat kalo mau ganti template sebaiknya template yang sebelumnya di back-up dulu dan juga widget2 atau element2 yang ada di back-up dulu biar tidak ilang ok. Dan untuk seterusnya aku akan membuat template yang ledih banyak lagi, jadi tunggu aja ya...

Baca Selengkapnya......

2009-02-03T00:17:00.000-08:00

cara pembuatan web gratis

Kagem temen-temen yang pengen bikin situs gratisan silahkan klik link-link di bawah ini. Syaratnya gampang … harus punya email, bagi yang belum punya email, silahkan klik : [Cara Membuat Email] :). Setelah punya email, silahkan klik salah satu pilihan membuat web / blog gratis di bawah ini :

Pilihan pertama klik [sini]
Pilihan kedua klik [sini]
Pilihan ketiga klik [sini]

SYUHADA BLOGGER