จัดการเรื่อง Custom Font ไม่แสดงผลเวลาย้ายเว็บ

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

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

ทีนี้ครับ จากการที่ผมพัฒนาเว็บไซต์ให้ลูกค้าแล้ว ทำในเครื่องตัวเองก่อน พอเสร็จแล้วก็เอาขึ้น Server เพื่อให้ลูกค้าได้ลองเล่นๆดู ผมก็เจอปัญหาอยู่อย่างหนึ่งคือ Custom Font ที่ผมเพิ่มเข้าไป มันไม่ทำงาน! พูดอีกอย่างก็คือ มันไม่แสดงผลฟอนต์นั้นบนหน้าเว็บ!!

ผมลอง Inspect ดูว่าเอ ปัญหามันเกิดจากอะไรนะ ก็พบว่า ที่มันไม่ทำงานก็เพราะว่า ตำแหน่งการเรียกฟอนต์ของ CSS มันยังเรียนที่ localhost อยู่เลย ไม่ยอมเรียกที่ URL เว็บใหม่

และนั่นแหละครับคือปัญหา ซึ่งผมก็ไม่ได้เจอคนเดียวด้วย คนอื่นก็เจอครับ ผมก็เลยส่งเมลไปถามทีมงานพัฒนา elementor ก็ได้รับคำแนะนำมาครับ ซึ่งวิธีการแก้ไขก็ไม่ยากเลย ผมก็เลยมาเขียนบล็อกบันทึกไว้เผื่อใครเจอปัญหาแบบเดียวกัน

ปัญหานั้น คาดว่าน่าจะเกิดจากตอนย้ายเว็บ ที่ผมย้ายด้วยปลักอิน WP All in One Migration แล้วมันไม่ได้เปลี่ยน URL ของ CSS ใน Elementor คับ ทำให้ URL ยังเป็นของเว็บเดิม

การแก้ไข ให้เราไปที่เมนูหลังบ้าน Elementor > Tools ตรงแท็บ General ให้คลิกปุ่ม Regenerate Files ครับ . เพียงแค่นี้ก็จะแก้ปัญหาได้แล้วครับ

ใช้กันดูนะครับผม

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

Privacy Preferences

คุณสามารถเลือกการตั้งค่าคุกกี้โดยเปิด/ปิด คุกกี้ในแต่ละประเภทได้ตามความต้องการ ยกเว้น คุกกี้ที่จำเป็น

ยอมรับทั้งหมด
Manage Consent Preferences
  • คุกกี้ที่จำเป็น
    Always Active

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

  • คุกกี้เพื่อการวิเคราะห์

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

  • คุกกี้เพื่อปรับเนื้อหาให้เข้ากับกลุ่มเป้าหมาย

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

บันทึก