Masih tentang desain template setelah sebelumnya saya posting cara menambah dua kolom elemen halaman dibawah sidebar utama dan menambah sebuah elemen halaman dibawah dua sidebar yg telah dibuat itu, agar lengkap kali ini akan saya paparkan lagi langkah-langkah menambah elemen halaman diatas footer seperti terlihat pada gambar berikut:
Social networks that provide information on a variety of electronic goods and shopping centers in various parts of electronic goods online world
Arsip Blog
-
▼
2010
(90)
-
▼
Oktober
(68)
-
▼
Okt 20
(9)
- Membuat Background Pada Teks Area
- Cara Menambahkan Elemen Halaman Atau Kolom Full Wi...
- Membuat Tabber Tab Menu Dengan JQuery #1
- Membagi Header Menjadi Dua Kolom
- Menambah Dua Kolom Elemen Halaman Dibawah Sidebar ...
- Menambah Elemen Dibawah Dua Sidebar
- Menambahkan Kolom Elemen Halaman Baru Pada Sidebar
- Menambahkan Elemen Halaman Baru Diatas Dua Kolom
- Cara Menambahkan Elemen Halaman Diatas Footer
-
▼
Okt 20
(9)
-
▼
Oktober
(68)
Rabu, 20 Oktober 2010
Menambahkan Elemen Halaman Baru Diatas Dua Kolom
Postingan ini khusus menjawab pertanyaan sobat Rahmatea, yang menanggapi postingan saya yang membahas cara menambahkan elemen halaman dibawah dua kolom. Bagaimana trik atau caranya jika elemen yang ditambahkan diatas dua kolom? Caranya mudah saja kebetulan postingan sebelumnya kita membahas cara menambahkan sebuah kolom pada sidebar, sehingga hasilnya template yang semula dua kolom menjadi tiga kolom.
menambahkan elemen halaman baru atau kolom baru pada sidebar
Sekarang kita lanjutkan...
Bagaimana cara menambahkan sebuah kolom elemen halaman diatas dua kolom
menambahkan elemen halaman baru atau kolom baru pada sidebar
Sekarang kita lanjutkan...
Bagaimana cara menambahkan sebuah kolom elemen halaman diatas dua kolom
Label:
CSS dan HTML,
Desain Template,
Tutorial Blogger
Menambahkan Kolom Elemen Halaman Baru Pada Sidebar
Setelah mempublikasikan template perdana yang saya hasilkan dari belajar otodidak desain template, beberapa teman minta diajarkan cara membuat template. maka pada postingan kali ini kita akan belajar lagi bagaimana menambahkan elemen baru pada sidebar atau membuat template dua kolom menjadi tiga kolom dengan dua kolom pada sidebar kanan.
Nah langsung saja seperti biasa template yang saya jadikan tempat eksperimen kecil adalah template default minima.
Nah langsung saja seperti biasa template yang saya jadikan tempat eksperimen kecil adalah template default minima.
Label:
CSS dan HTML,
Desain Template,
Tutorial Blogger
Menambah Elemen Dibawah Dua Sidebar
Sebelumnya saya pernah posting cara menambahkan elemen (dua kolom tambah gadget) dibawah sebuah sidebar utama.
menambahkan elemen (dua kolom tambah gadget) dibawah sebuah sidebar utama
Postingan kali ini trik menambah elemen halaman dibawah dua kolom atau sidebar yang telah saya buat kemarin.
Seperti gambar dibawah ini:
menambah elemen halaman dibawah dua kolom atau sidebar
menambahkan elemen (dua kolom tambah gadget) dibawah sebuah sidebar utama
Postingan kali ini trik menambah elemen halaman dibawah dua kolom atau sidebar yang telah saya buat kemarin.
Seperti gambar dibawah ini:
menambah elemen halaman dibawah dua kolom atau sidebar
Label:
CSS dan HTML,
Desain Template,
Tutorial Blogger
Menambah Dua Kolom Elemen Halaman Dibawah Sidebar Utama
Kali ini saya ingin mengetengahkan cara menambah dua kolom elemen halaman dibawah sidebar utama.
Tidak panjang lebar lagi, berikut cara menambah elemen halaman dibawah sidebar utama yang saya jadikan tempat eksperimen blog saya lainnya yang menggunakan template default blogger yaitu minima...
Tampilan awal templateminime seperti gambar dibawah ini:
elemen halaman dasar minima
Bagaimana cara menambah elemen dibawah sidebar utama menjadi dua kolom seperti gambar dibawah ini:
menambahkan dua kolom dibawah sidebar utama
Ikuti langkah langkahnya:
Menambah elemen di bawah sidebar utama
Tidak panjang lebar lagi, berikut cara menambah elemen halaman dibawah sidebar utama yang saya jadikan tempat eksperimen blog saya lainnya yang menggunakan template default blogger yaitu minima...
Tampilan awal templateminime seperti gambar dibawah ini:
elemen halaman dasar minima
Bagaimana cara menambah elemen dibawah sidebar utama menjadi dua kolom seperti gambar dibawah ini:
menambahkan dua kolom dibawah sidebar utama
Ikuti langkah langkahnya:
Menambah elemen di bawah sidebar utama
Membagi Header Menjadi Dua Kolom
Alhamdulillah hari ini bisa update lagi setelah beberapa hari asyik ngotak ngatik CSS dan belajar menggunakan beberapa program (Adobe Photoshop, Corel Draw X4, DreamLight Photo Editor dan PhotoShine) yang baru saya instal dilaptop kesayangan, yang tentu program itu saya harapkan bisa membantu saya lebih kreatif lagi dalam mendesain template kedepan dan menggunakannya pada hal-hal lain yang juga memeberi maslahat.
Tutorial sebelumnya kita sudah pernah membahas cara menambahkan kolom atau elemen halaman diatas header dan dibawah header juga menambahkan dua dan tiga kolom dibawah header. Kali ini kita akan belajar menambahkan elemen halaman baru pada header atau membagi header menjadi dua kolom.
Hasilnya seperti screenshot berikut:
membagi header menjadi dua kolom
Berikut langkah-langkahnya:
Tutorial sebelumnya kita sudah pernah membahas cara menambahkan kolom atau elemen halaman diatas header dan dibawah header juga menambahkan dua dan tiga kolom dibawah header. Kali ini kita akan belajar menambahkan elemen halaman baru pada header atau membagi header menjadi dua kolom.
Hasilnya seperti screenshot berikut:
membagi header menjadi dua kolom
Berikut langkah-langkahnya:
Membuat Tabber Tab Menu Dengan JQuery #1
Saat ini tabber tab mulai banyak terkenal dalam dunia desain web. Banyak situs yang menggunakan tabber tab dan mengisinya dengan berbagai konten untuk menghemat ruang halaman web site. Diantara yang banyak saya lihat menggunakan tabber tab untuk kategori recent post, comments dan random posts adalah template atau theme wordpress.
InsyaAllah kali ini saya ingin mengetengahkan cara membuat tabber tab dengan JQuery untuk template blogger. Diantara ragam tabber tab satu diantara yang akan kita pelajari cara pembuatannya sekarang, adalah tabber tab dengan struktur menu menggunakan icons seperti screenshot diatas. Atau lihat demonya disini
InsyaAllah kali ini saya ingin mengetengahkan cara membuat tabber tab dengan JQuery untuk template blogger. Diantara ragam tabber tab satu diantara yang akan kita pelajari cara pembuatannya sekarang, adalah tabber tab dengan struktur menu menggunakan icons seperti screenshot diatas. Atau lihat demonya disini
Cara Menambahkan Elemen Halaman Atau Kolom Full Widgets Pada Sidebar
Tutorial kali ini kita akan belajar lagi tentang desain template (cieh)? Bagaimana menambahkan elemen halaman atau kolom full widget pada sidebar template blogger dengan menggunakan CSS, XHTML dan JavaScript hanya dalam empat langkah simple, kita juga bisa dengan mudah mengganti warna dan widget langsung pada area dashboard. Berikut sebuah screenshot simple hasil dari tuturial ini:
tab view versi 2 image.
imagetab view versi 2
Tampilannya mirip tab view sederhana yang triknya pembuatannya pernah saya bahas sebelumnya hanya saja selain perbedaan yang sudah saya sebutkan diatas kolom widget ini ketika menu diklik tingginya akan menyesuaikan dengan tinggi widget. Untuk menguji dan meyakinkan sobat JavaScript ini bekerja silahkan lihat demonya dulu pada template yang masih dalam proses desain saya disini dan disini. Sekalian saya minta saran dan kritik teman-teman untuk kedua tampilan terbaik template sederhana itu!!!
O ya saya sarankan untuk mengetes tutorial ini pada minima template atau backup template sobat sebelum bereksperimen dengan template sobat saat ini.
tab view versi 2 image.
imagetab view versi 2
Tampilannya mirip tab view sederhana yang triknya pembuatannya pernah saya bahas sebelumnya hanya saja selain perbedaan yang sudah saya sebutkan diatas kolom widget ini ketika menu diklik tingginya akan menyesuaikan dengan tinggi widget. Untuk menguji dan meyakinkan sobat JavaScript ini bekerja silahkan lihat demonya dulu pada template yang masih dalam proses desain saya disini dan disini. Sekalian saya minta saran dan kritik teman-teman untuk kedua tampilan terbaik template sederhana itu!!!
O ya saya sarankan untuk mengetes tutorial ini pada minima template atau backup template sobat sebelum bereksperimen dengan template sobat saat ini.
Membuat Background Pada Teks Area
Anaa pernah posting cara membuat teks area, apa itu teks area? lihat aja lagi postingan itu disini.
Kali ini cara membuat agar teks areanya memiliki background dengan cara menambahkan kode berikut:
Kali ini cara membuat agar teks areanya memiliki background dengan cara menambahkan kode berikut:
Letakkan kalimat yang ingin ditampilkan pada teks area disini
Langganan:
Postingan (Atom)