ไม่สามารถใส่รูปจากเว็บไซต์อื่นบน Woocommerce product description ครับ

87 4

0 สมาชิก และ 1 บุคคลทั่วไป กำลังดูหัวข้อนี้

หากใส่รูปในเว็บตัวเองตรง Woocommerce product description รูปจะโชว์ปรกติ
แต่ถ้าเอารูปจากอีกเว็บมาใส่(ผมมี 2 เว็บต้องการประหยัดเนื้อที่)รูปจะไม่โชว์ใน product description ครับ

แต่ถ้าเอารูปจากอีกเว็บมาใส่ใน Product short description กลับขึ้นโชว์ได้ปรกติเฉยเลย  อันนี้งงมากๆครับ (หรือเอารูปจากอีกเว็บมาแปะที่บทความก็ขึ้นปรกติครับ)

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

ส่วนของผมทดลองนำภาพจาก domain อื่นมาใส่ใน product description กับ short description ก็ใส่ได้ปกตินะครับ
ตัวอย่างที่ลองใส่
https://demo.indytheme.com/indymall/product/%e0%b8%99%e0%b8%b2%e0%b8%ac%e0%b8%b4%e0%b8%81%e0%b8%b2-ninja-pro-full-11bswaay6-green/

ตรวจสอบแล้วไม่ได้เป็นที่ Host (เปลี่ยน Host ลองดูแล้ว)
ไม่ได้เป็นที่ Plugin  (ปิด Plugin อื่นๆไปหมดแล้ว)
เป็นที่ Theme ครับ (เปลี่ยนเป็น Theme อื่น รูปที่คัดลอกจากเว็บอื่นสามารถแสดงได้ปรกติ)

(A)หลังตรวจสอบเพื่มเติมพบว่า วิธีทำให้รูปแสดงคือ ให้ไป Copy URL ของรูปจากเว็บอื่น
แล้วมาใส่ Product description ด้วยวิธีการ กดปุ่ม Add media แล้วกด insert from URL รูปภาพถึงจะแสดง
เข้าใจว่า URL ตัวอย่างนี้ https://demo.indytheme.com/indymall/product/%e0%b8%99%e0%b8%b2%e0%b8%ac%e0%b8%b4%e0%b8%81%e0%b8%b2-ninja-pro-full-11bswaay6-green/
ใช้วิธีเดียวกัน

(B)รูปจากเว็บอื่นจะไม่แสดงในกรณีที่เราไปคลิกขวารูปที่เว็บอื่นแล้วเลือก Copy image แล้วมา paste ที่ product description ของเว็บเราโดยตรง (หรือลากครอบจากเว็บอื่นกด Copy แล้วมา Paste ที่เว็บเราโดยตรง)
ซึ่งหน้าตา HTML หน้าเว็บจะได้เป็นแบบตัวอย่างด้านล่าง
<img decoding="async" data-src="https://testtesttest.com/images/detailed/10/001.jpg">
ส่วนที่ทำให้ภาพไม่แสดงออกมาคือ "data-src" ผมใช้ google chrome inspection ตรวจสอบและลองแก้ไขจาก "data-src" ไปเป็น "src" เฉยๆ พบว่ารูปสามารถแสดงได้ปรกติ

เราสามารถเอารูปจากเว็บอื่นมาใส่ Product description ด้วยวิธี (A) แต่ว่าค่อนข้างใช้เวลานานกว่าจะคัดลอกทุกรูปมาใส่ได้ และกรณีต้องการคัดลอกตัวอักษรพร้อมรูปภาพนั้นต้องใช้เวลาเยอะมาก
เพื่อให้สามารถคัดลอกรูปจากเว็บอื่นมาใส่ได้อย่างรวดเร็วด้วยวิธี (B) พอจะมีวิธีแนะนำใหมครับ ยกตัวอย่างเช่นแก้ โค้ดบรรทัดใหนของ ไฟล์ function.php ใน Theme ที่จะแก้ "data-src" ไปเป็น "src"
(ผมลองเปลี่ยนไปใช้ Theme อื่น รูปที่คัดลอกมาจากเว็บอื่นเป็นแบบ src สามารถแสดงได้ปรกติครับ) และใน Theme IndyMall เองถ้าคัดลอกรูปมาวางที่ Product Short description รูปก็เป็น "src" รูปสามารถแสดงได้เป็นปรกติครับ ส่วนที่ไม่แสดงที่พบตอบนี้ เนื่องจากเป็น code "data-src" ซึ่งเป็นส่วนตรง Woocommerce product description กับส่วนPage และส่วนPost ครับ

ขอบคุณครับ

ขอบคุณสำหรับข้อมูลเพิ่มเติมครับ
เบื้องต้นลองปิดระบบ lazy-load
โดยแก้ที่ไฟล์ libs/theme-helpers.php ของธีม

หาโค้ด
โค๊ด: [Select]
add_filter( 'the_content', array( $this, 'content_image_lazy_load' ) );
แก้เป็น
โค๊ด: [Select]
// add_filter( 'the_content', array( $this, 'content_image_lazy_load' ) );
*ส่วนบัคนี้จะมีการแก้ในเวอร์ชั่นถัดไปครับ

ขอบคุณมากครับ support ตอบได้เร็วมากๆ
ติดตามเวอร์ชั่นถัดไปครับ^^