Langsung ke konten utama

Postingan

Menampilkan postingan dari April, 2012

Membuat Template Blogspot Bagian 6 (Footer Wrapper)

Tutorial dibawah ini merupakan kelanjutan dari Tutorial Membuat Template Blogspot Bagian 5 jika belum mengikuti bagian 1 yaitu Bagian Dasar Template silahkan masuk ke Bagian 5 . Footer Wrapper Element footer / kaki-kaki ini terletak dibagian paling bawah mungkin sudah pada tau didengar dari namanya saja Footer pasti dibawah. Element ini biasanya menyimpan sebuah catatan atau informasi yang berupa tautan penting seperti tentang Hak Cipta / Copyright  dan informasi sejenisnya, akan tetapi tidak mutlak harus seperti itu kita bisa menempatkan link atau info apa saja di bagian footer ini. Pada pembuatan template ini memiliki lebar Outer Wrapper 960px berarti kita juga harus memberi lebar Footer sebesar 960px jangan kurang ataupun lebih, karena jika lebih akan nampak tak rapi dan jelek pastinya dan jika kurang pasti tampilannya juga akan lebih jelek lagi karena tidak ada keserasian. Oke kita lanjutkan menerapkan kode untuk footer wrappernya : 1. Buka Edit HTML template yang tela...

Membuat Template Blogspot Bagian 5 (Main Wrapper)

 Tutorial dibawah ini merupakan kelanjutan dari Tutorial Membuat Template Blogspot Bagian 4 jika belum mengikuti bagian 1 yaitu Bagian Dasar Template silahkan masuk ke Bagian 4 . Main Wrapper Main wrapper merupakan salah satu elemen yang paling penting pada sebuah blog dimana Semua isi posting, judul post, meta dan komentar akan disimpan diarea ini, jadi kita harus secara teliti menentukan tampilan dan ukuran agar bisa serasi dan rapi. Diposting sebelumnya telah kita tentukan lebar masing-masing Sidebar memiliki lebar 200px nah sekarang kita akan menggunakan sisa lebar dari body tersebut, template yang akan kita buat ini memiliki lebar 960px bisa dilihat pada posting (bagian 1) : - Jadi body 960px dikurangi - Sidebar1 200px X Sidebar2 200px = 400px - Berarti memiliki sisa 560px. Tapi kita tidak akan mengambil habis 560px supaya rapi dan kolom tidak saling bertabrakan kita harus menyisakan sebagai padding dan margin agar ada jarak antara Block Sidebar dan Block Po...

Membuat Template Blogspot Bagian 4 (Block Sidebar)

Tutorial dibawah ini merupakan kelanjutan dari   Tutorial Mmebuat Template Blogspot Bagian 3   jika belum mengikuti bagian 1 yaitu Bagian Dasar Template silahkan masuk ke   Bagian 3 . Sidebar Wrapper Kemarin telah saya bahas mengenai yaitu mengenai penentuan dan pembuatan Header Wrapper sekarang masuk ke tahap selanjutnya yaitu menentukan dan membuat Block untuk Sidebar Wrapper dimana block sidebar tempat untuk menyimpan segala macam aksesoris dari blog kita nah langsung saja berikut langkah-langkahnya : 1. Buka Halaman Edit HTML yang kemaren dibuat 2. Cari dan hapus kode berikut ini : /* Awal kode css untuk block sidebar1 dan block sidebar2 ======================================================== */ #sidebar1 { } #sidebar2 { } 3. Lalu ganti dengan kode dibawah ini /* AWAL KODE SIDEBAR 1 DAN SIDEBAR 2 ======================================================== */ #sidebar1 {   width:200px;   float:left;   margin:10px 0 0 0;   paddi...

Membuat Template Blogspot Bagian 3 (Header)

