Membuat Menu Dropdown

Dalam konsep blog, setiap posting kita akan terarsip otomatis secara rapi setiap bulan. Setiap memasuki bulan baru, seperti Januari, maka arsip bulan Desember akan tampil di sidebar. Masalahnya, kalau kita sudah ngeblog setahun, maka arsip dari Januari sampai Desember akan berjejer di sidebar kita. Bagaimana kalau dua dan tiga tahun lagi? Langkah praktis mengatasi hal ini adalah dengan membuat pull-down menu seperti di bawah ini:

- Archives - January 2007 February 2007 Mart 2007 April 2007

Jadi, berapa bulan/tahun kita blogging di blogger/blogspot, menu bulan-bulan tsb tidak akan memenuhi dan berjejer panjang di sidebar kita. Yg tampak hanya nama "Archives", baru setelah di klik, akan muncul nama bulan arsip-arsip kita.

Untuk membuat arsip pulldown ini ada dua yakni untuk blogger dengan template klasik, dan template baru. Untuk template klasik langkahnya yaitu :

1. Login ke blogger.com dg id Anda
2. Klik Template
3. Di bagian sidebar blog Anda bagian archives, ada kode html sbb:

& 


<$BlogArchiveName$>

4. Nah, ganti kode di atas dg kode html di bawah ini:

- Archives -<$BlogArchiveName$>

5. Apabila selesai, klik SAVE CHANGES. Bila sudah DONE, klik REPUBLISH.
6. Selesai.

Untuk anda yang memakai template baru, langkahnya lebih mudah yaitu :

1. login dulu, tentunya dengan id anda
2. klik LAYOUT
3. Klik PAGE ELEMENTS, cari element (kotak) yang bertuliskan Blog Archive
4. Klik Edit pada kotak Blog Archive tadi
5. Di samping tulisan Style ada beberapa radio button, pilih radio button yang bertuliskan Dropdown Menu dengan cara memberi tanda tik/cek
6. Klik Save Changes
7. Selesai

Nah keterangan di atas tadi merupakan langkah-langkah untuk membuat menu Dropdown untuk Arsip, Sekarang bagai mana caranya membuat menu dropdown yang di dalam nya ada linknya, saya ambil contoh untuk menu Dropdown milik saya pribadi yang berada di sebelah kanan atas yang berisi tulisan “ blog tutorial “. Untuk membuatnya silahkan anda copy kode HTML di bawah :

tulisan disini yang akan muncul duluan isi dengan addres yang ingin di tuju">tulisan di sini yang akan muncul

Sebagai contoh untuk menu Dropdown milik saya :

- Blog Tutorial - Membuat Blog setting Blog Memilih Template warna & hurup Posting Artikel Read more (1) Text area Blogger Emoticons Yahoo!Emoticons Download Gratis

Hasilnya akan seperti ini :

- Blog Tutorial - Membuat Blog setting Blog Memilih Template warna & hurup Posting Artikel Read more (1) Text area Blogger Emoticons Yahoo!Emoticons Download Gratis

Mudah bukan?   Selamat mencoba ! 

Sumber: http://kolom-tutorial.blogspot.com/2007/04/membuat-menu-dropdown.html

Read more »

Cara Membuat Tabel di Blog

CONTOH

Untuk membuat tabel di blog, bisa kita lakukan dengan kode HTML yang khusus untuk membuat tabel tentunya. Perintah yang di pakai adalah
.....
. Di dalam tabel, kita bisa bisa beberapa atribut di dalamnya, antara lain yaitu:

1. bgcolor : untuk mengatur warna background/warna latar belakang tabel. Penempatan kodenya seperti ini : bgcolor="kode warna".


2. align : untuk mengatur tata letak tulisan yang ada pada tabel, mau rata kiri, tengah, rata kanan, atau rata kiri-kanan. Penempatan kodenya : align="left"|"center"|"right" .


3. cellpadding : untuk mengatur jarak antara tepi sel dengan isi sel di dalam sebuah tabel. Penempatan kodenya : cellpadding="pixel" .


