แนวทางการออกแบบและพัฒนาเว็บไซต์สำหรับองค์กร ตอนที่ 3 เทคนิคการตกแต่งเว็บไซต์ที่สร้างด้วย Google Sites-Ep4

ตอนนี้จะนำเสนอเทคนิคตกแต่งเว็บไซต์ที่สร้างด้วย Google Sites ว่าด้วยเรื่อง การแทรกสไลด์ การแทรกวิดีโอจากยูทูป และการแทรกปฏิทิน

การแทรกสไลด์

วิธีที่ 1 การแทรกสไลด์ด้วยโค้ด HTML
1. เตรียมรูป PNG ขนาด 950×550 pixels จำนวน 8 รูป (หรือตามจำนวนที่ต้องการ มากที่สุด 200 สไลด์)
2. เปิด Google Slides แทรกรูป ปรับแต่งการเลื่อนสไลด์ตามที่ต้องการ ตั้งชื่อว่า slide_rose

3. ไปที่หน้าเว็บ Google Sites เปิดเรื่อง กุหลาบแสนสวย เลือกตอนท้ายของเนื้อเรื่องที่จะแสดงสไลด์ เมนูขวาบน แทรก -> ไดรฟ์ -> เลือกสไลด์ -> แทรก

4. ปรับจุดวางกรอบกลางหน้า กด เผยแพร่ 2 ครั้ง

วิธีที่ 2 การแทรกสไลด์จากเมนู Google Sites
1. เตรียมรูป และสร้าง Google Slides เช่นเดียวกับวิธีที่ 1
2. เปิด Google Sites เลือกเคอร์เซอร์ในจุดวางกรอบสไลด์
3. ที่เมนูด้านขวา เลือก แทรก -> สไลด์

4. เลิอกสไลด์

5. ตั้งค่าการแสดงสไลด์ เลือก รูปฟันเฟือง -> โหมดมุมมองแบบเดือน -> เสร็จสิ้น เผยแพร่ 2 ครั้ง

6. กด เสร็จสิ้น -> เผยแพร่ 2 ครั้ง

การแทรกคลิปวิดีโอจากยูทูป

วิธีที่ 1 การแทรกคลิปวิดีโอยูทูปด้วยโค้ด HTML
1. เปิดยูทูป เลือกวิดีโอ -> คัดลอก ID ของวิดีโอจากยูอาร์แอลบาร์ (ด้านบน)

2. ค้นหา w3school -> เลือก HTML Tutorial -> HTML Media -> HTML Youtube -> คัดลอกโค้ด

3. เปิด Google Sites เปิด เมนูวงล้อ กด < > ฝังโค้ด และวางโค้ด

4. แทรก ID ของวิดีโอจากยูทูปแทนที่

5. ปรับแต่งโค้ดการเล่นและควบคุมวิดีโอ

6. กดถัดไป -> แทรก และเผยแพร่ 2 ครั้ง

(Credits : Epic Gardening)

วิธีที่ 2 การแทรกคลิปยูทูปจากเมนู Google Sites
1. เปิด Google Sites เลือกเคอร์เซอร์ในจุดวางกรอบคลิปยูทูป
2. ที่เมนูด้านขวา เลือก แทรก -> YouTube

3. ค้นหา -> เลือกคลิปยูทูป

4. ตั้งค่าการแสดงสไลด์ เลือก รูปฟันเฟือง -> โหมดมุมมองแบบเดือน -> เสร็จสิ้น เผยแพร่ 2 ครั้ง

การแทรกปฏิทิน
วิธีที่ 1 การแทรกปฏิทินด้วยโค้ด HTML
1. เปิด Google Calendar

2. คัดลอกโค้ดปฏิทิน

3. เปิด Google Sites เปิดเมนูวงล้อ เลือก < > ฝังโค้ด วงโค้ดจากข้อ 2

4. กดถัดไป -> แทรก และเผยแพร่ 2 ครั้ง

วิธีที่ 2 การแทรกปฏิทินจากเมนู Google Sites
1. เปิด Google Sites ที่เมนูด้านขวา เลือก แทรก -> ปฏิทิน

2. เลือกปฏิทิน

3. ตั้งค่าการแสดงปฏิทิน เลือก รูปฟันเฟือง -> โหมดมุมมองแบบเดือน -> เสร็จสิ้น เผยแพร่ 2 ครั้ง

สรุป

การแทรกสไลด์ วิดีโอจากยูทูป และปฏิทินในหน้าเว็บ Google Sites สามารถทำได้ 2 วิธี คือ แทรกโค้ด HTML และใช้เมนูของ Google Sites ซึ่งทั้ง 2 วิธีมีการแสดงผลลัพธ์คล้ายกัน แต่มีข้อดี/ข้อจำกัดแตกต่างกัน ดังนี้ การแทรกโค้ด HTML ข้อดี – ปรับแต่งการแสดงผลได้หลากหลายด้วยการแก้ไขโค้ด HTML ได้โดยตรง ข้อเสีย – ต้องมีความรู้การเขียนโค้ด HTML บ้าง หรือใช้ตัวช่วยจาก www.w3schools.com ส่วนใช้เมนูของ Google Sites ข้อดี – ทำง่ายแค่เลือกเมนู ข้อเสีย – ปรับแต่งการแสดงผลได้เพียงเล็กน้อย ไม่สามารถแก้ไขโค้ด HTML ได้โดยตรง

โปรดติดตามตอนต่อไป ว่าด้วยเรื่อง การจัดเนื้อเรื่องเป็นรูปแบบต่างๆ ซึ่งจะช่วยให้บทความน่าอ่านและน่าสนใจมากยิ่งขึ้น

อ้างอิง
• HTML YouTube Videos, https://www.w3schools.com/html/html_youtube.asp
• Growing Roses, A Complete Beginner’s Guide by Epic Gardening, https://www.youtube.com/watch?v=WACx0f1fiiY
• Add a Google calendar to your website, https://support.google.com/calendar/answer/41207?hl=en

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top