ใช้งาน Google Font ให้รองรับภาษาไทยใน iOS

<h3>ใช้งาน Google Font ให้รองรับภาษาไทยใน iOS<&sol;h3>&NewLine;<p><&sol;br><br &sol;>&NewLine;<strong>ใช้งาน Google Font ให้รองรับภาษาไทยใน iOS<&sol;strong><br &sol;>&NewLine;หลังจากที่ Google ได้เปิดการใช้งาน Google Font แบบรองรับภาษาไทย เชื่อว่าคนทำเว็บไซต์หลาย ๆ คนคงเคยเจอปัญหาเกี่ยวกับการใช้งานฟอนต์ที่อาจจะไม่รองรับภาษาไทย รองรับบางเบราว์เซอร์ หรือแสดงผลได้ปกติบน Desktop Browser แต่ไม่ทำงานเมื่อดูผ่าน Mobile Browser วันนี้มีวิธีการทำให้เว็บไซต์ของเรารองรับการแสดงผลภาษาไทยได้อย่างสมบูรณ์แบบโดย<&excl;--more--><&sol;p>&NewLine;<p>การใช้งาน Google Font เราสามารถจัดการฟอนต์ได้ง่าย ๆ ผ่านระบบจัดการของ Google ได้เองเลย สามารถทำได้ดังขั้นตอนตังต่อไปนี้ครับ<br &sol;>&NewLine;<&sol;br><&sol;p>&NewLine;<h3>ใช้งาน Google Font ภาษาไทย<&sol;h4>&NewLine;<p><&sol;br><&sol;p>&NewLine;<ul>&NewLine;<li>1&period; ไปที่เว็บไซต์ <a href&equals;"https&colon;&sol;&sol;fonts&period;google&period;com" target&equals;"&lowbar;blank">https&colon;&sol;&sol;fonts&period;google&period;com<&sol;a> มองหาเมนู <strong>&&num;8220&semi;Languages&&num;8221&semi;<&sol;strong> ซ้ายมือเลือกภาษาเป็นภาษาไทย<&sol;li>&NewLine;<p><&sol;br><br &sol;>&NewLine;<img src&equals;"https&colon;&sol;&sol;www&period;codebee&period;co&period;th&sol;labs&sol;wp-content&sol;uploads&sol;2016&sol;12&sol;ใช้งาน-google-font-ภาษาไทย-1&period;png" alt&equals;"ใช้งาน-google-font-ภาษาไทย" &sol;><br &sol;>&NewLine;<&sol;br><&sol;p>&NewLine;<li>2&period; มองหา font ภาษาไทยสวย ๆ ที่เราต้องการ จากนั้นคลิกที่เครื่องหมายบวก ด้านล่างของหน้าเว็บไซต์จะแสดง หน้าต่างสีดำโผล่ขึ้นมาให้คลิกเลือกไปที่ &&num;8220&semi;Family Selected&&num;8221&semi;<&sol;li>&NewLine;<p><&sol;br><br &sol;>&NewLine;<strong>เลือกฟ้อนที่เราต้องการ และคลิกเครื่องหมายบวก ตัวอย่างเช่นฟอนต์ Sriracha<&sol;strong><br &sol;>&NewLine;<&sol;br><br &sol;>&NewLine;<img src&equals;"https&colon;&sol;&sol;www&period;codebee&period;co&period;th&sol;labs&sol;wp-content&sol;uploads&sol;2016&sol;12&sol;ใช้งาน-google-font-ภาษาไทย-2&period;png" alt&equals;"ใช้งาน-google-font-ภาษาไทย" &sol;><br &sol;>&NewLine;<&sol;br><br &sol;>&NewLine;<strong>สังเกตุด้านล่างหน้าเว็บจะมีหน้าต่างสีดำโผล่มา ให้คลิกที่คำว่า &&num;8220&semi;Family Selected&&num;8221&semi;<&sol;strong><br &sol;>&NewLine;<&sol;br><br &sol;>&NewLine;<img src&equals;"https&colon;&sol;&sol;www&period;codebee&period;co&period;th&sol;labs&sol;wp-content&sol;uploads&sol;2016&sol;12&sol;ใช้งาน-google-font-ภาษาไทย-3&period;png" alt&equals;"ใช้งาน-google-font-ภาษาไทย" &sol;><br &sol;>&NewLine;<&sol;br><&sol;p>&NewLine;<li>3&period; จะปรากฏแท็บเมนู EMBED และ CUSTOMIZE ให้เลือกไปที่แท็บ CUSTOMIZE และติ๊กเครื่องหมายถูกที่ช่องภาษาไทย Thai Supported<&sol;li>&NewLine;<p><&sol;br><br &sol;>&NewLine;<strong>ติ๊กถูกหน้า Thai Supported<&sol;strong><br &sol;>&NewLine;<&sol;br><br &sol;>&NewLine;<img src&equals;"https&colon;&sol;&sol;www&period;codebee&period;co&period;th&sol;labs&sol;wp-content&sol;uploads&sol;2016&sol;12&sol;ใช้งาน-google-font-ภาษาไทย-4&period;png" alt&equals;"ใช้งาน-google-font-ภาษาไทย" &sol;><br &sol;>&NewLine;<&sol;br><&sol;p>&NewLine;<li>4&period; จากนั้นเปลี่ยนแท็บไปที่ EMBED ให้สังเกตุข้อมูลในช่องโค๊ดสำหรับติดตั้งฟอนต์ จะมีคำว่า &&num;8220&semi;subset&equals;thai&&num;8221&semi; ต่อท้ายอยู่ ทำการก๊อปปี้โค๊ดไปวางไว้ในระหว่างแท็ก header ของหน้าเว็บไซต์ และกำหนด Font-family ให้ตรงกับ family ที่เราทำการ embed เข้ามาจากตัวอย่างก็จะเป็น <strong>font-family&colon; &&num;8216&semi;Sriracha&&num;8217&semi;&comma; cursive&semi;<&sol;strong> เพียงเท่านี้เราก็จะสามารถใช้งานฟอนต์ภาษาไทยได้ทั้งใน Mobile Browser ทุก OS และทุก Desktop Browser<&sol;li>&NewLine;<p><&sol;br><br &sol;>&NewLine;<strong>นำโค๊ด css embed ไปวางไว้ระหว่างแท็ก header ของหน้าเว็บ<&sol;strong><br &sol;>&NewLine;<&sol;br><br &sol;>&NewLine;<img src&equals;"https&colon;&sol;&sol;www&period;codebee&period;co&period;th&sol;labs&sol;wp-content&sol;uploads&sol;2016&sol;12&sol;ใช้งาน-google-font-ภาษาไทย-5&period;png" alt&equals;"ใช้งาน-google-font-ภาษาไทย" &sol;><br &sol;>&NewLine;<&sol;br>&NewLine;<&sol;ul>&NewLine;<p><&sol;br><&sol;p>&NewLine;