4. border : untuk mengatur tingkat ketebalan garis tepi pada tabel. Penempatan kodenya : boeder="pixel" .


5. cellspacing
: untuk mengatur jarak antara sel. Penempatan kodenya : cellspacing="pixel" .

6. height : untuk mengatur tinggi tabel. penempatan kodenya : height="pixel"|"%" .


7. height : untuk mengatur lebal tabel. Penempatan kodenya : height="pixel"|"%" .



Sintaks atau kode yang terbentuk yaitu seperti ini :

bgcolor="color" border="pixel" cellpadding="pixel" cellspacing="pixel" width="pixel"|"%" height="pixel"|"%"> .....................

Sebuah elemen TABLE, juga berisi beberapa elemen yaitu CAPTION, elemen TH(table header), elemen TR(table row), serta elemen TD (table row).

Elemen CAPTION berfungsi untuk membuat judul dari sebuah tabel. elemen ini mempunyai atribut align dengan nilai top (yaitu judul di simpan di sebelah atas tabel), juga bottom (yaitu judul berada di sebelah bawah dari tabel).

Sintaks atau kode yang terbentuk yaitu seperti ini :



............................



elemen TR (Table Row) yaitu untuk membuat baris, elemen ini di tempatkan di dalam elemen tabel. Atribut yang bisa di pakai di dalam TR antara lain :

• align : untuk mengatur tata letak tulisan yang ada pada tabel, mau rata kiri, tengah, rata kanan, atau rata kiri-kanan. Penempatan kodenya : align="left"|"center"|"right" .
• valign : untuk mengatur posisi vertikal. penempatan kodenya : valign="top"|"middle"|"bottom"
• bgcolor : untuk mengatur warna background/warna latar belakang tabel. Penempatan kodenya seperti ini : bgcolor="kode warna".

Sintaks atau kode yang terbentuk yaitu seperti ini :


bgcolor="color"
valign="top"|"middle"|"bottom">

.....................



elemen TH(Table Header) berfungsi sebagai header sel pada sebuah kolom tabel. Atribut yang bisa di pakai antara lain:

• align : untuk mengatur tata letak tulisan yang ada pada tabel, mau rata kiri, tengah, rata kanan, atau rata kiri-kanan. Penempatan kodenya : align="left"|"center"|"right" .
• valign : untuk mengatur posisi vertikal. penempatan kodenya : valign="top"|"middle"|"bottom"
• bgcolor : untuk mengatur warna background/warna latar belakang tabel. Penempatan kodenya seperti ini : bgcolor="kode warna".
• colspan : untuk mengatur kolom. Penempatan kodenya : colspan="nomor" .
• rowspan : untuk mengatur row atau baris. Penempatan kodenya : rowspan="nomor"

Sintaks atau kode yang terbentuk yaitu seperti ini :


bgcolor="color"
valign="top"|"middle"|"bottom"
colspan="number" rowspan="number">

.....................

 

Elemen TR(Table Row) adalah elemn untuk membuat kolom. atribut yang bisa di pakai antara lain :

• align : untuk mengatur tata letak tulisan yang ada pada tabel, mau rata kiri, tengah, rata kanan, atau rata kiri-kanan. Penempatan kodenya : align="left"|"center"|"right" .
• valign : untuk mengatur posisi vertikal. penempatan kodenya : valign="top"|"middle"|"bottom"
• bgcolor : untuk mengatur warna background/warna latar belakang tabel. Penempatan kodenya seperti ini : bgcolor="kode warna".
• colspan : untuk mengatur kolom. Penempatan kodenya : colspan="nomor" .

• rowspan : untuk mengatur row atau baris. Penempatan kodenya : rowspan="nomor"

Sintaks atau kode yang terbentuk yaitu seperti ini :


bgcolor="color"
valign="top"|"middle"|"bottom"
colspan="number" rowspan="number">

.....................




Masih bingung? kalau begitu saya beri beberapa contoh agar sedikit lebih jelas :

Untuk membuat sebuah tabel tunggal, kodenya kira-kira seperti ini :

