การแทรกโค้ด iframe

วิธีแทรกโค้ด iframe

เมื่อสร้างบทเรียนในคอร์ส คุณสามารถใช้โค้ด iframe เพื่อเพิ่มสื่อจากบริการภายนอกลงในบทเรียน เช่น Google Sheets, Google Forms, Wordwall หรืองานนำเสนอจาก Canva, Genial.ly และบริการอื่น ๆ ที่รองรับการฝังโค้ดบนหน้าเว็บ วิธีนี้ช่วยให้ผู้เรียนกรอกแบบฟอร์มและดูงานนำเสนอได้โดยตรงในบทเรียนโดยไม่ต้องออกจากหน้า

คุณสามารถดูตัวอย่างบทเรียนได้ที่ ลิงก์.

วิธีแทรกโค้ดลงในบทเรียน

หากต้องการแทรกโค้ดลงในบทเรียน เพียงเพิ่มองค์ประกอบข้อความ รูปภาพ และการฝังโค้ด

จากนั้นเลือกปุ่มฝังโค้ดบนแถบเครื่องมือ แล้ววางโค้ด

หากต้องการเปลี่ยนความสูงหรือความกว้างของวัตถุที่ฝังไว้ (งานนำเสนอ สเปรดชีต เกม ฯลฯ) ให้เพิ่มขนาดลงในโค้ด width="640" height="1000", โดยใส่ค่าตัวเลขที่เหมาะสมกับวัตถุที่ฝังไว้

วิธีค้นหาโค้ดสำหรับฝัง

Google Forms

เปิดแบบฟอร์มที่คุณต้องการฝังในบทเรียนหรืองานที่มอบหมาย คลิกส่ง เลือกไอคอนโค้ด แล้วคัดลอกโค้ด คุณยังสามารถปรับขนาดแบบฟอร์มได้ในหน้าต่างเดียวกัน

Google Sheets

เปิดสเปรดชีตที่คุณต้องการแชร์ ไปที่ไฟล์ — แชร์ — เผยแพร่บนเว็บ — ฝัง แล้วเลือกว่าจะฝังชีตเดียวหรือทั้งเอกสาร เมื่อยืนยันแล้ว ระบบจะสร้างโค้ดที่คุณสามารถใช้ในบทเรียนหรืองานที่มอบหมายบน Kwiga ได้ โปรดจำไว้ว่าคุณสามารถปรับขนาดได้โดยใช้ width="640" height="1000" (ใส่ค่าใดก็ได้ตามต้องการ)

Canva

เปิดงานนำเสนอหรืองานออกแบบใน Canva ที่คุณต้องการใช้ในบทเรียนหรือแบบทดสอบ แล้วคลิก แชร์ — เพิ่มเติม — ฝัง, ยินยอมให้เผยแพร่งานนำเสนอเป็นสาธารณะ แล้วเผยแพร่ จากนั้นใช้ โค้ดฝัง HTML.

Genial.ly

ตรวจสอบให้แน่ใจว่าคุณเผยแพร่งานนำเสนอใน Genial.ly แล้ว คุณไม่สามารถแชร์งานนำเสนอฉบับร่างหรืองานนำเสนอส่วนตัวได้

จากนั้นคลิก แชร์ ถัดจากปุ่ม นำเสนอ เลือกฝัง แล้วคัดลอก โค้ด iframe.

หากต้องการเปลี่ยนขนาดของงานนำเสนอที่ฝังไว้ ให้แก้ไขค่าความสูงและความกว้าง

WordWall

เปิดสื่อที่คุณต้องการเพิ่มลงในบทเรียนหรืองานที่มอบหมายบน Kwiga แล้วคลิก แชร์, เลือกไอคอนโค้ด แล้วเลือก iframe (เลือกไว้เป็นค่าเริ่มต้น) คัดลอกโค้ดและนำไปใช้บน Kwiga

เช่นเคย คุณสามารถปรับขนาดสื่อที่ฝังไว้ได้โดยเปลี่ยนค่าความกว้างและความสูง

Quizlet

เปิดหน้าแบบทดสอบบน Quizlet แล้วหาปุ่มแชร์และปุ่มจุดสามจุดที่อยู่ข้างกัน คลิกจุดสามจุด แล้วเลือก ฝัง:

ในหน้าต่างที่เปิดขึ้น คุณสามารถเปลี่ยนโหมดการเรียนและคัดลอกโค้ดด้านล่างเพื่อเพิ่มลงในหน้าบทเรียนของคุณ (ไฮไลต์ด้วยสีเหลือง):

Dropbox

คุณสามารถฝังวิดีโอที่อัปโหลดไปยัง Dropbox ในบทเรียนได้ โดยต้องนำลิงก์โดยตรงไปยังไฟล์วิดีโอมาใช้ (ไม่ใช่ลิงก์จากปุ่มแชร์ใน Dropbox!) แล้วฝังวิดีโอเป็น iframe

ยอมรับคุกกี้เพื่อดูเนื้อหาที่ฝังไว้ เปิดในแท็บใหม่

ขั้นตอนมีดังนี้:

1. เปิดบัญชี Dropbox ของคุณ ค้นหาไฟล์ แล้วคลิกแชร์ ตรวจสอบว่าทุกคนที่มีลิงก์สามารถดูไฟล์ได้ จากนั้นคัดลอกลิงก์ไปยังโปรแกรมแก้ไขข้อความ

2. ที่ท้ายลิงก์ คุณจะพบ dl=0 ซึ่งคุณต้องเปลี่ยนเป็น raw=1 ภาพหน้าจอด้านล่างแสดงลิงก์สองรายการ ได้แก่ ลิงก์ต้นฉบับที่คัดลอกมาใน ขั้นตอนที่ 1 และลิงก์ที่แก้ไขแล้วด้านล่าง

3. คัดลอกลิงก์ที่แก้ไขแล้ว (ลิงก์ด้านล่าง) ไปวางในแถบที่อยู่ของเบราว์เซอร์ แล้วกด Enter จากนั้นแถบที่อยู่จะแสดง URL อื่น ซึ่งเป็นลิงก์โดยตรงไปยังไฟล์ที่คุณต้องใช้สำหรับบทเรียน

4. เปิดบทเรียนแล้วเพิ่มบล็อกข้อความ รูปภาพ หรือฝังโค้ดในตำแหน่งที่คุณต้องการแทรกวิดีโอ คลิก + เพิ่ม HTML โค้ด เลือก iframe แล้ววาง URL ของวิดีโอ (ที่ได้จาก ขั้นตอนที่ 3) ลงในช่องลิงก์:

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