ทำไม Wordpres ถึงไม่ให้ฉันอัปโหลดไฟล์ Svg

เผยแพร่แล้ว: 2023-01-17

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

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

ทำไม Svg ถึงไม่ได้รับอนุญาตใน WordPress?

ทำไม Svg ถึงไม่ได้รับอนุญาตใน WordPress?
รูปภาพโดย – googleusercontent.com

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

ฉันจะเปิดใช้งานไฟล์ Svg ใน WordPress ได้อย่างไร

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

Elementor และ Svg: จะทำอย่างไรเมื่อรูปแบบกราฟิกของคุณเข้ากันไม่ได้

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

ทำไม Svg ไม่แสดงใน Html

หากคุณต้องการใช้ SVG ให้มองหา img src=”image” ในโครงการของคุณ คุณอาจมีไฟล์ภาพพื้นหลัง svg”> หรือ CSS ที่เชื่อมโยงอย่างถูกต้องและปรากฏอย่างสมบูรณ์ แต่เบราว์เซอร์ไม่แสดง ซึ่งหมายความว่าเซิร์ฟเวอร์ให้บริการไม่ถูกต้อง

ทำไมคุณควรจัดรูปแบบ Svgs ให้เหมือนกับองค์ประกอบ Html ทั่วไป

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

WordPress รองรับไฟล์ Svg หรือไม่

WordPress รองรับไฟล์ Svg หรือไม่
ภาพถ่ายโดย – wpglorify.com

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

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

รูปภาพ Svg: ใช้ Firefox เพื่อการสนับสนุนที่ดีที่สุด

ฟังก์ชันใหม่ของ Elementor ช่วยให้คุณสามารถบันทึกรูปภาพของคุณเป็นรูปแบบไฟล์ SVG ได้โดยตรงจากตัวแก้ไขโดยไม่ต้องพึ่งพาส่วนเสริมของบุคคลที่สาม ขนาดหรือความละเอียดของเนื้อหารูปภาพของคุณสามารถตั้งค่าให้กับอุปกรณ์จำนวนเท่าใดก็ได้โดยใช้ไฟล์ SVG ซึ่งจะเป็นประโยชน์ในการสร้างการออกแบบที่ปรับเปลี่ยนตามอุปกรณ์หรือเมื่อคุณต้องการบันทึกรูปภาพในรูปแบบที่ถูกต้อง SVG (การรองรับพื้นฐาน) ได้รับการสนับสนุนอย่างเต็มที่ใน Chrome 4-106 และไม่ได้รับการสนับสนุนบางส่วนในเวอร์ชันอื่น ๆ แต่จะไม่รองรับอย่างสมบูรณ์ใน Chrome สี่เวอร์ชันที่อยู่ต่ำกว่าเวอร์ชัน 4 การสนับสนุน SVG พื้นฐาน มีให้ใช้งานใน Safari 3.2-16 บางส่วน รองรับใน 3.2-5.1 และไม่รองรับต่ำกว่า 3.0 ในทางกลับกัน Firefox ให้การสนับสนุนที่ดีที่สุดสำหรับไฟล์ SVG เช่นเดียวกับการสนับสนุนเต็มรูปแบบในทุกเวอร์ชันและอุปกรณ์ หากคุณตั้งใจจะใช้ Firefox ในการเรนเดอร์ จำเป็นอย่างยิ่งที่คุณจะต้องใช้มันเพื่อทำเช่นนั้น โดยรวมแล้วเป็นเครือข่ายสนับสนุนที่ดีที่สุด

ฉันจะอัปโหลด Svg ไปยังเว็บไซต์ของฉันได้อย่างไร

ฉันจะอัปโหลด Svg ไปยังเว็บไซต์ของฉันได้อย่างไร
ภาพถ่ายโดย – letscraftinstead.com

สมมติว่าคุณมีไฟล์ที่บันทึกไว้ในคอมพิวเตอร์ของคุณ:
1. เปิดไฟล์ในโปรแกรมแก้ไขข้อความหรือเวกเตอร์
2. คัดลอกรหัส
3. ไปที่โปรแกรมแก้ไขโค้ดของเว็บไซต์ของคุณ และค้นหาไฟล์ที่คุณต้องการให้ SVG ปรากฏ
4. วางรหัสลงในไฟล์นั้น
5. บันทึกไฟล์และอัปโหลดไปยังเซิร์ฟเวอร์ของคุณ