Contoh

   Hasilnya akan seperti ini :

Contoh

Terlihat bahwa tulisan yang ada, tampak mepet ke dinding tabel, apabila kita ingin agar tulisan berada persis di tengah tabel, maka cukup tambahkan saja kode align="center" pada kolomnya. misal seperti ini :

Contoh



Hasilnya akan seperti ini :

Contoh

Contoh-contoh di atas menggunakan nilai border 1, coba bandingkan apabila saya menggunakan nilai border yang lebih besar, misalkan 9. Kodenya kira-kira seperti ini :

Contoh



Hasilnya akan seperti ini :

Contoh

Jika ingin kolomnya bertambah, tinggal tambahkan kode kolomnya. contoh dua kolom, kodenya seperti ini :

Contoh

Contoh juga denk

Hasilnya akan seperti ini :

Contoh

Contoh juga denk

Kalau ingin dua baris, kira-kira kodenya seperti ini :

Contoh	Contoh juga denk
Contoh	Contoh juga denk

hasilnya seperti ini :

Contoh	Contoh juga denk
Contoh	Contoh juga denk

Jika tabelnya ingin di beri warna, tinggal tambahkan kode bgcolor="kode warna". contoh :

bgcolor="black"> bgcolor="green"> bgcolor="yellow">

Contoh	Contoh juga denk
Contoh	Contoh juga denk

hasilnya seperti ini :

Contoh	Contoh juga denk
Contoh	Contoh juga denk

Sekarang saya beri contoh terakhir (sedikit lebih serius) dengan mengunakan fungsi caption serta TH (table header). Misalkan saya ingin membuat sebuah tabel data dari nama-nama teknisi. Data-data yang ingin di buatkan tabel, misalkan seperti ini :

Tabel 1.1

Data Teknisi
No.	Nama
1.	Juned
2.	Jaka kelana
3.	Ibro

Kode yang di pakai bisa seperti ini :

Tabel 1.1

Data Teknisi
No.	Nama
1.	Juned
2.	jaka kelana
3.	Ibro

Hasilnya kira-kira seperti ini :

Tabel 1.1

Data Teknisi
No.	Nama
1.	Juned
2.	jaka kelana
3.	Ibro

Selain untuk menempatkan tulisan, sebuah tabel pun banyak di gunakan untuk menempatkan gambar agar terlihat lebih rapih. Contoh :

Hasilnya akan seperti ini :


jika sobat beranggapan bahwa garis tabel menggangu pemandangan, maka kita bisa mensiasatinya dengan cara menghilangkan garisnya yaitu nilai borde rnya kita buat 0 (nol).
contoh :

border="0" cellpadding="20">

Hasilnya akan seperti ini :


Bagaimana hasilnya yang terakhir ini, mata kita dapat di tipu bukan?


Catatn kecil saja. Karena kode diatas merupakan kode HTML, maka pada saat posting harus pada posisi Edit HTML jangan pada posisi Compose. Apabila ingin di simpan di sidebar, pilih yang untuk HTML/javaScript.




Sumber; http://kolom-tutorial.blogspot.com/2007/11/cara-membuat-tabel-di-blog.html


Read more »

Cara Membuat Menu Kontak Kami / Contact Us

Seperti yang anda lihat pada deretan menu-menu yang ada di atas blog, disitu ada menu Contact Us. Sudah sangat banyak sebenarnya postingan yang membahas tentang pembuatan menu tersebut. Akan tetapi tidak ada salahnya di posting kembali supaya blogger-blogger yang baru lebih mudah untuk mencari cara membuat menu contact us ini.

Menu ini saya buat dari situs www.emailmeform.com yang memang cukup bagus dan tentunya gratis. Jika sobat mau membuat menu ini silahkan sobat ikuti langkah-langkahnya:

Silahkan sobat kunjungi dulu situs http://www.emailmeform.com lalu cari dan klik menu Sign Up Now For Free.

Tersedia kotak formulir yang harus di isi dan isilah kotak formulir pendaftaran tersebut dengan data diri sobat:

