3 วิธีในการเพิ่มแบบอักษรที่กำหนดเองให้กับธีมเว็บไซต์ WordPress ของคุณ

มีวิธีที่น่าสนใจและปรับแต่งได้มากมายในการทำให้เว็บไซต์ WordPress ของคุณดูมีเอกลักษณ์และดึงดูดสายตามากขึ้น วิธีหนึ่งคือการเพิ่มแบบอักษรที่กำหนดเองลงในไซต์ WordPress ของคุณ ลองดูที่เว็บไซต์ของคู่แข่งของคุณ พวกเขาอาจเลียนแบบโทนสีและสไตล์เดียวกันกับที่คุณหวังว่าจะสร้างด้วยเว็บไซต์ WordPress ของคุณเอง ให้ความสนใจกับการใช้แบบอักษร ไซต์ที่ประสบความสำเร็จจำนวนมากมักจะใช้ฟอนต์จำนวนหนึ่งที่คัดสรรมาอย่างดีซึ่งใช้อย่างสม่ำเสมอทั่วทั้งเว็บไซต์

มีฟอนต์แบบกำหนดเองมากมายให้ใช้งานออนไลน์ฟรี ซึ่งคุณสามารถเพิ่มลงในไซต์ของคุณเองได้อย่างง่ายดาย หลังจากค้นหาฟอนต์ที่เหมาะสมแล้ว คุณจะต้องรู้วิธีนำไปใช้กับเว็บไซต์ของคุณ มีหลายวิธีที่คุณสามารถลองเพื่อให้บรรลุเป้าหมายนี้

อันดับแรก การค้นหาฟอนต์ที่เหมาะสม มีเว็บไซต์นับไม่ถ้วนที่ให้บริการฟอนต์ฟรีนับพันให้คุณดาวน์โหลด ลองใช้ Google Fonts, TemplateMonster, MyFonts, FontSpring, Cufonfonts, Dafont, Font Squirrel, Edge Web Fonts, 1001 Free Fonts, Fonts.com

กล่าวโดยย่อ มีสองวิธีหลักในการเพิ่มแบบอักษรที่กำหนดเองในเว็บไซต์ WordPress ของคุณ: ด้วยตนเองหรือด้วยปลั๊กอิน

เพิ่มแบบอักษรที่กำหนดเองในธีมเว็บไซต์ WordPress ของคุณด้วยตนเอง

การเพิ่มฟอนต์แบบกำหนดเองลงใน WordPress ด้วยตนเองอาจมีประโยชน์หากคุณไม่ต้องการเสี่ยงที่จะทำให้ไซต์ WordPress ของคุณมีภาระมากเกินไปด้วยปลั๊กอินมากเกินไป ซึ่งสามารถทำได้โดยการแก้ไขคำสั่ง @font-face สิ่งนี้ทำให้คุณสามารถเชื่อมต่อแบบอักษรหลายรูปแบบเข้ากับไซต์ของคุณ

สิ่งนี้เกี่ยวข้องกับขั้นตอนต่อไปนี้:

ขั้นตอนที่ 1

ขั้นแรก ดาวน์โหลดฟอนต์แบบกำหนดเองที่คุณเลือกจากเว็บไซต์ใดก็ได้ที่คุณพบว่ามีประโยชน์มากที่สุด เมื่อบันทึกไฟล์ลงในคอมพิวเตอร์ของคุณแล้ว ให้แตกไฟล์เก็บถาวร .zip นี้

ขั้นตอนที่ 2

จากนั้นคุณสามารถอัปโหลดไฟล์ฟอนต์นี้ในเซิร์ฟเวอร์โฮสติ้ง WordPress ของคุณภายใต้ไดเร็กทอรี “wp-content/themes/your-theme-folder/fonts” หากคุณยังไม่ได้ตั้งค่าโฟลเดอร์ที่กำหนดสำหรับฟอนต์ที่คุณกำหนดเอง ให้สร้างและบันทึกไว้ที่นั่น

ขั้นตอนที่ 3

