วิธีเปลี่ยนแบบอักษรใน WordPress

เผยแพร่แล้ว: 2024-04-22

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

คำถามที่พบบ่อย

ฉันจะเปลี่ยนรูปแบบตัวอักษรบนเว็บไซต์ของฉันได้อย่างไร?

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

ฉันจะเพิ่มแบบอักษรเฉพาะลงใน WordPress ได้อย่างไร?

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

คุณจะเปลี่ยนแบบอักษรในรูปแบบ WordPress ได้อย่างไร?

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

แบบอักษรของเว็บคืออะไร?

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

แบบอักษรเว็บ 4 แบบ

  • แบบอักษร TrueType (TTF): เป็นไฟล์แบบอักษรอเนกประสงค์ที่ใช้ทั้งในเดสก์ท็อปและในบริบทของเว็บ ได้รับการรองรับอย่างกว้างขวางในอุปกรณ์และระบบปฏิบัติการต่างๆ
  • แบบอักษร OpenType (OTF): คล้ายกับ TrueType แต่มีความสามารถด้านการพิมพ์ขั้นสูง เช่น การรองรับอักษรควบและอักขระสำรอง ทำให้เหมาะสำหรับเค้าโครงข้อความที่ซับซ้อน
  • รูปแบบแบบอักษรเปิดบนเว็บ (WOFF): ออกแบบมาโดยเฉพาะสำหรับการใช้งานบนเว็บ แบบอักษรเหล่านี้ได้รับการบีบอัดและปรับให้เหมาะสมเพื่อให้โหลดได้รวดเร็ว WOFF ถือเป็นรูปแบบฟอนต์เว็บมาตรฐานเนื่องจากมีความเข้ากันได้และประสิทธิภาพที่กว้างขวาง
  • แบบอักษร OpenType แบบฝัง (EOT): พัฒนาโดย Microsoft แบบอักษรเหล่านี้ใช้ใน Internet Explorer เวอร์ชันเก่าเป็นหลัก และพบได้น้อยกว่าในปัจจุบัน

จะเปลี่ยนแบบอักษรใน WordPress ได้อย่างไร?

วิธีที่ 1: การใช้เครื่องมือปรับแต่งธีมเพื่อเปลี่ยนแบบอักษรใน WordPress