First Name : Isi dengan nama pertama sobat.
Last Name : Isi dengan nama terakhir sobat.
Username : Isi dengan username yang sobat mau dan mudah di ingat.
Password : Isi dengan password sobat.
Retype Password : Isi dengan password yang baru saja sobat buat, ingat harus sama.
Your Email : Isi dengan alamat email sobat.

Jika sudah selesai klik tombol Sign Up

Setelah itu sobat akan menerima ucapan terima kasih, dan sobat di suruh untuk mengecek email untuk mem-verifikasi pendaftaran sobat pada situs ini. Bukalah email sobat yang tadi digunakan untuk mendaftar dan klik link yang di berikan untuk mem-verifikasi pendaftaran sobat dan menyatakan bahwa email yang sobat gunakan mendaftar adalah benar-benar milik sobat, jika link diklik tidak mau jalan copy paste link tersebut di browser sobat.
Jika proses verifikasi sudah selesai maka akan ada tulisan Click Here, klik tulisan tersebut maka sobat akan masuk pada halaman kontrol panel.
Untuk membuat menu contact us klik tulisan Create New Form dan yang muncul adalah formulir yang harus sobat isi lagi.

Web Form Name : Isi dengan nama sobat, atau terserah sobat mau di isi apa.
Recipient Emails : Isi dengan alamat email sobat, ini sebagai tujuan utama untuk menerima email.
Spam Email Address : Isi dengan alamat email yang akan menerima pesan spam.
Thank You Page : Isi dengan url postingan sobat yang berisi ucapan terima kasih seperti postingan saya yang ini, atau isi saja dengan url blog sobat.
Number Of Field : Biarkan saja.
Lalu klik tombol Next akan muncul lagi form yang bisa sobat ganti isinya, dibiarkan juga tidak apa-apa.
Selanjutnya klik tombol Next, Next, Next dan Next lagi dan muncul contoh tampilan dari contact form yang baru saja sobat buat.
Klik tombol Finish.
Klik tulisan Get The Html Codes
Copy code-code yang berada dalam kotak berisi tulisan bahasa manusia planet yang susah dimengerti dan simpan pada notepad. Lalu silahkan klik tulisan Sign Out.
Selesai dech, mudah bukan!!!

Langkah selanjutnya masuk pada halaman Dasbor blog sobat, klik menu Entri Baru untuk membuat sebuah postingan, pilih mode Edit Html dan pastekan code yang tadi sobat simpan pada notepad lalu klik tombol publikasikan posting. Selesai.

Sumber: http://mpthreelyrics.blogspot.com/2010/02/cara-membuat-menu-kontak-kami-contact.html

Read more »

27 Website Untuk Mengedit Foto Online

Ada yang tahu tentang edit photo online ?? Hmm saya rasa hampir semua orang kini sudah mengetahui tentang hal ini. Mengedit photo dengan menggunakan jasa suatu web sehingga photo terlihat lebih menarik atau bahkan terlihat lucu. Tapi mungkin kamu hanya mengetahui beberapa situs web saja dan tentunya dengan format template yang itu-itu saja. Nah kini saya ingin berbagi sedikit daftar website yang menurut saya cukup menarik untuk dicoba. Karena jumlahnya cukup banyak jadi anggap saja hari ini saya berbagi bookmark pribadi tentang Edit Photo online..

Berikut 27 website yang dapat kamu coba untuk merubah photo mu menjadi lebih menarik tanpa perlu mengerit sama sekali tentang dunia desain.

facebomb

Picnik
Picnik merupakan website yang sangat luar bisa, karena disana kita diizinkan untuk membuat berbagai macam efek, menambahkan text, atau merubah ukuran gambar sesuka hati kita. Hanya saja ada beberapa fiture yang mengharuskan kita mengupgrade

photofunia
Siapa yang tidak tahu website satu ini? Photofunia sudah terkenal dengan banyaknya template yang mereka sediakan dan siap untuk kita guanakan. Lebih dari 100 template menarik di Photofunai

