Di tutorial ini saya akan memberikan hiasan di blog anda dengan menampilkanmenu HUBUNGI SAYA,seperti di samping blog kiri ini sebelum memulai saya akan jelaskan dulu tentang menu ini. Pencipta menu ini bernama MAXIMUS nama asli menu ini " Dinamic - FX Slide in Menu ( v 6.5 ) " Original Source Code serta contoh dari menu tersebut bisa di lihat disini
tapi hanya untuk menampilkan link.Disini saya menggantinya dengan gambar ,yang pastinya lebih memberikan informasi bagi pengunjung blog dan kelihatannya menarik bukan :D
Sebelumnya Saya akan memberikan source code dahulu dan bisa anda download di sini
Klo sudah anda download file tersebut,extract file nya dan akan menghasilkan 2 file yang berextensi ( ssm.js dan ssmItems.js ) dan yang di edit hanya file ssmItems.js buka file itu menggunakan text editor seperti notepad.
Untuk memulainya ikuti langkah langkah berikut ini :
1.Klik kanan pada file yang bernama ssmItems.js , kemudian pilih open with dan pilih notepad
2.Isi file ssmItems.js adalah sebagai berikut :
Kode kode di atas adalah untuk mengatur tampilan menu hubungi saya, untuk lebih jelasnya baca baik baik di bawah ini :Baris
00.mengatur posisi menu pada baris y axis layar monitor (vertical)
01.mengatur posisi menu pada x axis layar monitor (horizontal)
02.untuk mengatur posisi vertical menu, pada layar monitor
03.kecepatan slide
04.waktu tunggu lamanya menu muncul setelah mouse menjauhi menu
05.untuk mengatur warna background menu, gunakan kolor picker dibawah posting ini untuk melihat kodenya
06.untuk men-set apakah menu harus tetap statis pada layar
07.Mengatur lebar menu. Harus kelipatan dari angka 10! Tanpa tanda kutip
08.jumlah kolom
09.jenis huruf header
10.ukuran huruf header
11.warna teks header. gunakan kolor picker dibawah posting ini untuk melihat kodenya
12.warna backround header. gunakan kolor picker dibawah posting ini untuk melihat kodenya
13.perataan teks header
14.perataan teks vertikal header
15.tinggi header
16.warna background bar. gunakan kolor picker dibawah posting ini untuk melihat kodenya
17.jenis huruf bar
18.ukuran huruf bar
19.warna huruf bar. gunakan kolor picker dibawah posting ini untuk melihat kodenya
20.perataan teks bar secara vertikal
21.lebar bar
22.Kata kata yang akan muncul pada bar hubungi saya
23&24. Ganti http://www.domainkamu.com/gambarphoto.jpg dan http://www.domainkamu.com/gambaremail.jpg dengan url dimana kamu upload gambar photo dan email dan jangan lupa ganti kata-kata kamu dengan kata yang kamu inginkan di bawah kata2 tersebut akan muncul gambar email.
26.buat menu
jika sudah selese mengedit file ssmItem.js tersebut simpan dan upload lah file tersebut dengan file ssm.js ke web hostingan kamu seperti googlepage , ripway dll
jng lupa untuk mengcopy alamat url ke 2 file tersebut
Sekarang saat nya memasukan script tadi ke dalam blog kita
1. Login ke blogger klik Layout/tata letak --------> edit html
2.Cari kode <body> klo dah ketemu copas kode tersebut diatas kode </head>
<script src='http://misalkan.googlepages.com/ssm.js' type='text/javascript'></script>
<script src='http://misalkan.googlepages.com/ssmItems.js' type='text/javascript'></script>
simpan dan lihatlah blog kamu
Note:agar gambar foto terlihat pas, saya sarankan resolusi foto berukuran 173X244 pixels, jika anda sudah mahir dengan kode-kode diatas anda bisa ganti dengan sesuka anda,ukuran menu, kecepatan, pesan2,gambar,/terserah anda,biarkanlah diri anda bekreasi lebih jauh.
Sumber artikel ini ada disini
1 komentar:
gut gut lieur euyyyyy
Posting Komentar