เมื่อปรับแบบอักษรโดยใช้เครื่องมือปรับแต่งธีม WordPress โดยเฉพาะกับธีม North Shore คุณสามารถทำตามขั้นตอนหมายเลขเหล่านี้:

  1. เข้าสู่แดชบอร์ด WordPress ของคุณ
  2. ไปที่ ลักษณะที่ปรากฏ > ปรับแต่งเพื่อเปิดตัวปรับแต่งธีม
  3. เมื่ออยู่ในเครื่องมือปรับแต่งแล้ว ให้คลิก ที่Fonts
    การใช้เครื่องมือปรับแต่งธีมเพื่อเปลี่ยนแบบอักษรใน WordPress
  4. คุณสามารถตั้งค่าแบบอักษรสำหรับชื่อไซต์ เมนูการนำทาง ส่วนหัว และข้อความเนื้อหาแยกกันได้
    การใช้เครื่องมือปรับแต่งธีมเพื่อเปลี่ยนแบบอักษร
  5. หลังจากเลือกแบบอักษรแล้ว คลิกเผยแพร่ หรือ อัปเดตเพื่อเพิ่มลงในไซต์ของคุณ

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

      วิธีที่ 2: ใช้การแก้ไขไซต์แบบเต็มเพื่อเปลี่ยนแบบอักษรใน WordPress

      ธีมตัวแก้ไขไซต์เต็ม (FSE) จำนวนมากมาพร้อมกับแบบอักษรให้เลือกมากมาย ในตัวอย่างนี้ เราใช้ธีม Twenty Twenty-Two ซึ่งอนุญาตให้คุณแก้ไขแบบอักษรได้โดยตรงภายในตัวแก้ไขธีม ต่อไปนี้คือวิธีที่คุณสามารถเปลี่ยนแบบอักษร:

      1. ไปที่ลักษณะที่ปรากฏ > ตัวแก้ไขบนแดชบอร์ด WordPress ของคุณ
        การเปลี่ยนแบบอักษรโดยใช้การแก้ไขไซต์ WordPress แบบเต็ม
      2. คลิกที่ไอคอน รูปแบบ S ที่อยู่ทางด้านซ้ายของหน้าจอเพื่อเข้าถึงการตั้งค่ารูปแบบและเลือกไอคอน ปากกา เพื่อ แก้ไข
        การเปลี่ยนแบบอักษรโดยใช้การแก้ไขไซต์แบบเต็ม
      3. เลือก ส่วนการพิมพ์ เพื่อเปิดการตั้งค่าแบบอักษรสำหรับธีมของคุณ
      4. ภายในการตั้งค่าการพิมพ์ ให้เลือกองค์ประกอบข้อความที่คุณต้องการแก้ไข เช่น ข้อความไซต์หรือข้อความลิงก์
      5. คลิก เมนูแบบเลื่อนลง ตระกูลแบบอักษร เพื่อดูและเลือกจากแบบอักษรที่มีอยู่หรืออัปโหลดแบบอักษรใหม่
        การเปลี่ยนแบบอักษรด้วยการแก้ไขไซต์ WordPress แบบเต็ม
      6. คุณสามารถเลือกที่จะปรับขนาดแบบอักษร ความสูงของบรรทัด และลักษณะโดยรวมให้เหมาะกับความต้องการของคุณ
      7. เมื่อคุณทำการเลือกแล้ว ให้คลิก ปุ่มบันทึก ที่ด้านบนขวาของหน้าเพื่อใช้การเปลี่ยนแปลงของคุณ

            กระบวนการนี้ช่วยให้คุณปรับแต่งการออกแบบตัวอักษรของไซต์ของคุณได้อย่างง่ายดายภายในสภาพแวดล้อม FSE ซึ่งช่วยเพิ่มทั้งความสวยงามและประสบการณ์ผู้ใช้

            วิธีที่ 3: การใช้ตัวแก้ไขบล็อกเพื่อเปลี่ยนแบบอักษรใน WordPress

            1. เลือก ตัวแก้ไขบล็อก จาก การตั้งค่า>การเขียน เริ่มต้นด้วยการแก้ไขโพสต์หรือเพจที่คุณต้องการเปลี่ยนแบบอักษร
            2. ปรับเปลี่ยนข้อความและสีพื้นหลังเลือก บล็อกข้อความที่คุณต้องการใช้การเปลี่ยนแปลง
              การเปลี่ยนแบบอักษร WordPress ด้วยตัวแก้ไขบล็อก
            3. ปรับขนาดตัวอักษรและรูปลักษณ์ ในแถบด้านข้างเดียวกัน ให้ตั้งค่าขนาดตัวอักษรที่ต้องการ
            4. ปรับปรุงการจัดรูปแบบข้อความและเพิ่มคุณสมบัติข้อความ หากจำเป็น ให้เพิ่มอักขระตัวห้อยหรือตัวยกลงในข้อความของคุณ
            5. หลังจากทำการปรับเปลี่ยนแล้ว ตรวจสอบให้แน่ใจว่าคุณได้บันทึก หรือ อัปเดตโพสต์เพื่อใช้การเปลี่ยนแปลง

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

              วิธีที่ 4: การใช้ปลั๊กอินเพื่อเปลี่ยนแบบอักษรใน WordPress

              หากคุณใช้ธีม WordPress ทั่วไปและต้องการเปลี่ยนแบบอักษร คุณอาจจำเป็นต้องใช้ปลั๊กอิน เช่นFonts Plugin |การพิมพ์แบบอักษรของ Googleต่อไปนี้เป็นวิธีเริ่มต้นใช้งาน:

              1. ไปที่ปลั๊กอิน > เพิ่มใหม่ในแดชบอร์ด WordPress ของคุณ และติดตั้ง Fonts Plugin | การพิมพ์แบบอักษรของ Google
                การใช้ปลั๊กอินเพื่อเปลี่ยนแบบอักษรใน WordPress
              2. ไปที่ลักษณะที่ปรากฏ > ปรับแต่ง เมื่อโหลดแล้ว คุณจะพบส่วนใหม่ชื่อปลั๊กอินแบบ อักษรภายในส่วนนี้มีหลายแท็บรวมถึงการตั้งค่าพื้นฐาน การตั้งค่าขั้นสูง การโหลดแบบอักษร และการดีบัก
              3. ในการตั้งค่าพื้นฐาน ให้เลือกตระกูลแบบอักษรเริ่มต้นจากตัวเลือกแบบอักษรของ Google มากกว่า 1,400 แบบระบุแบบอักษรสำหรับส่วนหัว ปุ่ม และอินพุตการตั้งค่าขั้นสูง ช่วยให้คุณสามารถปรับแบบอักษรสำหรับชื่อเว็บไซต์ สโลแกน และเมนูการนำทางได้
              4. ตอนนี้คุณสามารถ แก้ไข ตัวพิมพ์พื้นฐาน ตัวพิมพ์ส่วนหัว และตัวพิมพ์ของปุ่มและอินพุตได้
              5. รุ่น Pro ช่วยให้คุณสามารถปลดล็อกขนาดและสีแบบอักษร โฮสต์แบบอักษรในเครื่อง เพิ่มประสิทธิภาพการโหลดแบบอักษร และอัปโหลดแบบอักษรที่กำหนด เอง
              6. และอย่าลืม เผยแพร่ หรือ อัปเดตเพื่อบันทึกการเปลี่ยนแปลง
              7. หากจำเป็น ให้ใช้ ปุ่ม รีเซ็ต เพื่อคืนค่าการเปลี่ยนแปลงทั้งหมดที่ทำกับปลั๊กอิน

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

                  วิธีที่ 5: การเพิ่มแบบอักษรที่กำหนดเองใน WordPress ด้วยตนเอง

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

                  1. ไปที่แบบอักษรของ Google และเลือกแบบอักษร Roboto เลือกสไตล์ที่คุณต้องการรวม
                  2. คัดลอกลิงก์ที่ให้ไว้ในโค้ดฝังจาก Google Fonts มันจะมีลักษณะดังนี้:
                   https: / /fonts.googleapis.com/css 2?family= Roboto:wght @100 ; 300 ; 400 ; 500 ; 700 ; 900 &display=swap
                  1. ใช้ไคลเอนต์ FTP เช่น FileZilla เพื่อเชื่อมต่อกับเว็บไซต์ของคุณ ไปที่ /public_html/wp-content/themes/yourthemechild/functions.php (แทนที่ yourthemechild ด้วยชื่อธีมลูกของคุณ)
                  2. เปิดไฟล์ function.php และต่อท้ายโค้ดต่อไปนี้:
                   ฟังก์ชั่น add_my_font () {
                  
                  wp_enqueue_style ( 'add_my_font' , 'https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap' , false );
                  
                  -
                  
                  add_action ( 'wp_enqueue_scripts' , 'add_my_font' );
                  1. ใช้แบบอักษรกับเว็บไซต์ของคุณ:
                    • ค้นหาไฟล์ style.css ของธีมลูกของคุณในไดเร็กทอรีเดียวกัน
                    • เพิ่ม CSS ต่อไปนี้เพื่อกำหนดตำแหน่งที่ควรใช้ Roboto:
                   .ร่างกาย , .h1 , .h2 , .h3 , .h4 , .h5 , .h6 {
                  
                  ตระกูลฟอนต์ : 'Roboto' , sans-serif;
                  
                  -
                  • CSS นี้จะใช้แบบอักษร Roboto กับข้อความเนื้อหาและส่วนหัวทั้งหมดทั่วทั้งไซต์ของคุณ

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

                  เคล็ดลับเพิ่มเติมเมื่อเปลี่ยนแบบอักษรใน WordPress

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

                  บทสรุป

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