BeFunky
“Anyone can be an artist” kata-kata itu sering muncul di situs ini karena memang dari web tersebut photo kita akan nampak lebih menarik hanya dengan satu klik saja.

Funphotobox
FunPhotoBox adalah tempat dimana anda dapat membuat gambar lucu dari foto Anda. dengan FunPhotoBox kita dapat menambahkan efek khusus dan tentunya menjadi lebih lucu lagi..

Photo505
Photo505 memiliki tempate yang sangat menarik dengan hasil yang cukup memuaskan..

Loonapix
Banyaknya pilihan template yang manis ditambah proses pembuatannya yang sangat cepat menjadikan kelebihan tersendiri unuk Loonapix

Funny
Kunjungi websitenya untuk mendapatkan keterangan lebih lanjut..

Dumpr
Membuat photo menjadi sketsa pinsil dengan hasil yang sangat menakjubkan..

Wah sepertinya apabila harus mereview website satu persatu akan terlalu memakan waktu dan menguras banyak tenaga jadi lebih baik kamu coba langusng saja satu persatu

Writeonit
Membuat pesan text dengan sangat mudah, menarik dan cepat.

Magmypic
Membuat photo kamu menjadi sebuah cover majalah..

Instyle
Membuat bermcam-macam gaya rambut sebelum kamu pergi ke salon hehe..

Hairmixer
Kunjungi websitenya untuk mendapatkan keterangan lebih lanjut..

Bighugelabs
Kunjungi websitenya untuk mendapatkan keterangan lebih lanjut..

Faceinhole
Kunjungi websitenya untuk mendapatkan keterangan lebih lanjut..

Festisite
Kunjungi websitenya untuk mendapatkan keterangan lebih lanjut..

Fakemagazinecover
Kunjungi websitenya untuk mendapatkan keterangan lebih lanjut..

Celebrity.myheritage
Kunjungi websitenya untuk mendapatkan keterangan lebih lanjut..

Poladroid
Kunjungi websitenya untuk mendapatkan keterangan lebih lanjut..

Fototrix
Kunjungi websitenya untuk mendapatkan keterangan lebih lanjut..

Jpgfun
Hampir mirip dengan photofunai yaitu menyajikan banyak template menarik yang dapat kita isi dengan photo kita

Hetemeel
Kunjungi websitenya untuk mendapatkan keterangan lebih lanjut..

Photovisi
Kunjungi websitenya untuk mendapatkan keterangan lebih lanjut..

Pixisnap
Kunjungi websitenya untuk mendapatkan keterangan lebih lanjut..

Fotocrib
Kunjungi websitenya untuk mendapatkan keterangan lebih lanjut..

Condenet
Kunjungi websitenya untuk mendapatkan keterangan lebih lanjut..

Pizap
Kunjungi websitenya untuk mendapatkan keterangan lebih lanjut..

Blingee
Diperlukan login untuk dapat membuat efek pada photo.

Maaf jika tidak mereview satu-persatu dari masing-masing website karena terlalu banyak so capek banget euyy..

Tapi jika ada yang ingin menambahkan beberapa situs lagi saya akan sangat berterima kasih.. Ok semoga bermanfaat.
Sumber: http://ebenk789.com

Read more »

Membuat Forum Di Blogspot

Blog anda ingin di jadikan tempat diskusi? Atau anda ingin membuat forum di blog anda? Jangan khawatir sekarang ini membuat forum semudah membuat blog. Hanya perlu copy paste kode saja.hehehe... Kalian pernah melihat blog teman sobat ada forumnya dengan adminya,momod nya dan segala macam nya teman sobat sendiri yang mengurus? Seperti blog si master mas doyok di www.masdoyok.co.cc yang blog nya disertai dengan forum dengan title” Forum Lesehan Wae” ,ini di gambarnya,kalo mau berkunjung di klik aja gambarnya

