Tutorial | Cara Buat Scroll Bar Pada Bloglist

by - January 13, 2019


Tutorial | Cara Buat Scroll Bar Pada Bloglist | Hi korang. Kali ni nak buat perkongsian tutorial cara nak buat scroll bar pada bloglist khas untuk platform blogspot. Tercetusnya tutorial ini adalah disebabkan Diah bosan tengok template blog sendiri yang terlalu simple. Jadi berhasrat nak masukkan bloglist tapi tak mahu biarkan dia jadi panjang berjela.

Tak la pandai sangat part nak edit blog ni tapi memang suka mencuba. Puas hati kalau dapat buat sendiri. Lepas google, tanya kawan-kawan blogger dan cuba akhirnya Diah berjaya buat. Tepuk bahu sendiri. Syabas! Kalau ikut pembacaan ada dua cara nak buat jadikan scoll bar; iaitu HTML dan CSS. Dua-dua Diah cuba dan menjadi.

Tutorial
Tutorial - Cara Buat Scroll Bar untuk Bloglist

Sebelum tu Diah dah rujuk beberapa blogger yang pandai buat dan sayangnya tutorial semua dah out dated. Tapi Diah terjumpa perkongsian blogger tutorial ni dan menjadi blogger-blog-tutorial.blogspot.com

Sebelum buat apa-apa perubahan sila buat back up template sedia ada supaya tiada penyesalan di kemudian hari. Sebelum save template tekan preview. Elok baru tekan save ye korang. Kalau tak jadi harapnya janganla marahkan ahkak. Oh ya, bila kita edit template dan customize macam kita nak ni ada baik buruk yang korang perlu tahu tau.

Baiknya blog ikut kehendak kita dan buruknya ialah kemungkinan akan ada widget sedia ada dekat blog tidak berfungsi. Pengalaman Diah sendiri, tak tahu la kebetulan atau suratan lol komen box hilang lepas selesai proses edit. Jadi bersiap sedia ya.

Macamana tahu komen box hilang? Ok Diah dapat tahu bila ada reader tak dapat nak view komen box melalui mobile, kalau view dekat desktop/ laptop pun sekejap ada sekejap hilang. Macam Chipsmore kau. Berita baiknya Diah kongsi sekali tutorial cara atasi ruangan komen hilang. Baca sampai habis please.

Back to tutorial cara nak Buat Scroll Bar Pada Bloglist. Cara-caranya ialah seperti berikut:

#1 Pastikan Bloglist widget memang dah siap di pasang dekat blog korang. Kalau belum ada buat dahulu. Log in – dashboard – add gadget – blog list – masukkan senarai list blog – save.

Insert Gadget Scroll Bar Pada Bloglist
Masukkan Gadget Blog List 
Cara Buat Scroll Bar Pada Bloglist
Pilih Blog List yang korang nak

Ini gambar sebelum blog list ni boleh di scroll dan panjang berjela. Jadi sekarang kita nak pendekkan dan jadikan dia boleh scroll. Nampak sopan sikit.

Blog list wish
Blog list Biasa dia akan jadi panjang ikut pilihan kita buat
#2 Dashboard – Theme – Edit HTML – control F dan cari code ni



Bila dah jumpa korang kena copy code bawah ni dan paste kan di atas code yang korang cari tadi

.blog-list-container {height:355px;overflow:auto;}

edit HTML Scroll Bar Pada Bloglist
Edit HTML
Copy Paste Code yang diberikan

Seperti biasa dah edit sila tekan preview dahulu, tara bloglist dah keluar scroll bar. Tara dah jadi pun.

Siap Tutorial | Cara Buat Scroll Bar Pada Bloglist
Jadi pun Scroll Bar Pada Bloglist 
Cara Mengatasi Kotak Komen Hilang

Bila dah siap boleh la bergembira sementara. Jom teruskan dengan tutorial cara mengatasi ruangan komen yang hilang.

Faktor-faktor utama masih tak dapat dikenal pasti tapi bila kita cuba edit dan tambah gadget dekat blog kemungkinan tinggi benda-benda macam ni akan jadi. Sebelum ni pernah jadi juga jadi kotak komen tak muncul jadi Diah kongsikan cara mengatasinya supaya senang nak rujuk di masa hadapan. 
Diah rujuk entri dari sahabat ni dawinz.com

#1 Dashboard – Theme – Edit HTML – control F dan cari code ni ]]>


#2 Dah jumpa code tu, copy code dibawah dah paste kan di atas code tadi

.mobile .blogger-iframe-colorize {
display: block !important;
}
.blogger-iframe-colorize {
display: block !important;
}

#3 Tekan preview dan save jika tiada masalah.

Selamat mencuba!

You May Also Like

1 comments

  1. Bila buat scrollbar mcm ni kemas sikit sidebar blog kan :) Tahniah kak! Siap ada tutorial extra. Hehe.

    ReplyDelete

Kata-kata yang lemah dan beradab dapat melembutkan hati dan manusia yang keras.

Terima kasih sudi comment.

SUBSCRIBE NEWLETTER