Site icon บริษัท โค๊ดบี จำกัด

วิธีเปลี่ยน font ภาษาไทย ให้ wordpress

วิธีเปลี่ยน-font-ภาษาไทย-ให้-wordpress

วิธีเปลี่ยน-font-ภาษาไทย-ให้-wordpress

&NewLine;<p class&equals;"wp-block-paragraph">เราสามารถเปลี่ยน font ให้กับแต่ละส่วนใน wordpress เช่น ฟอนต์ส่วนเมนูหลัก เนื้อหา ปุ่ม หรือส่วนท้ายของเว็บไซต์ โดยแยก fontfamily แต่ละส่วนได้ บางส่วนอาจจะอยาก ให้เป็นภาษาไทย แต่บางส่วนอาจจะต้องการให้เป็น device font<&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph">สำหรับ wordpress เราสามารถติดตั้งปลั๊กอินที่ชื่อว่า <a rel&equals;"noreferrer noopener" href&equals;"https&colon;&sol;&sol;wordpress&period;org&sol;plugins&sol;olympus-google-fonts&sol;" target&equals;"&lowbar;blank">Fonts Plugin &vert; Google Fonts Typography<&sol;a> ซึ่งปลั๊กอินตัวนี้ใช้งานง่ายมาก หลังติดตั้ง เราจะสามารถกำหนด fontfamily ให้กับแต่ละส่วนบนเว็บไซต์ของเราได้<&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<h4 class&equals;"wp-block-heading">วิธีติดตั้งและใช้งาน Google Font ภาษาไทย สำหรับ WordPress<&sol;h4>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph">1&period; เข้าระบบหลังบ้านของ wordpress จากนั้นไปที่เมนู Plugins -> Add New ในช่อง Search Plugins&&num;8230&semi; ให้คนหาด้วยคีย์เวิร์ด <a rel&equals;"noreferrer noopener" href&equals;"https&colon;&sol;&sol;wordpress&period;org&sol;plugins&sol;olympus-google-fonts&sol;" target&equals;"&lowbar;blank">Fonts Plugin &vert; Google Fonts Typography<&sol;a> เราจะเจอปลั๊กอินสำหรับติดตั้ง fontfamily ตามรูปด้านล่าง<&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<figure class&equals;"wp-block-image size-large"><img src&equals;"https&colon;&sol;&sol;www&period;codebee&period;co&period;th&sol;labs&sol;wp-content&sol;uploads&sol;2020&sol;10&sol;วิธีเปลี่ยน-font-ภาษาไทย-ให้-wordpress-1-940x488&period;png" alt&equals;"" class&equals;"wp-image-5783" data-full&equals;"https&colon;&sol;&sol;codebee&period;co&period;th&sol;labs&sol;wp-content&sol;uploads&sol;2020&sol;10&sol;วิธีเปลี่ยน-font-ภาษาไทย-ให้-wordpress-1&period;png" data-full-size&equals;"1064x552" &sol;><&sol;figure>&NewLine;&NewLine;&NewLine;&NewLine;<div style&equals;"height&colon;20px" aria-hidden&equals;"true" class&equals;"wp-block-spacer"><&sol;div>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph">2&period; กดปุ่ม <strong>&&num;8216&semi;Install Now&&num;8217&semi;<&sol;strong> เพื่อติดตั้งปลั๊กอิน หลังการติดตั้งให้ไปที่หน้า Plugins และกด &&num;8216&semi;Activate&&num;8217&semi; เพื่อเปิดใช้งาน Google Font Plugins จะสังเกตุเห็นว่ามีปุ่ม <strong>&&num;8216&semi;Fonts Plugins&&num;8217&semi;<&sol;strong> โผล่มาที่เมนูหลักของ WordPress ให้คลิกเลือกไปที่ <strong>Fonts Plugins -> Customize<&sol;strong><&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<div style&equals;"height&colon;20px" aria-hidden&equals;"true" class&equals;"wp-block-spacer"><&sol;div>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph">3&period; เมื่อเข้ามาในส่วน <strong>Fonts Plugins -> Customize<&sol;strong> จะมีส่วนการตั้งค่าหลัก ๆ อยู่ 4 ส่วนคือ<&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<ul class&equals;"wp-block-list"><li><strong>Basic Settings<&sol;strong> คือ การตั้งค่าเลือกฟอนต์โดยเป็นการกำหนด Fontfamily เฉพาะส่วนหลัก ๆ ของหน้าเว็บไซต์<&sol;li><li><strong>Advanced Settings<&sol;strong> คือ สำหรับคนที่ต้องการปรับเลือก Fontfamily ให้แสดงผลแต่ละส่วนแบบละเอียด แยกแต่ละส่วนในหน้าเว็บสามารถทำได้ผ่านเมนูนี้<&sol;li><li><strong>Font Loading<&sol;strong> คือ การกำหนดว่า เราต้องการให้โหลดรูปแบบของ font แบบไหนมาทำงานภายในเว็บไซต์ของเรา เพื่อไม่ให้เว็บไซต์ทำงานหนักจนเกินไป เช่น Fontfamily นี้ให้โหลดแบบ Extra Light มาแสดง ส่วนฟอนต์นี้ให้โหลดแบบ Italic มาแสดง เป็นต้น<&sol;li><li><strong>Debugging<&sol;strong> คือส่วนของการ reset ข้อมูลการตั้งค่า และกำหนด Font Display ของ Fontfamily ที่โหลดมาแสดง<&sol;li><&sol;ul>&NewLine;&NewLine;&NewLine;&NewLine;<div style&equals;"height&colon;20px" aria-hidden&equals;"true" class&equals;"wp-block-spacer"><&sol;div>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph">4&period; จะรู้ได้อย่างไร ว่า Font ชื่ออะไรเป็น Font ที่รองรับภาษาไทย &quest; วิธีการคือให้เข้าไปดูรายชื่อฟอนต์ภาษาไทยที่ <a rel&equals;"noreferrer noopener" href&equals;"https&colon;&sol;&sol;fonts&period;google&period;com&sol;&quest;subset&equals;thai" target&equals;"&lowbar;blank">Google Font Thai<&sol;a> เมื่อได้ชื่อฟอนต์ภาษาไทยเรียบร้อยแล้วให้นำมาค้นหาชื่อกับปลั๊กอิน Google Fonts Typography<&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<figure class&equals;"wp-block-image size-large"><img src&equals;"https&colon;&sol;&sol;www&period;codebee&period;co&period;th&sol;labs&sol;wp-content&sol;uploads&sol;2020&sol;10&sol;วิธีเปลี่ยน-font-ภาษาไทย-ให้-wordpress-3-940x347&period;png" alt&equals;"" class&equals;"wp-image-5788" data-full&equals;"https&colon;&sol;&sol;codebee&period;co&period;th&sol;labs&sol;wp-content&sol;uploads&sol;2020&sol;10&sol;วิธีเปลี่ยน-font-ภาษาไทย-ให้-wordpress-3&period;png" data-full-size&equals;"2304x850" &sol;><figcaption>ตัวอย่าง Font Family ภาษาไทย ใน Google Font<&sol;figcaption><&sol;figure>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph">สามารถดูรายชื่อฟอนต์ภาษาไทย ที่สามารถนำมาใช้งานสำหรับงานเว็บไซต์ได้ฟรีที่ <a rel&equals;"noreferrer noopener" href&equals;"https&colon;&sol;&sol;fonts&period;google&period;com&sol;&quest;subset&equals;thai" target&equals;"&lowbar;blank">Google Font Thai<&sol;a><&sol;p>&NewLine;

Exit mobile version