For Android device For iOS device
២២
តុលា

របៀបនៃការ​កំណត់​ពុម្ពអក្សរ (Fonts) នៅ​ក្នុង​គេហទំព័រ

♦ រៀបរៀងឡើងវិញនៅ ខែតុលា ឆ្នាំ ២០២៣ ដោយ លោក ចែ សុផល

នៅ​ក្នុង​អត្ថបទនេះ ខ្ញុំ​នឹងលើកយកពីរបៀបនៃការដាក់ពុម្ពអក្សរ (Fonts) ទៅ​ក្នុង​គេហទំព័រដោយ​ប្រើ​ប្រាស់ @font-face និង Google Fonts ។ ការ​កំណត់​ពុម្ពអក្សរនៅ​ក្នុង​គេហទំព័រពិតជាមាន​សារៈ​សំខាន់​ណាស់ ព្រោះ​វាជួយ​ឲ្យ​គេហទំព័រមានភាពស្រស់​ស្អាត និងទាក់ទាញ ។ ម៉្យាងវិញទៀតអាចកាត់​បន្ថយ​ពីការខូចទ្រង់ទ្រាយនៃអក្សរ ព្រោះ​ពុម្ពអក្សរ​នីមួយៗ​គឺមានកម្រាស់ (font-weight) និង​កម្ពស់​បន្ទាត់ (line-height) ខុស​គ្នា​ៗ ។ មូលហេតុ​ដែល​ត្រូវការ​កំណត់​ពុម្ពអក្សរ Unique នៅ​ក្នុង​គេហទំព័រ ព្រោះ​នៅ​ក្នុង​ម៉ាស៊ីន​កុំព្យូទ័រ​មួយចំនួនគឺមិនមាន Fonts គ្រប់​ទាំងអស់​ទេ ដូច្នេះហើយ​ក្នុង​គេហទំព័រគឺត្រូវការ​កំណត់​ពុម្ពអក្សរជាក់លាក់ ។
♦ របៀបនៃការ​កំណត់​ពុម្ពអក្សរនៅ​ក្នុង​គេហទំព័រមានពីរបៀប៖
→ វិធីសាស្រ្តទី១៖
ការ​កំណត់​ពុម្ពអក្សរ​តាមរយៈ @font-face ។ @font-face គឺជា​ច្បាប់​មួយរបស់ភាសា CSS ដែល​ប្រើ​សម្រាប់​កំណត់​ពុម្ពអក្សរនៅ​ក្នុង គេហទំព័រ ។ ទោះបីនៅ​ក្នុង​កុំព្យូទ័រ​របស់អ្នក​ប្រើ​ប្រាស់​គ្មាន Fonts នោះ ឬ​មិនមានអ៊ីនធើណេត ក៏​អាច​ដំណើរ​ការ​បានដែរ ។
1. ត្រូវ Download Fonts ហើយផ្ទុក Fonts នោះនៅ​ក្នុង Project ដូចរូប​ខាងក្រោម​៖

2. ខាងក្រោម​នេះជាកូដ និង​លទ្ធផល​នៃការ​ប្រើ​ប្រាស់ @font-face

- នៅត្រង់ myFirstFont លោកអ្នក​អាច​កំណត់​ឈ្មោះ​អ្វី​ក៏​បានដែរ ប៉ុន្តែ​ខ្ញុំ​ណែនាំ​ឲ្យ​កំណត់​ឈ្មោះ​ទៅតាម​ពុម្ពអក្សរ​ដែល​ភ្ជាប់​តាមរយៈ Property src ។
→ វិធីសាស្រ្តទី២៖
ការ​កំណត់​ពុម្ពអក្សរ​តាមរយៈ Google Fonts ។ Google Fonts អាច​ប្រើ​ដោយឥតគិតថ្លៃ និងមានពុម្ពអក្សរ​ច្រើន​ជាង 1000 សម្រាប់ ជ្រើសរើស ។

របៀប​ប្រើ​ប្រាស់ Google Fonts
​លោកអ្នក​ចូលទៅ​ក្នុង​គេហទំព័រ Google Fonts តាមរយៈ​តណ​ភ្ជាប់​នេះ https://fonts.google.com/ ។ ហើយ​ស្វែងរក​ពុម្ពអក្សរ​ដែល​លោកអ្នក​ចង់​ប្រើ​នៅប្រអប់ Search (ដូចរូប​ខាងក្រោម) ។ ឧទាហរណ៍​ជ្រើសរើស​ពុម្ពអក្សរ Lato ។

ការ​ស្វែងរក​ពុម្ពអក្សរ៖ ​ជ្រើសរើស​ពុម្ពអក្សរ​ដែល​លោកអ្នក​ចង់​ប្រើ​ប្រាស់​

ការ​ជ្រើសរើស​ម៉ូតពុម្ពអក្សរ៖  
​បន្ទាប់ពី​ជ្រើសរើស​ពុម្ពអក្សររួចហើយ ខាងក្រោម​នេះជាទំព័របន្ទាប់​ដែល​បង្ហាញ​អំពី​ព័ត៌មាន​លម្អិត​សម្រាប់​ពុម្ពអក្សរ​ខាងលើ ។ សម្រាប់ ឧទាហរណ៍នេះ សូម​ជ្រើសរើស Regular 400 ។

​ចំណាំ​: ប្រសិន​លោកអ្នក​ចង់បានម៉ូតអក្សរផ្សេងៗ​គ្នា គឺ​គ្រាន់តែ​ចុច Select លើប៊ូតុងខាង​ស្ដាំ (ដូចរូប​ខាងលើ) នៃម៉ូតអក្សរ​នីមួយៗ ។

ការភ្ផាប់​ទៅកាន់ Google Fonts

​បន្ទាប់មក​ចុចប៊ូតុងនៅជ្រុងខាង​ស្ដាំ​ខាងលើ​នៃគេហទំព័រ Google Fonts ដែល​អនុញ្ញាត​ឲ្យ​អ្នកមើលពុម្ពអក្សរ​ដែល​បាន​ជ្រើសរើស ។

ការ​ចម្លង​តំណ​ភ្ជាប់​របស់ Google Fonts

​លោកអ្នក​ត្រូវ Copy Link របស់ Google fonts (ដូចរូប​ខាងក្រោម) យកទៅដាក់​ក្នុង Tag <head> នៃ HTML កូដ ។

ឧទារហណ៍

♦ សម្រាប់​ព័ត៌មាន​វគ្គ​សិក្សា​កុំព្យូទ័រ​នៅអាន-ANT http://training.antkh.com/

​សម្រាប់​ព័ត៌មាន​ទំនាក់ទំនងមកយើង​ខ្ញុំ ៖   https://t.me/anttechnology https://web.facebook.com/anttrainning

Facebook Page: ANT Technology Training Center ANT Learner ANTTrainings

​សម្រាប់​លោកអ្នក​ដែល​ចង់​ដំឡើង​កម្មវិធី ANTLearner ឬ​កម្មវិធី ANTPedia ​សម្រាប់ Windows សូម​ចូលរួម Telegram÷ https://t.me/AntTechnologyTrainingCenter

មតិ និង​យោបល់​ទៅលើ​អត្ថបទ​នេះ (តាម Facebook)

ខាងក្រោម​នេះ​ជា​យោបល់​ផ្សេងៗ​របស់​អ្នកទស្សនា