คุณต้องใช้ปลั๊กอิน SVG เพื่อไปที่นั่น หากต้องการฝัง SVG ในเอกสาร HTML คุณต้องค้นหาและติดตั้งปลั๊กอิน SVG ที่เหมาะสมก่อน ปลั๊กอินทั้งหมดที่เราทดสอบนั้นใช้งานง่ายมากและพร้อมใช้งานทั้งหมด เมื่อคุณติดตั้งปลั๊กอินแล้ว สิ่งที่คุณต้องทำคือสร้างเอกสาร HTML ด้วยคำต่อไปนี้: svg width=500 height=500 วิธีที่ง่ายและรวดเร็วที่สุดในการแทรกรูปภาพคือการใช้องค์ประกอบ img หากต้องการฝังรูปภาพผ่านองค์ประกอบ img> สิ่งที่คุณต้องทำคือใช้ URL ล่าสุดที่คุณคาดหวัง หาก SVG ของคุณไม่มีอัตราส่วนกว้างยาวโดยธรรมชาติ คุณจะต้องมีแอตทริบิวต์ความสูงหรือความกว้าง หากคุณได้ดำเนินการแล้ว โปรดไปที่ HTML เพื่อดูรูปภาพ ฉันใช้ปลั๊กอิน SVG เพื่อบรรลุเป้าหมายระยะยาวนี้ ก่อนที่คุณจะฝัง SVG ในเอกสาร HTML ได้ คุณต้องระบุปลั๊กอินที่เหมาะสมสำหรับมันก่อน เมื่อติดตั้งปลั๊กอินแล้ว ให้ป้อนบรรทัดต่อไปนี้ในเอกสาร HTML ของคุณ: *svg width=500, *height=500 และอื่นๆ


WordPress Svg ขออภัย คุณไม่ได้รับอนุญาตให้อัปโหลดไฟล์ประเภทนี้

Wordpress Svg ขออภัย คุณไม่ได้รับอนุญาตให้อัปโหลดไฟล์ประเภทนี้
ภาพโดย – thum.io

เมื่อคุณพยายามอัปโหลดไฟล์ไปยัง WordPress ข้อความแสดงข้อผิดพลาดจะอ่านว่า “ขออภัย ไฟล์ประเภทนี้ไม่ได้รับอนุญาตด้วยเหตุผลด้านความปลอดภัย” เนื่องจาก WordPress กำหนดค่าเริ่มต้นเป็นการตั้งค่า "ประเภทสื่อ" (หรือที่เรียกว่าประเภท MIME) สิ่งนี้จะเกิดขึ้นเมื่ออัปโหลดไฟล์

เปิดใช้งาน Svg อัปโหลด WordPress โดยไม่ต้องใช้ปลั๊กอิน

หากต้องการเปิดใช้งานการอัปโหลด SVG ใน WordPress โดยไม่ต้องใช้ปลั๊กอิน คุณต้องเพิ่มโค้ดต่อไปนี้ในไฟล์ functions.php ของธีมของคุณ: function wp_check_for_svg($data , $file, $filename, $mimes){ global $wp_version; if(substr($filename, -3) == 'svg' || substr($filename, -3) == 'svgz'){ if(class_exists('SimpleXMLElement')){ $xml = new SimpleXMLElement($file ); if(isset($xml->svg)){ คืนค่าจริง; } } } ส่งคืนข้อมูล $; } add_filter('wp_check_filetype_and_ext', 'wp_check_for_svg', 10, 4);

Svg ไม่แสดงใน WordPress

หากคุณมีปัญหาในการดูรูปภาพ SVG ของคุณใน WordPress อาจเกิดจากหลายปัจจัย ก่อนอื่น ให้ตรวจสอบว่าธีมของคุณใช้ ตัวบล็อก SVG หรือไม่ หากใช่ คุณจะต้องค้นหาธีมใหม่หรือแก้ไขโค้ดของธีมเพื่อให้อนุญาตไฟล์ SVG หากธีมของคุณไม่ใช่ปัญหา เป็นไปได้ว่าการติดตั้ง WordPress ของคุณไม่มีสิทธิ์ที่เหมาะสมในการเข้าถึงไฟล์ SVG คุณสามารถแก้ไขได้โดยเพิ่มบรรทัดต่อไปนี้ในไฟล์ wp-config.php ของคุณ:defined( 'ALLOW_UNFILTERED_UPLOADS', true );

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

เหตุใดไฟล์ Svg ของฉันจึงไม่ทำงานกับ Elementor

ปัญหานี้อาจเกิดจากหลายปัจจัย ประการแรก Elementor อาจไม่รองรับไฟล์ SVG เนื่องจากขาดการสนับสนุน Elementor อาจแสดงไฟล์ SVG ไม่ถูกต้อง เป็นไปได้ว่าคุณกำลังใช้รูปแบบไฟล์ที่ไม่ถูกต้องสำหรับ SVG ของคุณ คุณอาจใช้เบราว์เซอร์ที่ไม่ถูกต้อง หาก Elementor ไม่รองรับไฟล์ SVG ของคุณ คุณสามารถใช้ปลั๊กอิน WordPress เพื่อรับการสนับสนุนที่จำเป็นได้ มีปลั๊กอินบางตัวที่รองรับ SVG เช่น Elementor SVG Editor และ SVG-Block หาก Elementor แสดงไฟล์ SVG ไม่ถูกต้อง คุณสามารถจัดรูปแบบให้เป็นสิ่งที่ Elementor รองรับ เช่น PNG หรือ JPG หากคุณมีปัญหากับเบราว์เซอร์ ให้ลองใช้เบราว์เซอร์อื่น

รองรับ WordPress Svg

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

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

ปลั๊กอินสนับสนุน Svg ไม่ทำงาน

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