របៀប​ដាក់​​កូដ​របារ​រមូរ (Scroll bar) ដែល​មាន​ពណ៌​ស្អាតៗ​សម្រាប់ Blogger (៦ស្ទីល)

ចែកចាយ:

សួស្ដី​ប្រិយមិត្ត និង​អ្នក​ដែល​កំពុង​ប្រើប្រាស់ Blogger ទាំងអស់​គ្នា ថ្ងៃ​នេះ​ខ្ញុំ​ដកស្រង់​គន្លឹះ CSS ក្នុង​ការ​កែប្រែ​រូបរាង Scroll bar...


សួស្ដី​ប្រិយមិត្ត និង​អ្នក​ដែល​កំពុង​ប្រើប្រាស់ Blogger ទាំងអស់​គ្នា ថ្ងៃ​នេះ​ខ្ញុំ​ដកស្រង់​គន្លឹះ CSS ក្នុង​ការ​កែប្រែ​រូបរាង Scroll bar ដែល​ជា​ភាសាខ្មែរ​គឺ របារ​រមូរ ដែល​មាន​ពណ៌​ស្អាត​ៗចំនួន ៦ស្ទីល ។ កូដ​នេះ​ដំណើរការ​ជាមួយ​កម្មវិធី​រុករក​អ៊ីនធឺណិត​ដែល​ស្គាល់ Webkit ដូចជា Opera, Chrome, Safari, UC Browser ដែល​សម្រាប់ firefox គឺ​អត់​ដើរ​ទេ 🙏😂 ។


៙ របៀប​ដាក់​កូដ ៖

១- ចូលទៅ Blogger.com
២- ចូល​ទៅផ្នែក Theme >>> Edit HTML
៣- ចុច​លើ​កូដ (កន្លែង​ណា​ក៏​បាន) រួច​ចុច Ctrl+F ដើម្បី​បើក​មុខងារ​ស្វែងរកកូដ
៤- វាយ​ពាក្យ ]]></b:skin> រួច​ចម្លង​កូដ Scroll bar យក​ទៅ​ដាក់​ពី​លើ រួច​​ចុច Save Theme ជាការស្រេច ។ សូម​មើលរូប


ស្ទីល​ទី​១
[body::-webkit-scrollbar {
  width: 8px;
}
body::-webkit-scrollbar-track {
  background-color: rgba(0, 0, 0, 0.4);
  border-radius: 10px;
}
body::-webkit-scrollbar-thumb {
  background-color: #dfdfdf;
  border-radius: 10px;
}]

ស្ទីល​ទី​២
[body::-webkit-scrollbar {
  width: 5px;
}
body::-webkit-scrollbar-track {
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 10px;
}
body::-webkit-scrollbar-thumb {
  background-color: #11171a;
  border-radius: 10px;
}]

ស្ទីល​ទី​៣
[body::-webkit-scrollbar {
  width: 10px;
}
body::-webkit-scrollbar-track {
  background-color: transparent;
  border-radius: 10px;
}
body::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.4);
  border-radius: 10px;
}]

ស្ទីល​ទី​៤
[body::-webkit-scrollbar {
  width: 12px;
}
body::-webkit-scrollbar-track {
  border-radius: 10px;
  background-color: rgba(0, 0, 0, 0.4);
}
body::-webkit-scrollbar-thumb {
  background-color: #e78632;
  background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,.3) 20%,transparent 20%,transparent 40%,rgba(255, 255, 255, 0.3) 40%,rgba(255,255,255,.3) 60%,transparent 60%,transparent 80%,rgba(255, 255, 255, 0.3) 80%);
  border-radius: 10px;
}]

