Selasa, 05 Februari 2013

Tutorial: Floating Sidebar


Wind!Wind! Belakangan ini cukup berangin ya?

Konnichiwa Minna-san!Gomen aku lama engga nge-post ya!#ngebungkuk
Ternyata rajin nge-post itu sulit buatku yang pemalas tingkat dewa ini >_<. Yah aku emang agak sibuk juga akhir-akhir ini, sekolah pulangnya engga tentu.Pulang sekolah udah cape banget, pengennya tidur, yah internetan dulu sih, tapi paling cuma cari info AniMangaVoca. Kenapa aku ngepost siang-siang? Aku hari ini izin sakit, yah aku emang bandel malah internetan padahal sakit #sesat.

Oh iya, aku mau kasih Tutorial nih, Tutorial Pertama selama aku blogging loh! jadi maaf kalau masih kurang jelas dan berantakan ^_^". Tutorial ini engga aku ambil dari siapapun, dan aku nemuinnya secara engga sengaja waktu lagi stress nyari tutorial, aku engga nemuin tutorial yang aku mau, akhirnya aku coba eksperimen. Alhamdulillah, ketemu juga kode(aneh)ku, dan kode ini sangat, sangat simpel loh!

Emmm, Kalian masih bingung apa itu Floating Sidebar? Maksud dari Floting Sidebar adalah sidebar blog(tau kan?) kalian akan tetap muncul di layar meskipun kalian men-scroll kebawah, contohnya ya... seperti di blog-ku ini.
Try This Minna-san!
  1. Masuk ke Akun blogger
  2. Pilih Template, lalu klik edit HTML
  3. Klik Expand Widget Templates
  4. Cari kode   .sidebar .widget {  Kalau kalian menemukan dua kode seperti ini, kalian terserah mau memakai yang mana karena dua-duanya bisa dipakai. Tapi engga di semua template ada kode ini, untuk sementara aku belum tau, mungkin suatu saat aku bakal meng-update soal kode ini(tapi engga Janji loh!) Atau kalau engga sabar menunggu aku meng-update, silahkan ganti template kamu ke template yang ada kode tadi.
  5. Nah, ada perbedaan untuk kode selanjutnya, yaitu kalau kalian mau menempatkan Sidebar di kanan atau kiri blog. Kalau kalian ingin menempatkan sidebar ini di sisi kanan blog, maka yang perlu kalian lakukan hanya menempatkan kode ini: display:scroll; position: fixed; dibawah kode nomor 4 tadi. Sedangkan kalau mau menempatkannya di kiri, maka letakkan kode ini dibawah kode nomer 4 display:scroll; position: fixed;left:100px; top:300px; (Keterangan: left: 100px itu bisa diganti, semakin besar angkanya, semakin dekat dengan post, begitu juga sebaliknya, top:300px juga bisa diganti, semakin besar angkanya, semakin jauh dari atas blog, bigitu juga sebaliknya. Ini Bisa disesuaikan seperti keinginan kalian ^_^")
  6. Lalu Preview! kalau sudah sesuai keinginan kalian, save Template
  7. Floating Sidebar siap disajikan! >w< #Plakk
  8. Tips: Kalau sudah jadi, pasti widget-widgetnya numpuk, jadi usahain cuma ada satu widget di sidebar ya! untuk memaksimalkan widget, lebih baik pakai Html/Javascript agar bisa memuat banyak widget. Untuk pengaturan-pengaturan lainnya, itu terserah kalian saja ^w^
Gimana? simpel? e-eh? Ribet ya?
Hehehe... ^_^" Gomen kalau membingungkan ya...
Kalau ada yang ingin ditanyakan, tanya lewat komentar ya...

Tidak ada komentar:

Posting Komentar