Simple steps for making a scroll bar for widget

Salam semua.. Erm semenjak blog saya bertukar wajah ni, ramai pula yang bertanya tentang tutorial nak buat apa yang saya buat.:) Contohnya scrollbar untuk widget di sidebar blog anda macam saya punya..

Setiap widget yang berbentuk list sebegini memang saya dah kemaskan gunakan scrollbar. So takdelah dia bersepah-sepah atau berterabur. Jadi, kali ni saya baik hati [baiklah sangat :p] nak share dengan anda camne nak jadikan widget kita scroll bar macam tu.:)

Actually saya ambil daripada blog teknikbuatblog.blogspot.com. Mudah je! Saya buat-buat terus jadi. Thanks kat blog tersebut sebagai credit. Nak tahu camne caranya?? Jom tengok kaedahnya!

1st : Go to Design or Template > Choose Edit HTML > Click on Expand Widget Templates (Example: In red box)

2nd : Press Ctrl + F and type the title of one of your widget. For example : Bloglisted! 

3rd : Then you will find the code like this : <b:widget id='Bloglisted1' locked='false' title='Bloglisted!' type='BlogArchive'>

4th : After code either <div class='widget-content'> or some blog will have this code <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>,  copy and paste code below:

<div style='width: 190px; background: url(&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUTon4s67IDDZzcr3qgbtHJwiiRnhh_9DoqK4-TP_DYhgJNaHyRVtz1pvVYHfoB-zBzdWi08139E5ho_o_NbdCMnfbhJgiQin0SKTzDqG9SIrydfw7XRQJVQYdUIrFst-vU0zvlE9l5r8/s1600/black.png&quot;) repeat scroll 0% 0% transparent; overflow: auto; height: 100px; border: 1px solid rgb(206, 206, 246); -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; padding: 20px; margin: 3px 0pt 0pt;'>

5th : Then, scroll down and you will find this code : <b:include name='quickedit'/>. 

6th : Next, put  </div> after that code. 

7th : Then click Save Template.

Notes: You can change the blue code with another image url to change the background of your widget. You also can adjust the size of widget by adjusting the width and height of green code. If you want to change another widget to become a scroll bar just repeat the same steps. Very easy!=)

Sumber : SINI

Cik Misya : Ilmu semakin dikongsi semakin bertambah.