Tutorial dibawah ini merupakan kelanjutan dari Tutorial Membuat Template Blogspot Bagian 2 jika belum mengikuti bagian 2 yaitu Bagian Dasar Template silahkan masuk ke Bagian 2 . Setelah bagian body dan Outer wrapper telah ditentukan sekarang langkah selanjutnya yaitu menentukan bentuk atau model Header Wrapper , pada bagian header ini yang ditentukan yaitu meliputi : - Lebar dan tinggi Header - Warna latar header - Judul blog dan deskripsi (kita juga bisa menentukan logo blog melalui bagian header ini) 1. Sekarang masuk ke  Edit HTML  blog kamu caranya (blog yang digunakan untuk experiment) : - Klik Blog Yang Dibuat - Klik Template - Klik Edit HTML - Akan muncul sebuah peringatan dalam kotak kuning klik saja Proceed / Lanjutkan - Maka akan terlihat kode HTML template blog kamu.   2. Cari dan hapus kode dibawah ini : /* Awal untuk kode css header wrapper ======================================================== */ #header-wrapper { } 3. Kemudian ganti...

Membuat Template Blogspot Bagian 2 (Outer Wrapper)

Tutorial dibawah ini merupakan kelanjutan dari Tutorial Mmebuat Template Blogspot Bagian 1 jika belum mengikuti bagian 1 yaitu Bagian Dasar Template silahkan masuk ke Bagian 1 . Setelah kemarin memposting Artikel membuat template blogspot bagian 1 sekarang saya lanjutkan tentang membuat template blogspot untuk bagian 2, pada bagian 2 ini akan membahas penentuan tampilan pada bagian body dan Outer Wrapper , dimana body akan menentukan keseluruhan isi blog nantinya : 1. Sekarang masuk ke Edit HTML blog kamu caranya : - Klik Blog Yang Dibuat - Klik Template - Klik Edit HTML - Akan muncul sebuah peringatan dalam kotak kuning klik saja Proceed / Lanjutkan - Maka akan terlihat kode HTML template blog kamu. 2. Kalau sudah hapus kode berikut : body {  /* disini nanti kode CSS untuk body */ } #outer-wrapper {  /* disini nanti kode css untuk outer wrapper */ } 3. Kalau sudah kemudian ganti dengan kode dibawah ini * { margin:0; padding:0; border:none; vertica...

Membuat Template Blogspot Bagian 1 Pola

Membuat Template Blogger / Blogspot , selama ini saya membagikan template blogger secara gratis sudah puluhan  template saya hasilkan dan saya bagikan secara gratis, akan tetapi pada artikel kali ini saya akan membahas langkah demi langkah bagaimana membuat template blogger mulai dari nol, Jika kamu belum pernah membuat sebuah template pernah membayangkan bagimana sulitnya membuat template tetapi harus diketahui bahwa membuat template tidak sesulit yang dibayangkan asalkan kita punya kemauan dan juga ketelitian sebuah template dapat dibuat dengan mudah. Membuat template blogger merupakan salah satu pekerjaan yang susah-susah gampang , template blogger menggunakan platform HTML/XML, untuk itu saya akan membahas membuat template blogspot dengan XML/HTML version agar dalam panduannya tidak membingungkan dan mudah dipahami oleh siapa saja yang mengikuti saya bagi dalam beberapa sub bagian yang akan posting secara berkala. Dokumentasi : Pertama kita harus memiliki pola atau gambaran...

Struktur Dasar Template Blogspot

Mengenal Struktur Dasar Template? Apakah itu harus? ya mengetahui atau mengenali struktur pada sebuah template pada sebuah blog perlu dimengerti bagi seorang blogger lebih khusus lagi jika kamu ingin menjadi seorang Web Designer , dengan mengetahui struktur dari template itu kita akan lebih mudah mengembangkan model tampilan layout template kita bagian mana yang ingin kita olah, tapi itu saja sebenarnya belum cukup karena minimal 10% kita juga harus sedikit mengerti tentang CSS (Cascading style sheet) dan HTML (Hyper Text Markup Language) dan juga Javascripts. Struktur sebuah template pada dasarnya memliki struktur yang sama namun bisa juga kadang berbeda tergantung designer tersebut yang membuatnya, namun dasar sebuah template memiliki struktur dibawah ini : Keterangan : Body: block paling lebar, body ini yang menampung seluruh konten dari blog atau website. Outer-wrapper: kotak ini melapisi bagian template (Body lebih mirip bagian luar template) , jadi kebanyakan pada umumny...