จากนั้นตรงไปที่ส่วนผู้ดูแลระบบของ WordPress เลือกลักษณะ จากนั้นไปที่ตัวแก้ไขธีม ณ จุดนี้ คุณจะเห็นไฟล์ style.css ของธีมบนหน้าจอของคุณ ข้างใต้นี้ คุณจะต้องเพิ่มโค้ดส่วนนี้:

 @font-face { font-family: Aguafina Script-Regular; src: url(http://test-site.com/wp-content/themes/your-theme-folder/fonts/AguafinaScript-Regular.ttf); font-weight: normal; }

อย่าลืมแทนที่ "URL" และ "font-family" ในโค้ดด้วยค่าที่เหมาะสมเพื่อให้สอดคล้องกับแบบอักษรที่คุณเลือก คุณควรวางโค้ดส่วนนี้ไว้ที่ส่วนเริ่มต้นของไฟล์ CSS แต่หลังการแสดงความคิดเห็นของธีม

ขั้นตอนที่ 4

สุดท้าย ตรวจสอบให้แน่ใจว่าคุณคลิกปุ่มอัปเดตไฟล์ที่สำคัญ เพื่อให้แน่ใจว่าการเปลี่ยนแปลงของคุณได้รับการบันทึกอย่างถูกต้องก่อนที่คุณจะออกจากหน้านี้

ขั้นตอนที่ 5

ต่อไปนี้ คุณสามารถใช้ฟอนต์ได้อย่างง่ายดายทุกที่ที่คุณต้องการนำไปใช้ในสไตล์ชีตของธีมของคุณ โดยใช้รหัสต่อไปนี้:

 .h1 site-title { font-family: "Aguafina Script-Regular", Arial, sans-serif; }

เมื่อคุณได้แก้ไขโค้ดแบบอักษรนี้แล้ว เมื่อใดก็ตามที่มีคนไปที่เว็บไซต์ของคุณ แบบอักษรก็จะโหลดขึ้นมา แต่คุณยังไม่ได้นำไปใช้กับองค์ประกอบใด ๆ บนหน้า ในการดำเนินการนี้ คุณต้องแก้ไขไฟล์ style.css ที่คุณเพิ่งเข้าถึงเป็นครั้งสุดท้ายอีกครั้งหนึ่ง คุณจะต้องใส่รหัสต่อไปนี้ลงในไฟล์:

 .site-title { font-family: "Aguafina Script-Regular", Arial, sans-serif; }

แนะนำสำหรับคุณ: คู่มือสำหรับผู้เริ่มต้น: วิธีการติดตั้งธีม WordPress?

หมายเหตุด่วน:

จำไว้เช่นเดิมว่าให้แก้ไขค่าตระกูลฟอนต์ให้เหมาะสมกับฟอนต์ที่คุณใช้

ตัวอย่างเช่น หากคุณใช้แบบอักษรที่กำหนดเองจาก Google Fonts คุณจะเห็นว่ามีแท็บชื่อ @import ซึ่งให้โค้ดที่เกี่ยวข้องแก่คุณเพื่อคัดลอกและวางลงในไฟล์ style.css ของธีมของคุณ การดำเนินการนี้จะทำให้กระบวนการทั้งหมดง่ายขึ้นมากหากคุณไม่สะดวกในการจัดการกับการเขียนโค้ดมากเกินไป

อย่างไรก็ตาม นี่ไม่ใช่วิธีที่แนะนำอีกต่อไป พบปัญหาด้านประสิทธิภาพ ทำให้เบราว์เซอร์ไม่สามารถดาวน์โหลดสไตล์ชีตหลายรายการพร้อมกันได้ ส่งผลให้หน้าโหลดช้าลงในที่สุด ดังนั้นโปรดระลึกไว้เสมอเมื่อคุณเลือกแบบอักษรและวิธีการใช้งาน

ในทางกลับกัน การติดตั้งฟอนต์แบบกำหนดเองด้วยตนเองผ่าน CSS จะช่วยให้คุณเชื่อมต่อฟอนต์ได้หลายรูปแบบ เช่น SVG, WOFF, TTF และ OTF วิธีนี้ยังช่วยให้คุณทำงานโดยไม่ต้องพึ่งพาบริการของบุคคลที่สาม ไฟล์ฟอนต์ของคุณจะอยู่บนเซิร์ฟเวอร์ของคุณ นี่เป็นวิธีโดยตรงที่สุดในการเพิ่มแบบอักษรที่กำหนดเองใน WordPress

ใช้ปลั๊กอินเพื่อเพิ่มแบบอักษรที่กำหนดเองในธีมเว็บไซต์ WordPress ของคุณ

หลายคนเลือกที่จะใช้ปลั๊กอินเพื่อรวมแบบอักษรที่กำหนดเองลงในเว็บไซต์ WordPress เนื่องจากในหลาย ๆ วิธีอาจเป็นวิธีที่ง่ายที่สุดในการทำเช่นนั้น โดยเฉพาะอย่างยิ่งถ้าคุณไม่ต้องการจัดการกับการเข้ารหัส CSS Google Fonts เป็นตัวเลือกยอดนิยม เนื่องจากสามารถใช้ควบคู่กับปลั๊กอิน WordPress ได้อย่างง่ายดาย สองตัวเลือกที่ดีที่สุดสำหรับคุณคือ Easy Google Fonts และ Google Fonts Typography เมื่อคุณเปิดใช้งานปลั๊กอินเหล่านี้แล้ว คุณจะสามารถเข้าถึงแคตตาล็อกแบบอักษรทั้งหมดของ Google Fonts เพื่อเพิ่มลงในหน้าเว็บของคุณได้อย่างง่ายดาย โดยไม่ต้องจัดการกับโค้ดที่ซับซ้อนใดๆ

การใช้ Google Fonts เป็นวิธีที่ง่ายที่สุดในการทำเช่นนี้ และคุณสามารถดูตัวอย่างการเปลี่ยนแปลงและแบบอักษรที่กำหนดเองได้แบบเรียลไทม์บนหน้าจอ

ขึ้นอยู่กับไฟล์ฟอนต์ที่คุณต้องการใช้ และหากคุณต้องการใช้ที่เก็บเดียวหรือไม่ คุณอาจต้องการพิจารณาใช้ปลั๊กอินอื่น เช่น ปลั๊กอินฟอนต์แบบกำหนดเอง

ขั้นตอนที่ 1

เมื่อคุณติดตั้งปลั๊กอินที่คุณเลือกและเปิดใช้งานแล้ว ให้ไปที่ลักษณะที่ปรากฏ จากนั้นคลิกเข้าสู่หน้าเครื่องมือปรับแต่ง ซึ่งจะเปิดหน้าอินเทอร์เฟซเครื่องมือปรับแต่งธีม WordPress แบบสด ที่นี่คุณจะเห็นแท็บ Typography ซึ่งจะแสดงแต่ละส่วนของไซต์ของคุณเอง ซึ่งคุณสามารถใช้แบบอักษรที่คุณกำหนดเองได้

ขั้นตอนที่ 2

เมื่อคุณเปิดหน้านี้แล้ว คุณจะสามารถคลิกที่ปุ่มแก้ไขแบบอักษรภายในส่วนของหน้าที่คุณต้องการเริ่มแก้ไข จากนั้นคุณสามารถทำงานผ่านส่วนย่อยต่างๆ โดยเลือกรูปแบบฟอนต์ ขนาด ระยะขอบ ฯลฯ – ส่วนเหล่านี้จะแตกต่างกันไปตามธีมที่คุณใช้

ธีมของคุณอาจหมายความว่าคุณจะไม่สามารถแก้ไขแบบอักษรที่เลือกสำหรับส่วนต่างๆ ของเว็บไซต์ได้โดยตรง อย่างไรก็ตาม มีวิธีแก้ไขง่ายๆ สำหรับปัญหานี้ เพียงไปที่การตั้งค่า จากนั้นไปที่ Google Fonts ซึ่งคุณสามารถสร้างการควบคุมแบบอักษรของคุณเองได้ ในการทำเช่นนี้ เพียงป้อนชื่อควบคุมลงในช่องและเลือกตัวเลือก CSS ซึ่งช่วยให้คุณเพิ่มองค์ประกอบ HTML ที่คุณต้องการกำหนดเป้าหมายสำหรับแบบอักษรนี้ได้ เมื่อคุณป้อนข้อมูลนี้แล้ว อย่าลืมบันทึกการเปลี่ยนแปลงของคุณโดยคลิกที่ปุ่ม บันทึกการควบคุมแบบอักษร เพื่อให้การตั้งค่าของคุณได้รับการอัปเดตอย่างสมบูรณ์ จากนั้น คุณสามารถสร้างการควบคุมฟอนต์แบบกำหนดเองได้มากเท่าที่คุณต้องการสำหรับแต่ละส่วนในเว็บไซต์ WordPress ของคุณ

ขั้นตอนที่ 3

หากต้องการใช้ตัวควบคุมแบบอักษรใหม่เหล่านี้หลังจากที่คุณสร้างแล้ว ให้กลับไปที่ส่วนลักษณะที่ปรากฏ คลิกที่ Customizer จากนั้นคลิกที่แท็บการพิมพ์ ต่อไปนี้ คุณจะเห็นตัวเลือกที่มีข้อความว่า Theme Typography – เมื่อคุณคลิกที่นี่ คุณจะสามารถเข้าถึงการควบคุมแบบอักษรแบบกำหนดเองของคุณโดยเพียงแค่เลือกปุ่มแก้ไข เพื่อให้คุณสามารถเลือกแบบอักษรที่คุณต้องการและรูปลักษณ์ที่คุณต้องการสำหรับสิ่งนี้โดยเฉพาะ ควบคุม. อย่าลืมบันทึกการเปลี่ยนแปลงของคุณอีกครั้ง โดยคลิกที่ปุ่มเผยแพร่หรือบันทึกเพื่ออัปเดตไซต์ของคุณ

หมายเหตุด่วน:

ปลั๊กอินแบบอักษร WordPress แบบกำหนดเองที่ยอดเยี่ยมอื่นๆ ที่เราขอแนะนำคือเครื่องมืออัปโหลดแบบอักษรแบบกำหนดเองและใช้แบบอักษรใดก็ได้ – แต่มีตัวเลือกอื่นๆ อีกนับไม่ถ้วน ดังนั้นสำรวจตัวเลือกของคุณก่อนตัดสินใจเลือกแบบที่คุณต้องการใช้

คุณอาจชอบ: 20 ธีม WordPress Micro Niche ที่ขายดีที่สุด

สุดท้าย ลองใช้ธีม

นอกจากสองวิธีหลักในการเพิ่มฟอนต์และตัวพิมพ์แบบกำหนดเองในเว็บไซต์ WordPress ของคุณแล้ว คุณยังสามารถใช้ธีมที่คุณสามารถเลือกได้ มีธีมให้เลือกมากมาย ซึ่งหลายธีมมาพร้อมกับตัวเลือกในตัวที่ให้คุณปรับแต่งฟอนต์ที่ติดตั้งไว้ ขั้นตอนในการทำเช่นนั้นจะแตกต่างกันไปขึ้นอยู่กับธีมที่คุณใช้ ดังนั้นอย่าลืมค้นหาคำแนะนำที่เหมาะสมเพื่อให้ตรงกับธีมของคุณ ธีม WordPress คุณภาพสูงระดับพรีเมียมจะนำเสนอเอกสารสำหรับการเข้าถึงออนไลน์ ซึ่งให้แนวทางสำหรับการเพิ่มแบบอักษรที่กำหนดเองให้กับธีมนั้น ๆ

องค์ประกอบด้านภาพและการออกแบบถือเป็นหนึ่งในปัจจัยที่สำคัญที่สุดในการสร้างเว็บไซต์ที่มีประสิทธิภาพซึ่งจะดึงดูดความสนใจของทุกคนที่เข้าเยี่ยมชม หนึ่งในคุณสมบัติที่ใหญ่ที่สุดภายในทรงกลมนี้คือการใช้แบบอักษร ไม่ว่าคุณจะเลือกเพิ่มฟอนต์แบบกำหนดเองในเว็บไซต์ WordPress ของคุณด้วยวิธีใด คุณควรค้นหาและใช้ฟอนต์ที่เหมาะสมที่สุดสำหรับสไตล์ ผู้ชม เนื้อหา ธีม และโทนของเว็บไซต์และแบรนด์ทั้งหมดของคุณ

 บทความนี้เขียนโดย Beatrice Beard Beatrice เป็นนักเขียนคำโฆษณามืออาชีพที่ Academic Brits ซึ่งเชี่ยวชาญในหัวข้อและสาขาวิชาที่น่าประทับใจมากมาย เบียทริซเปิดกว้างเสมอที่จะแบ่งปันประสบการณ์ส่วนตัวของเธอและให้คำแนะนำจากผู้เชี่ยวชาญแก่นักเขียนมือใหม่ที่เปิดเผยความท้าทายและลักษณะเฉพาะของการสร้างเนื้อหาคุณภาพสูงที่ขายได้จริง