Google Fonts กลายเป็นแหล่งข้อมูลสำหรับการพิมพ์เว็บแบบกำหนดเองตั้งแต่มีการพัฒนาในปี 2010 มีเหตุผลหลักสามประการที่ Google มาเป็นผู้นำที่นี่ อย่างแรกคือไม่มีบริการฟอนต์ที่ดีพอ ดังนั้น Google จึงเติมเต็มช่องว่างนั้น ประการที่สอง แม้ในตอนแรก ความหลากหลายที่พวกเขาเสนอนั้นค่อนข้างดี ปัจจุบันมีแบบอักษรให้เลือกมากกว่า 800 แบบในหลากหลายสไตล์ ประการที่สาม แบบอักษรเหล่านี้มีให้ใช้งานฟรี ทำให้น่าสนใจเป็นพิเศษ
นอกจากนี้ยังง่ายต่อการรวมเข้ากับโครงการออกแบบของคุณ เราจะแสดงให้คุณเห็นว่าคุณสามารถรวมแบบอักษร Google เหล่านี้ไว้ในไซต์ WordPress ของคุณได้อย่างไร
Google Fonts
ในการเริ่มต้น คุณจะต้องเลือกแบบอักษรที่ต้องการใช้งาน มีตัวเลือกที่หลากหลาย ดังนั้นคุณจึงมีเมนูที่ค่อนข้างใหญ่ให้เลือก คุณสามารถค้นหาได้โดยมุ่งหน้าไปที่ หน้าแบบอักษรของ Google. หากคุณกำลังมองหาฟอนต์เฉพาะ ให้พิมพ์ชื่อฟอนต์ในกล่องค้นหา จากนั้นระบบจะแสดงตัวอย่าง
นอกจากนี้ยังมีพารามิเตอร์การค้นหาอื่นๆ ที่คุณสามารถใช้ได้ ด้านล่างช่องค้นหาจะมีปุ่มชื่อหมวดหมู่ หากคุณคลิกที่ปุ่มนี้ เมนูแบบเลื่อนลงจะแสดงเมนูแบบเลื่อนลงพร้อมห้าตัวเลือก เหล่านี้มีดังนี้:
- Serif – เป็นฟอนต์ที่มีบรรทัดสั้น ๆ ที่เกิดจากจังหวะบนและล่างของตัวอักษร Times New Roman และ Sylfaen เป็นตัวอย่างที่ดี
- Sans Serif – ตามชื่อที่แนะนำ แบบอักษรเหล่านี้ไม่มีเส้นเล็กๆ เหล่านั้น พวกเขามักจะมีความงามที่เรียบง่ายและสะอาด
- จอแสดงผล – สิ่งเหล่านี้เรียกว่าแบบอักษรที่ดึงดูดความสนใจ เหมาะที่สุดสำหรับหัวเรื่องมากกว่าข้อความยาว
- การเขียนด้วยลายมือ – แบบอักษรเหล่านี้ทำให้ดูเหมือนมีคนเขียนด้วยมือ คุณจะพบว่าหลายคนใช้ตัวสะกดหรือเว้นวรรคไม่เท่ากัน
- Monospace – เช่นเดียวกับเครื่องพิมพ์ดีด ตัวอักษรของพวกมันจะมีความกว้างในแนวนอนเท่ากัน พวกมันมีระยะห่างสม่ำเสมอมาก
นอกจากนี้ คุณยังมีตัวเลือกอื่นๆ ให้เลือก เช่น การเลือกคุณสมบัติภาษาและแบบอักษร หลังรวมถึงจำนวนของรูปแบบ ความหนา เอียง และความกว้าง
การฝังฟอนต์ใน WordPress
หากคุณต้องการรวมแบบอักษรเฉพาะเหล่านี้ลงในไซต์ WordPress ของคุณ คุณสามารถลองใช้วิธีต่างๆ ได้หลายวิธี
การใช้ CSS
คลิกที่แบบอักษรจากการเลือกของ Google และจะนำคุณไปยังหน้าแบบอักษรโดยละเอียด ที่มุมขวาบนจะมีเครื่องหมาย “+” คลิกที่หน้าต่างด้านข้างจะเปิดขึ้น คลิกที่ "ฝัง"
ตอนนี้คุณสามารถคลิก @นำเข้า. นี่จะเป็นการเปิดโค้ด CSS ที่คุณต้องการคัดลอก ไปที่สไตล์ชีตของธีม WordPress แล้ววางที่จุดเริ่มต้น ตรวจสอบให้แน่ใจว่าคุณได้คัดลอกลิงก์นำเข้าโดยไม่มี วงเล็บ ตรวจสอบว่าคุณบันทึกแล้ว และคุณจะได้เพิ่มแบบอักษร
การใช้ PHP
ทำตามขั้นตอนแรกสองสามขั้นและคัดลอกลิงก์ที่คุณได้รับหลังจากคลิกเครื่องหมาย “+” ตอนนี้ เพียงเพิ่มลงในไฟล์ header.php ของธีมของคุณ อย่าลืมบันทึกเพื่อเพิ่มแบบอักษร
การใช้ฟังก์ชัน Javascript
คุณยังลองใช้สิ่งที่เรียกว่า "กำลังเข้าคิว" ได้อีกด้วย คุณจะต้องใช้ฟังก์ชัน wp_enqueue_style สำหรับสิ่งนี้ ด้วยวิธีนี้ คุณสามารถเพิ่มแบบอักษรที่เลือกลงในส่วนหัวของหน้าเว็บไซต์ทั้งหมดของคุณได้ เป็นวิธีที่ยอดเยี่ยมในการเพิ่มการเปลี่ยนแปลงหลายอย่างพร้อมกัน
เพียงแค่รับลิงก์ของฟอนต์ (ตั้งแต่ http จนถึง ”) และเพิ่มลงในไฟล์ functions.php ของธีมของคุณพร้อมโค้ดพิเศษรอบๆ นี่คือรหัสที่คุณต้องใช้:
ฟังก์ชัน custom_add_google_fonts() {
wp_enqueue_style( 'custom-google-fonts', https://fonts.googleapis.com/css2?family=Chelsea+Market&display=swap, เท็จ );
}
add_action( 'wp_enqueue_scripts', 'custom_add_google_fonts' );
ตัวเลือกใดๆ เหล่านี้ใช้ได้ดีในการผสานรวม Google Fonts เข้ากับเว็บไซต์ WordPress ของคุณ ดังนั้นจึงเป็นเรื่องสำคัญที่จะต้องเลือกตัวเลือกที่คุณรู้สึกสบายใจที่สุด