Cara Membuat Menu Scroll Pada Blog Ataupun Juga Bisa Pada Website. Kali ini saya akan mencoba berbagi tentang bagaimana caranya membuat scroll pada blog yang seperti kita ketahui bahwa jika suatu posting atau menunya linknya yang terlalu banyak tentunya akan membuat kita jengkel karena kelihantannya sangat berantakan sekali bahkan terlalu kepanjangan apabila kalau isi dari posting atau link kita yang terlalu banyak sehingga akan memakan halaman yang begitu banyak pula. Nah maka dari itu saya akan mencoba berbagi kepada sahabat blogger untuk mempermudah dan mempercantik blog kita agar kelihatannya enak di lihat juga.
Cara pertama yang harus di lakukan adalah tentunya dengan Login dulu, lalu masuk ke posting baru, dan di situ di menu yang paling atas ada yang namanya Compose dan HTML. Dan juga bisa dengan cara setelah Login bisa masuk ke menu >> Tata Letak >> Tambahkan Gadget >> Pilih HTML/JavaScript >> setelah itu bisa juga di masukkan kode Scriptnya ke dalam HTML/JavaScript. Nah di HTML inilah coba masukkan kode Script di bawah ini :
<div style="overflow:auto;width:250px;height:220px;padding:10px;border:5px solid #eeee">
<li><a href="http://harapansebuahcintaabadi.blogspot.com/2013/09/nattasha-nauljam.html">Koleksi Foto Nattasha Nauljam</a></li> <li><a href="http://harapansebuahcintaabadi.blogspot.com/2013/09/arena-suck-seed-ost-with-lyrics.html">Arena Suck Seed OST with lyrics</a></li> </div> |
Keterangan :
Untuk text yang berwarna Biru dan juga Warna Ungu bisa kalian gantinya alamatnya dengan alamat blog kalian masing-masing yang ingin di masukkan dalam menu scroll dan judulnya juga seperti yang sudah tertera di atas. Untuk lebih jelasnya kalian bisa lihat contoh gambar di bawah ini yang sudah saya berhasil bikin scroll menu sendiri.
Keterangan lainnya di atas ada kode width:250px;height:220px di situ kalian juga bisa merubah angka 250 dan 220 nya menjadi yang sesuai dengan yang kalian inginkan karena berpengaruh kepada lebar dan panjangnya juga, setelah itu simpan dan lihat hasilnya.
Sekedar tambahan untuk menu scrollnya. Mungkin kalian aneh tampilannya tidak seperti yang ada pada gambar. Gampang tidak usah di bawa sulit dan bingun, kalian cukup menambahkan script <ol type=”i”> sesudah script <div style="overflow:auto;width:270px;height:230px;padding:10px;border:1px solid #eeee"> yang ada di awal kode dan di tutup dengan kode script </ol> sebelum kode </div> yang ada di akhir.
Nah selanjutnya tinggal kalian coba utak-atik sendiri HTMLnya jika ingin tampilan yang berbeda. Insya Allah di lain waktu saya akan menjelaskan tab yang ada nomor, abjad, dsb. Sekian dulu dari saya, semoga dengan adanya tutorial ini akan sangat bermanfaat bagi semuanya. amiin.
Jika ingin share artikel ini tolong di cantumkan URL dan sumbernya dari mana. Terima kasih.
Tidak ada komentar:
Posting Komentar