Prompt Library ครูนุ่มเดฟเทค

ระบบบันทึกการเยี่ยมบ้าน
1. เป้าหมายหลัก (Primary Goal):
สร้างหน้าเว็บฟอร์มออนไลน์สำหรับ "แบบบันทึกการเยี่ยมบ้านนักเรียน" ของโรงเรียนแม่จันวิทยาคม เพื่อให้นักเรียนและครูสามารถกรอกข้อมูลได้อย่างสะดวก รวดเร็ว และเป็นระบบผ่านอุปกรณ์ต่างๆ เช่น คอมพิวเตอร์ แท็บเล็ต หรือสมาร์ทโฟน
2. กลุ่มเป้าหมาย (Target Audience):
นักเรียน คณะครูและบุคลากรทางการศึกษาของโรงเรียนแม่จันวิทยาคม
3. โทนและสไตล์ (Tone & Style):
เป็นทางการและน่าเชื่อถือ: ใช้ภาษาที่เหมาะสมและมีการจัดวางที่เป็นระเบียบสะอาดและทันสมัย (Clean & Modern): ออกแบบให้ดูเรียบง่าย สบายตา ไม่ซับซ้อน
ใช้งานง่าย (User-Friendly): ผู้ใช้สามารถเข้าใจและกรอกข้อมูลได้โดยไม่ต้องมีคู่มือ
4. โครงสร้างและเลย์เอาต์ (Structure & Layout):
Responsive Design: หน้าเว็บต้องปรับขนาดและการจัดวางให้เหมาะสมกับทุกขนาดหน้าจอ โดยเฉพาะบนมือถือ
Single-Column Layout: จัดวางเนื้อหาหลักในคอลัมน์เดียวเพื่อให้อ่านง่ายบนอุปกรณ์พกพา
การแบ่งส่วนที่ชัดเจน (Clear Sectioning): ใช้การ์ด (Card) หรือกล่อง (Box) ที่มีเงาและขอบมนเพื่อแยกแต่ละส่วนของฟอร์มออกจากกันอย่างชัดเจน
หัวข้อที่โดดเด่น: แต่ละส่วนต้องมีหัวข้อ (Legend/Heading) ที่ชัดเจนและอ่านง่าย
5. องค์ประกอบหลัก (Key Components):
อ้างอิงข้อมูลจากเอกสาร "แบบบันทึกการเยี่ยมบ้านนักเรียน" ให้ครบถ้วน โดยแบ่งเป็นส่วนต่างๆ ดังนี้:
ส่วนหัว (Header):
ใส่ Logo โรงเรียน http://bit.ly/logomwk ขนาด 150px
หัวข้อหลัก: "แบบบันทึกการเยี่ยมบ้านนักเรียน"
ชื่อโรงเรียน: "โรงเรียนแม่จันวิทยาคม"
ส่วนข้อมูลทั่วไป:
ช่องสำหรับกรอก "วันที่บันทึกข้อมูล" (Date Input)
ส่วนข้อมูลนักเรียน:
ช่องกรอกข้อความ (Text Input) สำหรับ: ชื่อ-สกุล, ชั้นมัธยมศึกษาปีที่, หมายเลขโทรศัพท์
ส่วนข้อมูลผู้ปกครอง:
ช่องกรอกข้อความสำหรับ: ชื่อ-สกุล, ความสัมพันธ์กับนักเรียน, หมายเลขโทรศัพท์
ส่วนข้อมูลที่พักอาศัยและการเดินทาง:
กลุ่มตัวเลือก (Radio Button) สำหรับ "บ้านที่พักอาศัย" บ้านของตัวเอง ,บ้านเช่า เดือนละ.....บาท ,อาศัยอยู่กับผู้อื่น/ญาติ, หอพัก, อื่นๆ
ช่องกรอกตัวเลข (Number Input) สำหรับ: ระยะทาง, เวลาเดินทาง (ชั่วโมง/นาที), ค่าใช้จ่ายในการเดินทาง
กลุ่มตัวเลือกสำหรับ "การเดินทางมาโรงเรียน" พร้อมตัวเลือกย่อยสำหรับ "รถจักรยานยนต์" (มี/ไม่มีใบขับขี่)
ส่วนข้อมูลครอบครัว:
ช่องกรอกตัวเลขสำหรับ "จำนวนสมาชิกในครัวเรือน"
กลุ่มตัวเลือกสำหรับ "สถานภาพครอบครัว" และ "นักเรียนอาศัยอยู่กับ"
กลุ่มตัวเลือกสำหรับ "ความสัมพันธ์ของสมาชิกในครอบครัว"
พื้นที่ข้อความ (Text Area) สำหรับ "ภาระงาน/ความรับผิดชอบของนักเรียน"
ส่วนพฤติกรรมความเสี่ยง (ใช้ Checkbox เพราะเลือกได้มากกว่า 1 ข้อ):
ด้านสุขภาพ
พฤติกรรมการใช้สารเสพติด
พฤติกรรมเสี่ยงทางเพศ
การติดเกม
ส่วนปัญหาด้านการเรียน (ใช้ Checkbox):
รวมตัวเลือกต่างๆ เช่น ไม่มี, ติด 0/ร, เรียนซ้ำชั้น, ขาดเรียนบ่อย, หนีเรียน
ส่วนความช่วยเหลือที่ต้องการจากโรงเรียน:
กลุ่มตัวเลือก (Checkbox) สำหรับ: ด้านการเรียน, ด้านพฤติกรรม, ด้านทุนการศึกษา
พื้นที่ข้อความสำหรับ "ความช่วยเหลืออื่นๆ"
ปุ่มส่งข้อมูล (Submit Button):
ปุ่มขนาดใหญ่เต็มความกว้าง แสดงข้อความ "บันทึกข้อมูล" อย่างชัดเจน
6. เทคโนโลยีและเครื่องมือ (Technology & Tools):
Frontend: HTML5, CSS3
Framework: Tailwind CSS เพื่อความรวดเร็วในการสร้างดีไซน์ที่สวยงามและ Responsive
Font: ใช้ฟอนต์ภาษาไทยที่อ่านง่ายและเป็นทางการ เช่น 'Sarabun' จาก Google Fonts
7. สีและกราฟิก (Color & Graphics):
สีหลัก: ใช้สีน้ำเงิน (#3b82f6) สำหรับองค์ประกอบที่ต้องการเน้น เช่น ปุ่ม, ลิงก์, หรือเส้นขอบของช่องที่กำลังใช้งาน (Focus State)
สีพื้นหลัง: ใช้สีเทาอ่อน (#f3f4f6) สำหรับพื้นหลังของหน้า และสีขาวสำหรับพื้นหลังของการ์ดฟอร์มเพื่อสร้างความแตกต่าง
สีตัวอักษร: ใช้สีเทาเข้ม (#1f2937) สำหรับเนื้อหาทั่วไปและหัวข้อ เพื่อให้อ่านง่าย
8. ประสบการณ์ผู้ใช้ (User Experience - UX):
Visual Feedback: เมื่อผู้ใช้คลิกที่ช่องกรอกข้อมูล ควรมีเส้นขอบสีหรือเงาปรากฏขึ้น
Placeholders: ในช่องกรอกข้อความควรมีข้อความแนะนำ (Placeholder) เพื่อบอกใบ้ว่าควรกรอกข้อมูลอะไร
Logical Flow: ลำดับของหัวข้อในฟอร์มต้องเรียงตามเอกสารต้นฉบับเพื่อให้ผู้ใช้กรอกข้อมูลได้อย่างลื่นไหล
9. Footer:
ข้อความ: “© 2025 แบบบันทึกการเยี่ยมบ้าน โรงเรียนแม่จันวิทยาคม” อีกบรรทัด
Dev by Pichayanart Reerak

สร้าง Web Application ระบบบันทึกข้อมูลประวัติการปฏิบัติงาน
1. สร้างแท็บ Dashboard สารสนเทศ
- ใช้ Library เช่น Chart.js, ApexCharts หรือ Google Charts
แสดงกราฟสรุปข้อมูลทั้งหมด เช่น
- การ์ดแสดงจำนวน (ปีการศึกษา 2568 , จำนวนผลงาน / รางวัลที่บันทึกไว้, จำนวนกิจกรรมอบรม/สัมมนา, รวมจำนวนชั่วโมงที่เข้าร่วม)
- กราฟแท่งหรือวงกลมเปรียบเทียบจำนวนผลงานและกิจกรรมในแต่ละเดือน
2.สร้างฟอร์มแท็บผลงาน / รางวัลที่ได้รับ**
- ตารางแสดงผลงาน / รางวัลที่ได้รับ (ใช้ DataTable)
- คอลัมน์: ลำดับ, เรื่อง, หน่วยงานที่มอบ, วันเดือนปีที่ได้รับ, ไฟล์เกียรติบัตร (PDF)
- ปุ่ม “เพิ่มข้อมูล” อยู่ด้านบน กดแล้วเปิด **Modal Form**
- ฟอร์มกรอกข้อมูล
- เรื่อง
- หน่วยงานที่มอบ
- วันเดือนปีที่ได้รับ (ใช้เป็น datepicker) เป็นปีพ.ศ.
- อัพโหลดไฟล์เกียรติบัตร แจ้งการรองรับไฟล์ .pdf ไม่เกิน 5MB
3. สร้างฟอร์มแท็บการประชุม อบรม สัมมนา หรือศึกษาดูงาน**
- ตารางการประชุม อบรม สัมมนา หรือศึกษาดูงาน (ใช้ DataTable)
- คอลัมน์: ลำดับ, เรื่อง, หน่วยงานที่มอบ, วันเดือนปีที่ได้รับ, ไฟล์เกียรติบัตร (PDF)
- ปุ่ม “เพิ่มข้อมูล” อยู่ด้านบน กดแล้วเปิด **Modal Form**
- ฟอร์มกรอกข้อมูล
- เรื่อง
- หน่วยงานที่จัด
- วันเดือนปี (ใช้เป็น datepicker) เป็นปีพ.ศ.
- จำนวนชั่วโมง
- อัพโหลดไฟล์เกียรติบัตร แจ้งการรองรับไฟล์ .pdf ไม่เกิน 5MB
ระบบควรคำนวณและแสดง “รวมจำนวนครั้ง / จำนวนวัน / จำนวนชั่วโมง” อัตโนมัติ
4.ใช้วิธีการจัดการการอัปโหลดไฟล์โดยแปลงไฟล์เป็น base64 ในเบราว์เซอร์ และเปลี่ยนชื่อไฟล์ตามด้วยวันเวลา
5.การส่งข้อมูลไฟล์เป็นสตริง base64 พร้อมกับชื่อไฟล์และประเภท MIME
6.ใน Apps Script ให้ถอดรหัสข้อมูล base64 และสร้างไฟล์จากข้อมูลนั้น
7.ใช้ URLSearchParams แทน FormData เพื่อให้เข้ากันได้กับ Apps Script มากขึ้น
8.เชื่อม App Script ที่ URL: xxxx
9.บันทึกข้อมูลลงในชีตที่ SHEET_ID: xxxx
10.ระบบอัปโหลดไฟล์ ให้บันทึกไฟล์ลงใน FOLDER_ID: xxxx
11.ให้นำ url ของไฟล์บันทึกลงในชีต
12.แสดงสถานะขณะรอการบันทึกและบันทึกสำเร็จ

: สร้างเว็บแอปเกม “Digital Citizen Quest”
คำอธิบายภาพรวมให้ Canva AI เข้าใจบริบท:
สร้างเว็บแอปแบบอินเทอร์แอคทีฟชื่อ “Digital Citizen Quest” สำหรับนักเรียนมัธยมศึกษาปีที่ 6 ในรายวิชาวิทยาการคำนวณ (ว33102) จุดประสงค์เพื่อเป็นกิจกรรมนำเข้าสู่บทเรียนเรื่อง “การเป็นพลเมืองดิจิทัล” เกมอยู่ในรูปแบบ Interactive Quiz จำนวน 10 ข้อ ใช้เวลาเล่นประมาณ 5-7 นาที
1.
หน้าเริ่มต้น (Start Screen)
หัวข้อใหญ่: “ยินดีต้อนรับสู่ Digital Citizen Quest”
คำอธิบายย่อย:
ภารกิจวัดความพร้อมสู่การเป็นพลเมืองดิจิทัลยุคใหม่! ก่อนจะเริ่มบทเรียน ลองมาทดสอบความรู้รอบตัวบนโลกออนไลน์ของคุณกันหน่อย
ฟอร์มกรอกข้อมูล:
ชื่อ - นามสกุล (Text Field)
ชั้น (Text Field)
เลขที่ (Text Field)
ปุ่ม CTA (Call-to-Action):
“เริ่มภารกิจ!”
2.
ส่วนของคำถาม (Question Section)
คำถามทั้งหมดมี 10 ข้อ โดยแต่ละข้ออยู่ในรูปแบบสถานการณ์ พร้อมตัวเลือก 4 ตัวเลือก (A, B, C, D) และมีการแสดงเฉลยพร้อมคำอธิบายทันทีหลังตอบ
โครงสร้างคำถามแต่ละข้อ:
หัวข้อ: [หัวข้อคำถาม เช่น “Digital Footprint”]
สถานการณ์:
[บรรยายสถานการณ์สั้น ๆ น่าสนใจ]
คำถาม:
คุณควรทำอย่างไร?
ตัวเลือก:
ก. [คำตอบที่ถูกต้อง ✅]
ข. [คำตอบที่ไม่ถูกต้อง]
ค. [คำตอบที่ไม่ถูกต้อง]
ง. [คำตอบที่ไม่ถูกต้อง]
เมื่อผู้เล่นเลือกคำตอบแล้ว:
ถ้าเลือก “ก.”:
✅ ถูกต้อง! [คำอธิบายเสริมให้เข้าใจเหตุผล]
ถ้าเลือก ข./ค./ง.:
❌ ยังไม่ใช่! [เฉลยและคำอธิบายเหตุผลที่คำตอบ “ก.” ถูกต้อง]
ให้สลับคำตอบด้วย
✅ ตัวอย่างคำถาม (ทั้ง 10 ข้อ):
1. Digital Footprint
คุณโพสต์ภาพไปเที่ยวทะเลกับเพื่อนในอินสตาแกรม โดยไม่ได้ตั้งค่าความเป็นส่วนตัว ภาพนั้นถูกแชร์ออกไปในวงกว้างโดยไม่ตั้งใจ
คำถาม: คุณควรทำอย่างไร?
ก. ลบภาพทันที และตั้งค่าความเป็นส่วนตัวให้กับบัญชีของคุณ ✅
ข. โพสต์ภาพใหม่อีกครั้ง แต่เลือกมุมที่สวยกว่า
ค. ขอให้เพื่อนช่วยรายงานภาพนั้น
ง. ไม่ต้องทำอะไร เพราะภาพสวยและไม่น่ามีปัญหา
เฉลย: ✅ ถูกต้อง! เพราะการตั้งค่าความเป็นส่วนตัวและการลบโพสต์ไม่เหมาะสมสามารถลดความเสี่ยงจากการถูกนำข้อมูลไปใช้ในทางที่ไม่เหมาะสมได้
(ใช้รูปแบบเดียวกันสำหรับอีก 9 ข้อในหัวข้อต่อไปนี้:)
2. Cyberbullying
3. Password Security
4. Phishing
5. Copyright
6. Fake News
7. Privacy Settings
8. Digital Law
9. Digital Wellbeing
10. Online Reputation
(คุณสามารถให้ Canva สร้างแต่ละหน้าคำถามแยกกัน โดยใช้คำถามสถานการณ์จริงจากด้านบน)
3. 🟡
หน้าสรุปผล (Summary Screen)
หัวข้อ: “สรุปผลภารกิจ”
แสดงข้อมูลผู้เล่น:
ชื่อ - นามสกุล: [ข้อมูลจากฟอร์มหน้าแรก]
ชั้น: [ข้อมูลจากฟอร์มหน้าแรก]
เลขที่: [ข้อมูลจากฟอร์มหน้าแรก]
แสดงคะแนน:
คะแนนรวมของคุณ: [คะแนนที่ได้] / 100 คะแนน
ข้อความสรุปตามระดับคะแนน:
ถ้า > 70:
🎉 ยอดเยี่ยม! คุณมีความเข้าใจในการเป็นพลเมืองดิจิทัลที่ดีมาก พร้อมต่อยอดในบทเรียนของเราแล้ว!
ถ้า 40–70:
👍 ทำได้ดี! คุณมีความรู้พื้นฐานอยู่แล้ว แต่ยังมีอีกหลายแง่มุมที่น่าสนใจ รอให้เราไปค้นพบกันในห้องเรียน
ถ้า < 40:
🌱 ไม่เป็นไรเลย! นี่คือโอกาสที่ดีที่เราจะได้มาเรียนรู้และสร้างทักษะการเป็นพลเมืองดิจิทัลไปด้วยกันในคาบเรียนนี้
ปุ่ม CTA:
🔚 “จบเกม”
🎨 สไตล์และดีไซน์:
โทนสี: ใช้สีสดใส แนวเทคโนโลยี/ไซเบอร์ (ฟ้า-เขียว-ม่วง)
ฟอนต์: อ่านง่าย ทันสมัย
ไอคอน/ภาพประกอบ: ใช้ภาพแนวการ์ตูนดิจิทัล/สถานการณ์ออนไลน์
ใช้แอนิเมชันเล็กน้อยในปุ่มและการเปลี่ยนคำถามเพื่อสร้างความสนุก
✨ คำสั่งเสริมใน Prompt:
สร้างเป็นเว็บไซต์แบบหน้าเดียว (One Page Interactive Quiz Web App) โดยมีปุ่มเปลี่ยนคำถามแต่ละข้อแบบเลื่อนอัตโนมัติ และแสดงผลตอบรับทันที ใช้งานง่ายทั้งบนมือถือและคอมพิวเตอร์ จับเวลาในการทำแต่ละข้อ ข้อละ 1 นาที และมีการจับเวลาการทำทั้งหมดในหน้าสรุปภารกิจทั้งหมด

1. สร้างฟอร์มลงทะเบียน ชื่อนักเรียน ชั้น รางวัล/เกียรติบัตรที่ได้รับ ระดับ วันที่ หน่วยงานที่มอบ
2. ใช้ Sweet Alert แสดงสถานะบันทึกข้อมูลสำเร็จ
3. รูปแบบต้องเรียบง่าย ทันสมัย เหมาะกับครูและนักเรียน โทนสีฟ้า-ขาว
ใช้สีสบายตา และไอคอนที่เกี่ยวข้องกับการศึกษา
4. Header: title ระบบบันทึกผลงานนักเรียน ไม่ต้องมี background
5. Footer: ข้อความ “© 2025 ระบบบันทึกผลงานนักเรียน | Pichayanart Reerak” อยู่ตรงกลาง ไม่ต้องมี background
6. ใช้ Google Font “Sarabun”
7. โดยส่งข้อมูลแบบ JSONP โดยตรงแทนการใช้ iframe ซึ่งอาจจะมีปัญหาเรื่อง cross-origin ไปยัง App Script ที่ URL: xxxx

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

Prompt ครั้งที่ 1
1. โครงสร้างหน้าจอ
– **Header**: โลโก้ (https://imprnoom.com/logonoom1.png) ขนาดเหมาะสม (ไม่เกิน 150px) มี title ระบบกรอกพิกัดการเยี่ยมบ้านนักเรียน อยู่ด้านล่าง ไม่ต้องมี background
– **Footer**: ข้อความ “© 2025 ระบบกรอกพิกัดการเยี่ยมบ้านนักเรียน | Pichayanart Reerak” อยู่ตรงกลาง ไม่ต้องมี blackground
2. ฟอนต์และธีม
– ใช้ Google Font “Noto Sans Thai”
– ธีมสีสดใส สไตล์ Educational Tech (ผสมสีฟ้า-ขาว)
– ดีไซน์เรียบง่าย ทันสมัย สวยงาม รองรับ Responsive (มือถือ/แท็บเล็ต/เดสก์ท็อป)
3. แท็บจัดการข้อมูล
– **แท็บที่ 1:เพิ่มข้อมูล**
ฟอร์มกรอกข้อมูล:
- เลขประจำตัวนักเรียน (input text)
- คำนำหน้า (select เช่น เด็กชาย / เด็กหญิง / นาย / นางสาว)
- ชื่อ-นามสกุล (input text)
- ระดับชั้น (select ม.1 - ม.6)
- ห้อง (select 1-11)
- เบอร์โทรศัพท์ (input text พร้อมตรวจสอบรูปแบบเบอร์)
- ชื่อหมู่บ้าน (input text)
- ตำบล (input text)
- อำเภอ (input text)
- จังหวัด (input text)
- พิกัดละติจูด (input number หรือ map picker)
- พิกัดลองจิจูด (input number หรือ map picker)
- อัปโหลดรูปบ้าน 2 รูป (file upload พร้อม preview) และเก็บไว้ใน Google drive
แจ้งการรองรับไฟล์ .jpg .jpeg .png ไม่เกิน 5MB
– **แท็บที่ 2:แสดงข้อมูล**
ตารางแสดงข้อมูล (ใช้ DataTable) หัวข้อ ข้อมูลพิกัดการเยี่ยมบ้านนักเรียน
- คอลัมน์: เลขประจำตัว คำนำหน้า ชื่อ-นามสกุล ระดับชั้น ห้อง เบอร์โทรศัพท์ พิกัดละติจูด ลองจิจูด
และแสดงข้อมูลที่บันทึกทั้งหมดให้สามารถคลิกเข้าไปดูข้อมูลเพิ่มเติมของแต่ละบุคคลได้ โดยไม่ต้องแสดงรูปภาพบ้าน แต่ให้แสดงลิงค์รูปภาพจาก Google drive
เมื่อกดอัปโหลด
- แปลงรูปภาพเป็น base64
- ส่งข้อมูลไปยัง Web App URL ด้วย POST
- มีแจ้งเตือน SweetAlert2 อย่างสวยงามในการบันทึกข้อมูลและอัพโหลดรูปภาพเสร็จสิ้น
- มีปุ่ม refresh ข้อมูลในหน้าแสดงข้อมูล
– **แท็บที่ 3 : Dashboard สารสนเทศ**
- ใช้ Chart.js แสดงกราฟสรุปข้อมูลทั้งหมด
แผนภูมิแท่งแสดงจำนวนนักเรียนแต่ละระดับชั้น
แผนภูมิวงกลมแสดงตำบล
4. เทคโนโลยีที่ใช้ (ระบุให้ AI รู้จัก)
– HTML5, CSS3, JavaScript
– Tailwind CSS CDN
– jQuery, jQuery Validate
– DataTables CDN
– SweetAlert2 CDN
– Chart.js CDN
5. ฟีเจอร์เพิ่มเติม
– เก็บข้อมูลใน LocalStorage (สำหรับ Demo)
– รองรับภาษาไทยเต็มรูปแบบ
– UI/UX: ปุ่ม, ฟอร์ม, ตาราง, กราฟ ดีไซน์สวยงาม ใช้งานง่าย
- ไม่ต้องมีการแก้ไขหรือลบให้สามารถกรอกข้อมูลได้เท่านั้น
โปรดสร้างโค้ดหน้าตาเว็บทั้งหมดให้สวยงาม พร้อมไฟล์ HTML/CSS/JS และตัวอย่าง Mock Data JSON ที่ใช้งานจริง
Prompt ครั้งที่ 2
ฉันอยากเก็บข้อมูลจริง โดยใช้ google sheet เป็นที่เก็บข้อมูล และใช้ google apps script เป็น api และเรียกใช้ api ผ่าน url=”XXXXXXXX” เพื่อใช้งานระบบกรอกข้อมูลพิกัดการเยี่ยมบ้านให้หน่อย และการเรียกใช้ API ขอให้เป็น รูปแบบ json data และการส่งผ่านขอเป็น contentType=text/plain แปลงรูปภาพเป็น base64 ส่งข้อมูลไปยัง Web App URL ด้วย POST
สร้างระบบหรือเวิร์กโฟลว์ที่เมื่อฉันอัปโหลดภาพ
ระบบจะ:
1. อัปโหลดรูปภาพเข้าโฟลเดอร์ที่ฉันกำหนดไว้ใน Google Drive
2. สร้างลิงก์แบบ “แชร์ได้” ของรูปภาพ (Anyone with the link can view)
3. เพิ่มข้อมูลลงใน Google Sheet โดยระบุชื่อไฟล์ และลิงก์ภาพที่คลิกได้