Ada banyak cara untuk membuat forum di blogspot,namun tips ini saya ambil dari mas doyok,maka kita terapkan saja cara milik mas doyok ini. Ok kita mulai membuat forum di blogspot:
1. Silahkan ke alamat http://n3.nabble.com/free-forum.html
2. Mulailah pendaftaran...
- Pada Your Name isi dengan nama Anda
- Pada Forum Name isi dengan nama forum Anda
- Beri keterangan mengenai forum Anda di description.
- Masukkan kode konfirmasi
- Klik tombol Create Forum
3. Pokoknya isi saja dengan bernar. Masa ngisi ginian aja nggak bisa.hehehheee..
4. Jika Anda melakukannya dengan benar, maka akan ada kotak dialog selamat, bahwa forum Anda sudah jadi.






5. Langkah selanjutnya adalah... menyetujui Anda sebagai admin forum tersebut.
- Klik Register To Claim This Forum

- Pada Email isi dengan email Anda

- Ketikkan kata sandi Anda pada Password.
- Pada Your User Name isi dengan nick yang akan Anda gunakan di forum.
- Masukkan kode konfirmasi
- Centang Terms Of Service untuk menyetujui aturan forum
- Klik tombol Register

6. Jika sudah cek email tempat anda mendaftar
- Buka Email Anda dan periksa kotak masuk Anda. Jika tidak ada pesan dari Nabble di kotak masuk, cobalah cek di spam.
- Buka pesan dari Nabble lalu klik link konfirmasi.
- Setelah Anda klik akan ada pesan Registration Confirmed
7. Setelah registrasi di terima dan berhasil click continue

8. Maka anda akan berada pada halaman forum anda, lalu klik embeding option

9. Di sana terdapat kode embed forum yang anda buat,copy semua kode tersebut

10. Kembali ke blog anda, log in dengan user ID anda
11. Setelah itu click new post, jangan pilih di compose,pilih di edit HTML nya saja biar lebih mudah
12. Paste semua kode tersebut
13. Publish postingan anda tersebut,maka sudah terbentuklah forum di blogspot anda sendiri
14. Jika anda ingin lebih mudah memngaksesnya, copy url postingan forum anda tersebut lalu masukkan di horizontal menu anda di header blog anda.
15. Selamat berforum ria

Sumber : http://bola-lover.blogspot.com

Read more »

Widget Contact form

Sebenarnya banyak banget contact form, kalo kita cari di mbah google, tapi disamping free pemasangannya.

Kalo kita inginkan widget tersebut nampang di blog kita. ya mau tidak mau harus cari yang pra bayar / paska bayar ( kayak kartu perdana :P ) . lain halnya dengan blog yg punya domain / hosting sendiri yang mempunyai fasilitas seperti itu. tapi jangan berkecil hati dulu buat BLOG yang masih nge-kost :)

Posting kali ini membahas hal yang seperti itu, “gimana cara pasang widget contact form di blogger” alias tips and triks blogger, ok cekidootttt….

Powerder by :

1. sebelumnya SignUp dulu disini (sambil baca sambil praktek!)
2. isi form yang ada seperti : Nama, e-mail ( email pemberitahuan jika ada kontak dari orang lain), username (untuk LOGIN), Password (untuk LOGIN)
3. setelah semuanya form yg disediakan terisi lalu SUBMIT / send, silahkan konfirmasi lewat e-mail yang sobat masukkan tadi.
4. kalo di INBOX email udah terverifikasi, silahkan LOGIN di KONTACTr me dengan menggunakan USER sama PASSWORD sobat tadi.
5. sudah masuk dasbor Kontactr me silahkan Copy Paste code yang disediakan, seperti gambar dibawah ini :

ok, sampai disini masih ada yang bingung?? lanjutt ….

1. LOGIN di account blogger sobat
2. tambah Posting Baru.
3. pada TAB “edit HTML” masukkan code / scripts yang sobat copy paste dari Kontactr me tadi.
4. simpan Posting.
5. Selasai, done! dan lihat hasilnya di blog sobat.
6. kalo masih ragu, apa contact form itu sudah bekerja? coba isi contact form itu sendiri.
7. terus buka e-mail sobat, dan lihat hasilnya.

Sekian.

Sumber : http://lolidsonline.blogspot.com

Read more »