Membuat Menu Hubungi Saya

Seperti yang kamu lihat di sebelah kiri blog-Q, ada menu hubungi saya yang selalu mengikuti ke atas dan ke bawah tergantung scroll bar-nya. Nah, atas request Ardi, aku akan tunjukin gimana cara  membuat menu seperti ini. Numpang ngunduh juga untuk blog-nya Mas Agung, karena aku ambil postingan ini dari blog Mas Agung. Nah, karena source kode-nya cukup panjang, maka kamu download dulu di sini. Terdiri dari dua file. Yang satu namanya ssm.js, yang satunya namanya ssmitem.js. Kamu harus download dua-duanya untuk bisa membuat menu seperti ini

Untuk link download ssm.js di sini:

Download ssm.js

Untuk download sssmitem.js di sini:

Download ssmItem.js

File yang saya berikan dalam bentuk rar. Oleh sebab itu, kamu harus meng-extrak-nya terlebih dahulu.

Setelah keduanya kamu extrak, buka file yang namanya ssmItem.js. Sementara yang ssm biarin aja, karena itu nggak perlu di edit. Cara bukanya yaitu dengan klik kanan file ssmItem.js kemudian open with trus notepad.

Ntar, isinya seperti ini (di sampingnya ada penjelasan maksudnya, tapi di notepadnya g ada yah!):

YOffset=200; ------------------>  atur posisi menu pada y axis layar (vertical)
XOffset=0; ---------------------> atur posisi menu pada x axis layar (horizontal)
staticYOffset=150; ----------->  atur posisi vertical menu, pada layar
slideSpeed=20 ---------------->  kecepatan slide
waitTime=100; --------------->  waktu tunggu menu muncul setelah mouse jauhi menu
menuBGColor="#d1d8ec";----> atur warna background menu
menuIsStatic="yes"; ----------> men-set apakah menu harus tetap statis pada layar
menuWidth=180; -------------> atur lebar menu. Musti Kelipatan 10! g pake tanda (“”) 
menuCols=2; ------------------> jumlah kolom
hdrFontFamily="verdana"; –—> jenis huruf header  
hdrFontSize="2"; --------------> ukuran huruf header 
hdrFontColor="#000000"; ----> warna teks header 
hdrBGColor="#ffffff"; --------> warna backround header
hdrAlign="left"; ---------------> perataan teks header
hdrVAlign="center"; ----------> perataan teks vertikal header
hdrHeight="300"; -------------> tinggi header
barBGColor="#000000"; ------> warna background bar
barFontFamily="Verdana"; ---> jenis huruf bar
barFontSize="2"; --------------> ukuran huruf bar
barFontColor="#FFFFFF"; ----> warna huruf bar
barVAlign="center"; ----------> perataan teks  bar secara vertikal
barWidth=15;  ----------------> lebar bar
barText="Hubungi saya"; ----> Kata-kata yang akan muncul pada Bar (hubungi saya)
ssmItems[0]=["<center><img src=http://hostinganmu.com/gambarfoto.jpg><br>Kata-Kata Kamu di atasnya gambar Emailmu seperti punyaku begini “Jika ada pertanyaan, kirimkan ke:” <br><img src=http://hostinganmu.com/gambaremail.jpg> "]

buildMenu();

Penting!!!!!!!!!!!!:

• Supaya gambar fotomu jelas n gak kebesaran, pake resolusinya 173x244 pixels.
• Untuk kode warna, bisa kamu lihat kodenya di sini.
• Gambar Email supaya tidak kebesaran, gunakan resolusi 160x21 pixels.

Klo kamu udah selesai melakukan pengeditan, Save hasilnya, n tutup notepadmu. Ingat! Pastikan telah tersimpan dalam bentuk javascript file (js). Kemudian, uploadlah kedua file tadi ke hostinganmu. Misalnya Geocities, 4shared, ziddu, dll. Klo udah, tibalah waktunya masukin kode file-mu ke blogmu. Caranya:

1. Login ke Blogger.

2. Ke Layout/tata letak.

3. Pilih tab menu Edit HTML.

4. Jangan lupa, download dulu template kamu dengan cara menekan download full template, supaya kalau error, kamu sudah punya back-up-nya.

5. Cari kode </head>. Klo udah, copaz code berikut ini di atas kode </head>.

<script src='http://www.geocities.com/faizunaa17/ssmhubsaya.js' type='text/javascript'></script>
<script src='http://www.geocities.com/faizunaa17/ssmItemhubsaya.js' type='text/javascript'></script>

Note: Ganti kode yang berwarna silver dengan url hostinganmu.

Enjoy it! N don’t 4-get leave me comment under this post.

Masukkan Alamat Email Anda Untuk Mendapatkan Artikel Terbaru Blog Faiz Gratis!