Catatan Si Budi

Home » Archives for 2011

Cara menghilangkan Navigasi Bar (Navbar) Blogger (Auto hide Navbar)

Cara menghilangkan Navigasi Bar (Navbar) Blogger (Auto hide Navbar) - Mungkin anda kadang melihat blog yang masih menampakkan navigasi bar.Secara default saat anda membuat blog,akan tampak navigasi bar yang terletak di bagian atas blog. Navigasi bar berguna untuk mempercepat login ke account blog anda untuk mengedit atau menambah postingan. Karena anda bisa langsung menekan tombol Sign in untuk masuk ke dashboard blog anda.

Jika anda telah menghilangkannya, maka untuk melakukan pengeditan atau menambah postingan, anda harus log in ke account blog anda pakai url:
http://www.blogger.com

Untuk menyembunyikannya, anda bisa gunakan prosedur berikut:

1. Login ke dashboard anda
2. Pilih Tata Letak => Edit Html => Centang "Expand Template Widget"

3. cari kode seperti di bawah ini

![CDATA[

4. Masukkan kode berikut setelah kode di atas

#navbar { height: 0px; visibility: hidden; display: none; }

5. Klik tombol SIMPAN Template. Silahkan Lihat perubahan pada blog anda.

Catatan:
Jika di template anda menemukan kode

/*-- teks */

letakkan script setelah /* --teks --*/
karena script atau teks yang ada dalam cakupan /* teks */ tidak diproses, karena dianggap sebagai keterangan.

Contoh:

![CDATA[/*-----------------------------------------------
Blogger Template Style
Name: Rounders 3
Date: 27 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */

diubah menjadi:

![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name: Rounders 3
Date: 27 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */
#navbar { height: 0px; visibility: hidden; display: none; }

Selain menghilangkan navbar, kita juga dapat membuat navbar autohide, yaitu navigation bar (nav bar) akan muncul saat mouse beada di posisi paling atas blog, jika mouse digerakkan/atau dipindahkan dari lokasi navbar, maka navbar akan menghilang(disembunyikan)

Untuk membuat navbar autohide, cukup ganti kode

#navbar { height: 0px; visibility: hidden; display: none; }

menjadi:

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)} #navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}

Kamis, Juni 02, 2011 | 0 comments

Cara Memasang Favicon

Cara Memasang Favicon - Favicon adalah icon kecil yang muncul pada tab browser seperti tampak pada gambar di samping. Pemasangannya tidak begitu sulit tetapi karena ada beberapa hal yang musti diperhatikan seringkali orang menganggap tutorial yang mereka baca tidak berhasil.

Langkah-langkah pemasangan favicon :

1. Siapkan gambar icon yang ingin dipasang dengan extensi yang mudah saja seperti .jpg, gif, atau png. Lihat: Membuat Gambar Favicon dengan Favicon generator.

2. Upload gambar icon yang sudah diedit. Anda bisa Upload di http://www.geocities.ws/

3. Selanjutnya silakan login ke Dasbor Anda di blogspot, buka menu Tata Letak atau Layout, kemudian pilih Edit HTML.

4. Pada jendela Edit HTML, letakkan kode berikut ini di antara tag <head> dan </head>

<link href="http://gambar_Anda.jpg" rel="shortcut icon"/>

5. Silakan ganti tulisan berwarna merah dengan alamat image yang Anda upload.

6. Jika sudah selesai, jangan lupa disimpan perubahan.

Semoga tips cara pasang favicon ini bisa berhasil.

Rabu, Mei 25, 2011 | 0 comments

Membuat Gambar Favicon dengan Favicon generator.

Membuat Gambar Favicon dengan Favicon generator - Untuk membuat Favicon secara online sudah banyak situs yang menyediakannya dan salah satu yang akan saya jelaskan kali ini yaitu favicon generator Ala Favicon.cc. Favicon.cc sendiri menurut saya adalah salah satu situs yang memudahkan kita untuk membuat gambar favicon.
Bahkan dengan beberapa menu yang simple dan mudah dimengerti, saya yakin pemula pun akan sangat gampang menggunakan favicon.cc ini.

Langsung saja ke tahap pembuatan, silahkan ikuti tahap-tahapnya dibawah ini:

1. Carilah gambar yang akan digunakan untuk membuat favicon yang berformat jpg dan png, untuk gambarnya bisa anda cara di google.
2. Masuk kesini, anda akan dibawa kehalaman utama favicon.co.uk
3. Scroll ke bawah, dan anda akan menemukan form upload, lalu uploadlah gambar yang akan dijadikan favicon, pilih 16x16, dan klik Generate Favicon.
4. Setelah diupload, scroll sedikit ke bawah, anda akan menemukan link yang bertuliskan Download Your Favicon Here, klik link itu dan download.

Untuk cara pemasanganya:

1. Login dahulu.
2. Masuk ke dasbor => pengaturan => Favicon (Unggah).
3. Lalu klik Simpan.

Rabu, Mei 25, 2011 | 1 comments

Cara Membuat Formulir Pasang Iklan

Cara Membuat Formulir Pasang Iklan - Cara Membuat Formulir Pemasangan Iklan. Sebenarnya banyak situs yang menyediakan layanan seperti , membuat kontak form, email form, dan sebagainya. Namun pada tutorial kali ini saya akan memakai emailmeform.com sebagai contoh. Dengan fasilitas yang diberikan oleh Emailmeform.com, kita bisa membuat formulir seperti pasang iklan, contact form, kirim email dan sebagainya. Nah, jika Sobat masih bingung, masih belum paham seperti apa contohnya,

Silahkan kunjungi halaman Pasang Iklan, klik di sini

Nah, hasilnya cukup keren kan, kita bisa memodifikasi formulir-formulirnya, bisa mengatur kustomisasi/tampilan formulir tersebut, semisal, pengaturan warna, text, kotak isian ,dan lain-lain
Mari kita menuju tutorialnya saja,

Buka situs emailmeform.com ( http://www.emailmeform.com/ )
Sign Up terlebih dahulu

Isi formulir pendaftaran, dan SignUp

Setelah itu, verifikasi dengan membuka pesan di inbox atau kotak pesan email Sobat
Nah, jika sudah diverifikasi, maka Sobat bisa langsung menuju halaman pembuatan, pilih template

Nah, dari daftar tersebut Sobat bisa memilih kira-kira mana yang cocok untuk dijadikan Formulir Pasang Iklan. Kalai formulis seperti punya saya, Sobat pilih yang Bussines >> Cupcake Order Form

Jika sudah memilih salah satu, lalu klik tombul "Customize" di bagian atas

Akan terbuka halaman Editing Form, nah pada bagian ini Sobat bisa edit-edit formulir Sobat

Setelah puas meng-kustomisasi/edit formulirnya, tinggal disave, klik tombol save di bagian bawah

Maka akan muncul kotak pop, lalu pilih "Take me back to the form Manager"

Setelah itu, cari kode kotak formulir yang barusan Sobat buat, dengan klik pada kode,

Nah, ada 4 pilihan disana, jika Sobat akan meletakkan kotak formulir tersebut di dalam postingan, maka pilih kodenya yang "HTML Only", jika untuk tombolnya saja pilih yang "HTML Form button"

Selesai

Bagi Pemula yang belum tau cara memasang di halaman post, mari ikuti tutorial berikut ini,

Masuk ke blogger >> Buka New Post >> Pilih yang Edit HTML bukan Compose dan letakkan kode tadi

Demikian tutorial kali ini, bagi Pengunjung yang ingin memasang iklan berupa text maupun banner silahkan masusk ke halaman PASANG IKLAN klik di sini

Selasa, Mei 24, 2011 | 0 comments

Menambah Emoticons di shoutbox

Pernah melihat kepala-kepala ajaib seperti ini :

smile emoticons

Bagi sobat yang pernah atau sering mengisi buku tamu di blog, maka tentu saja tidak tidak akan asing lagi dengan kepala-kepala ajaib tersebut. Yups..... betul sekali, kepala ajaib tersebut adalah smiley atau emoticons miliknya Shoutmix yang di simpan dalam fasilitas yang di berikannya yaitu buku tamu.

Dengan adanya emoticon dalam buku tamu, ini akan lebih mempertegas karakter si pemberi komentar, walaupun tentu saja ada juga yang hanya berpura-pura mempunyai karakter tersebut. Bagi sobat yang menggunakan buku tamu dari shoutmix, apabila sobat berkeinginan untuk menambah kepala-kepala ajaib, hal itu bisa sobat lakaukan. Misalkan sobat ingin menambahkan si kepala ini

atau malah yang ini

atau mau yang lebih ekstrim lagi seperti ini

.

Kepala-kepala tersebut sebenarnya bisa di tambahkan di buku tamu Shoutmix, yang penting sobat mengetahui atau mempunyai alamat gambar kepala ajaib nya. Bagi sobat yang sangat menyukai emoticons dari yahoo! messenger, sobat bisa melihat alamat gambarnya di sini!, yang diperlukan hanyalah alamat gambarnya saja, misalkan di sana di terangkan bahwa untuk menampilkan smile seperti ini

adalah memakai kode seperti ini :

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif" width=34 height=18 border=0>

kode yang diperlukan adalah kode yang ini saja :

http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif

Ingin tahu cara memasukan smiles tersebut ke buku tamu shoutmix? silahkan ikuti langkah-langkah berikut :

Silahkan login di Shoutmix, tentunya memakai username serta pasword yang sobat miliki.
Pada menu Display, klik yang untuk Smiley
Masukan alamat gambar yang di inginkan pada kotak di bawah tulisan Smiley image URL.
Klik pada tombol Add yang berada di sampingnya.
Masukan kembali alamat gambar smile yang lain apabila masih ada yang masu di masukan, jangan lupa untuk klik kembali tombol Add nya.
Klik tombol Save Settings.
Selesai.

Apabila sobat sudah melakukan langkah-langkah di atas, maka secara otomatis pada buku tamu yang ada di blog nya akan memiliki kepala ajaib yang tadi di masukan tanpa harus mengubah apa-apa lagi pada kode templatenya.

Rabu, Mei 18, 2011 | 0 comments

Menambah Smileys Yahoo! Messenger Emoticons di Postingan Blogspot

Buat kawan-kawan yang ingin menghiasi posting-annya dengan berbagai ekspresi dari yahoo, saya berikan source codenya, biar anda bebas ngakak atau cemberut selagi posting. Silahkan copy source code berikut, sisipkan pada kata yang sesuai dengan postingan anda.

:)happy

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif" width=18 height=18 border=0>

:(sad

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif" width=18 height=18 border=0>

;)winking

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif" width=18 height=18 border=0>

:Dbig grin

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif" width=18 height=18 border=0>

;;)batting eyelashes

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif" width=18 height=18 border=0>

>:D<big hug

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/6.gif" width=42 height=18 border=0>

:-/confused

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif" width=20 height=18 border=0>

:xlove struck

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif" width=18 height=18 border=0>

:">blushing

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/9.gif" width=18 height=18 border=0>

:Ptongue

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif" width=18 height=18 border=0>

:-*kiss

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif" width=18 height=18 border=0>

=((broken heart

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif" width=18 height=18 border=0>

:-Osurprise

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif" width=18 height=18 border=0>

X(angry

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif" width=18 height=18 border=0>

:>smug

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/15.gif" width=18 height=18 border=0>

B-)cool

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/16.gif" width=18 height=18 border=0>

:-Sworried

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/17.gif" width=18 height=18 border=0>

#:-Swhew!

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/18.gif" width=18 height=18 border=0>

>:)devil

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/19.gif" width=18 height=18 border=0>

:((crying

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif" width=18 height=18 border=0>

:))laughing

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif" width=18 height=18 border=0>

:straight face

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif" width=18 height=18 border=0>

/:)raised eyebrow

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/23.gif" width=18 height=18 border=0>

=))rolling on the floor

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif" width=30 height=18 border=0>

O:-)angel

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/25.gif" width=30 height=18 border=0>

:-Bnerd

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/26.gif" width=18 height=18 border=0>

=;talk to the hand

<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/27.gif" width=18 height=18 border=0>

Selamat mempercantik postingan nya...

Rabu, Mei 18, 2011 | 0 comments

Catatan Si Budi

Advertise