วิธีเพิ่มไฟล์ SVG ใน WordPress (2 วิธีง่าย ๆ)

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

SVG คืออะไร?

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

SVG ทำงานอย่างไร

กราฟิกแบบเวกเตอร์ที่สามารถปรับขนาดได้ (SVG) เป็นเทคโนโลยีที่แสดงภาพวาดสองมิติโดยใช้ XML มีความแตกต่างจากรูปแบบภาพที่ใช้กันทั่วไปเช่น PNG, GIF หรือ JPEGs

หากคุณใช้ไฟล์ภาพ png/jpeg เวลาเราซูมเข้าไป เราจะสังเกตเห็นว่าภาพจะเริ่มเบลอและกลายเป็นพิกเซล

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

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

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

แต่ถึงกระนั้นไฟล์ SVG ยังคงเป็นชนิดที่ไม่ปลอดภัย นั่นเป็นเหตุผลที่ WordPress ไม่สนับสนุนการอัพโหลดไฟล์ SVG ในตอนเริ่มต้น

หากคุณอัพโหลดภาพ SVG ในเวิร์ดเพรสคุณจะเห็นข้อความข้อผิดพลาดต่อไปนี้:

ขออภัย, ไฟล์ประเภทนี้ไม่ได้รับอนุญาตเนื่องจากเหตุผลด้านความปลอดภัย

ปัญหาด้านความปลอดภัยเกี่ยวกับ SVG ใน WordPress

ไฟล์ SVG นั้นมีรหัสในภาษามาร์กอัป XML ซึ่งคล้ายกับ HTML ซอฟต์แวร์ที่ใช้แก้ไขเบราว์เซอร์เพื่อแสดงผลลัพธ์บนหน้าจอ

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

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

ทางออกที่ดีที่สุดคือการใช้ไฟล์ SVG ที่สร้างขึ้นโดยแหล่งที่เชื่อถือได้เท่านั้นและเพื่อจำกัดการอัพโหลด SVG ไปยังผู้ใช้ที่เชื่อถือได้เท่านั้น

วิธีที่ 1 วิธีเพิ่มไฟล์ SVG ใน WordPress โดยใช้ปลั๊กอิน SVG Support

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

ขั้นแรกคุณต้องติดตั้งและเปิดใช้งานปลั๊กอิน SVG Support

เมื่อเปิดใช้งานคุณต้องไปที่ การตั้งค่า» SVG Support เพื่อกำหนดการตั้งค่าปลั๊กอิน

ในหน้าการตั้งค่าคุณต้องทำเครื่องหมายถูกในช่อง “Restrict to Administrators?” เพียงเท่านี้ผู้ดูแลเว็บไซต์จะสามารถอัปโหลดไฟล์ SVG ในเวิร์ดเพรส ได้แต่เพียงผู้เดียว

ตัวเลือกถัดไปคือการเปิดโหมดขั้นสูง “Enable Advanced Mode” คุณอาจเลือกตัวเลือกนี้หากคุณต้องการที่จะใช้คุณลักษณะขั้นสูงเช่น CSS ภาพเคลื่อนไหวและการแสดง SVG แบบ inline

อย่าลืมคลิกที่ปุ่มบันทึกการเปลี่ยนแปลง “Save Change” เพื่อจัดเก็บการตั้งค่าของคุณ

เพียงเท่านี้คุณจะสามารถอัปโหลดไฟล์ SVG ได้เช่นเดียวกับไฟล์รูปภาพอื่นๆ ตามปกติ

วิธีที่ 2 วิธีเพิ่มไฟล์ SVG ใน WordPress โดยใช้ปลั๊กอิน Safe SVG

วิธีนี้เหมือนกันกับวิธีแรก คือใช้ปลั๊กอินช่วยให้เราสามารถอัพโหลดไฟล์ภาพ SVG ไปยัง WordPress

สิ่งแรกที่คุณต้องทำคือการติดตั้งและเปิดใช้งานปลั๊กอิน Safe SVG

ปลั๊กอินจะทำงานทันทีหลังจากกดใช้งานปลั๊กอิน และไม่มีความจำเป็นที่จะต้องตั้งค่าใด ๆ คุณสามารถทำการอัพโหลดไฟล์ภาพ SVG ได้ทันที

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

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