ស្ទីល​ទី​៥
[body::-webkit-scrollbar {
  width: 15px;
}
body::-webkit-scrollbar-track {
  border-radius: 10px;
  background-color: rgba(255, 255, 255, 0.1);
}
body::-webkit-scrollbar-thumb {
  background-image: linear-gradient(45deg, #00aeff, #a68eff);
  border-radius: 10px;
  -webkit-box-shadow: rgba(0,0,0,.12) 0 3px 13px 1px;
}]

ស្ទីល​ទី​៦
[body::-webkit-scrollbar {
  width: 12px;
}
body::-webkit-scrollbar-track {
  border-radius: 10px;
  background-color: rgba(0, 0, 0, 0.4);
}
body::-webkit-scrollbar-thumb {
  background-color: #aab74d;
  background-image:-webkit-linear-gradient(rgba(255,255,255,.3) 20%,transparent 20%,transparent 40%,rgba(255, 255, 255, 0.3) 40%,rgba(255,255,255,.3) 60%,transparent 60%,transparent 80%,rgba(255, 255, 255, 0.3) 80%);
  border-radius: 10px;
}]
_____________
ប្រភព https://www.getwebinfo.com/2019/08/how-to-customize-blogger-scrollbar-with.html

មតិ

Name

Google,1,កង្កែប,3,កញ្ឆែត,1,កំពឹស,1,កម្មវិធី,11,ការ៉េម,3,កិច្ចសម្ភាសន៍,4,ក្ដាម,2,ក្បាច់ខ្មែរ,18,ក្រាហ្វិក,32,ក្រាហ្វិក Rastor,3,ក្រាហ្វិក Vector,29,ខ,1,ខាត់ណា,1,ខ្ចៅ,2,ខ្នុរ,2,ខ្យង,1,គន្លឹះ,12,គន្លឹះ Blogger,7,គន្លឹះ Photoshop,1,គន្លឹះកុំព្យូទ័រ,10,គន្លឹះទូរស័ព្ទ,1,គុយទាវ,1,គោ,6,គ្រឿងក្លែម,1,គ្រឿងបុក,1,គ្រឿងសមុទ្រ,2,ងាវ,1,ចំណេះដឹងទូទៅ,1,ចំហុយ,5,ចៀន,9,ចេក,1,ឆា,29,ជ្រក់,3,ជ្រលក់,4,ជ្រុក,1,ជ្រូក,16,ឈូក,1,ញាំ,4,ដំណើប,1,ដំឡូង,2,ដំឡូងបារាំង,1,ដុត,1,ដូង,1,តៅហ៊ូ,4,ត្នោត,1,ត្រកួន,1,ត្រប់,1,ត្រយូងចេក,1,ត្រឡាច,1,ត្រី,8,ត្រីខ,1,ត្រីងៀត,1,ត្រីឆ្អើរ,1,ទាញយក,36,ទឹកឃ្មុំ,1,ទូរទស្សន៍,14,ធូរេន,1,នំ,6,បង្គា,7,បង្អែម,12,បំពង,3,បាយ,3,បុក,2,ប៊ូតុង,1,ប៉េងបោះ,4,ប្រហិត,3,ប្រហុក,2,ផ្កាខាត់ណា,1,ផ្សិត,3,ផ្អាប់,2,ពងត្រី,1,ព័ត៌មាន,11,ព័ត៌មាន​រចនា,1,ពុម្ពអក្សរ,47,ពុម្ពអក្សរខ្មែរ,46,ពុម្ពអក្សរបរទេស,1,ពុម្ពអក្សរអាក្បាលធំ,85,ពុម្ពអក្សរអាថ៌កំបាំង,1,ពោត,1,មាន់,10,មី,1,មីសួ,3,មឹក,2,ម្ទេស,7,ម្នាស់,1,ម្រះ,1,ម្រេច,2,យូនីកូដខ្មែរ,21,រូបភាពអក្សរ,23,រៀនរចនាពុម្ពអក្សរខ្មែរ,13,លត,1,ល្ពៅ,1,ល្ហុង,1,វចនានុក្រម,1,វិជ្ជាធ្វើម្ហូប,93,សម្ល,4,សារាយ,1,សាលាដ,1,ស៊ុត,7,ស៊ុប,2,សៀវភៅ,5,ស្ងោរ,10,ស្ពៃ,4,ស្លឹកគ្រៃ,3,ស្លឹកតយ,2,ស្អំ,1,អក្សរ,40,អង្ក្រង,1,អន្ទង់,1,អម្ពិល,2,អាំង,6,អ៊ីនធឺណិត,1,ឯកសារ,9,
ltr
item
អាក្បាលធំ: របៀប​ដាក់​​កូដ​របារ​រមូរ (Scroll bar) ដែល​មាន​ពណ៌​ស្អាតៗ​សម្រាប់ Blogger (៦ស្ទីល)
របៀប​ដាក់​​កូដ​របារ​រមូរ (Scroll bar) ដែល​មាន​ពណ៌​ស្អាតៗ​សម្រាប់ Blogger (៦ស្ទីល)
https://3.bp.blogspot.com/-3DIpxMnsx9E/XW_IZmAM5eI/AAAAAAAAx10/SOvXe-sL3kAxxKAipOeUpoT1TsWakGyXwCLcBGAs/s1600/Scroll%2BBars.PNG
https://3.bp.blogspot.com/-3DIpxMnsx9E/XW_IZmAM5eI/AAAAAAAAx10/SOvXe-sL3kAxxKAipOeUpoT1TsWakGyXwCLcBGAs/s72-c/Scroll%2BBars.PNG
អាក្បាលធំ
https://www.akbalthom.art/2019/09/scroll-bar-blogger.html
https://www.akbalthom.art/
https://www.akbalthom.art/
https://www.akbalthom.art/2019/09/scroll-bar-blogger.html
true
5060019090675378648
UTF-8
ផ្ទុក​ប្រកាស​ទាំងអស់ រក​មិន​ឃើញ​ប្រកាស​ទេ មើល​ទាំងអស់ អាន​បន្ថែម ឆ្លើយតប បោះបង់​ការ​ឆ្លើយតប លុប ដោយ ទំព័រ​ដើម ទំព័រ ប្រកាស មើល​ទាំងអស់ ណែនាំ​អត្ថបទសម្រាប់​អ្នក ៖ ចំណាត់​ក្រុម ប័ណ្ណសារ SEARCH អត្ថបទ​ទាំងអស់ រក​មិន​ឃើញ​ការ​ផ្គូផ្គង​​ប្រកាស​ណាមួយ​តាមសំណើ​របស់​អ្នក ត្រលប់​ទៅ​ទំព័រដើម ថ្ងៃ​អាទិត្យ ថ្ងៃ​ចន្ទ ថ្ងៃ​អង្គារ ថ្ងៃ​ពុធ ថ្ងៃ​ប្រហស្បតិ៍ ថ្ងៃ​សុក្រ ថ្ងៃ​សៅរ៍ Sun Mon Tue Wed Thu Fri Sat មករា កុម្ភៈ មីនា មេសា ឧសភា មិថុនា កក្កដា សីហា កញ្ញា តុលា វិច្ឆិកា ធ្នូ Jan Feb Mar Apr ឧសភា Jun Jul Aug Sep Oct Nov Dec ឥឡូវ​នេះ ១ ​នាទីមុន $$1$$ minutes ago ១ ម៉ោងមុន $$1$$ hours ago ម្សិលមិញ $$1$$ days ago $$1$$ weeks ago ច្រើន​ជាង ៥ សប្តាហ៍​មុន អ្នកតាមដាន តាមដាន មាតិកា​នេះ​ត្រូវ​បាន​ចាក់​សោ ជំហានទី១ : ចុច​ចែកចាយ​ទៅ​កាន់​បណ្ដាញ​សង្គម ជំហាន​ទី​២ : ចុច​លើ​តំណ​​ពី​បណ្ដាញ​សង្គម​​ចូល​មក​វិញ ចម្លង​កូដទាំងអស់ ជ្រើសរើស​កូដ​ទាំងអស់ កូដ​ទាំងអស់​ត្រូវ​បាន​ចម្លង​ទៅ​ក្ដារតម្បៀតខ្ទាស់​របស់​អ្នក មិន​អាច​ថតចម្លង​កូដ / អត្ថបទ​បាន​ទេ សូមចុច [CTRL] + [C] (ឬ CMD + C ជាមួយ Mac) ដើម្បី​ចំលង តារាង​មតិកា