คู่มือ Google Site (ปรับปรุงครั้งที่ 1)

การสรา้ งเวบ็ ไซต์ดว้ ย Google Sites 1

การสรา้ งเวบ็ ไซตด์ ้วย Google Sites ก

คานา

คู่มอื การสร้างเว็บไซต์ดว้ ย Google Site เลม่ นี้ จดั ทาขน้ึ โดยมีวัตถปุ ระสงคเ์ พือ่ ใช้เป็นเคร่ืองมือช่วย
เสริมสร้างความรู้และให้คาแนะนาเกี่ยวกับวิธีการสร้างเว็บไซต์เพื่อการเรียนการสอน วิธีการสร้างไซต์
การเพ่ิมโลโก้ไซต์ การเปลยี่ นหัวไซต์ การเปลีย่ นธีม การสรา้ งหน้าหลักของไซต์การเปลี่ยนธีม การสร้างหน้า
หลักของไซต์ การเพ่ิมหน้ายอ่ ย การแทรกเนอื้ หา การแทรกจานวนผเู้ ข้าชมเว็บไซต์ การเผยแพรไ่ ซต์ การย่อ
ไซต์ การแชรล์ ิงก์ การจัดกระบวนการเรียนการสอน ด้วยการสร้างเว็บไซต์ในการรวบรวมข้อมูลต่าง ๆ ซ่ึง
ผสู้ รา้ งจาเปน็ ต้องจดั หมวดหมเู่ รือ่ งราวให้เปน็ ข้ันเป็นตอน และสอดคลอ้ งกัน เพือ่ ความสะดวกในการศกึ ษาของ
ผู้เรียน หรอื ผเู้ ขา้ ชม ซึ่งเว็บไซต์สามารถใช้ร่วมในการจัดการเรียนการสอนกับ Google Classroom ได้เป็น
อยา่ งดี รวมถงึ การใช้งานรว่ มกับแอพพลเิ คชนั่ อืน่ ๆ พรอ้ มได้บรรจุเน้ือหายอ่ ยๆ ไว้อย่างละเอียดทีละขั้นตอน
สามารถศึกษาด้วยตนเองได้ โดยในการจัดทาครัง้ น้ีได้เพ่ิมเนื้อหา เรื่อง การฝังจานวนนับผู้เข้าชมเว็บไซต์ ซ่ึง
Google Site ไดอ้ ปั เดตโปรแกรมขน้ึ มาจากเดิม

ผู้จัดทาหวังเป็นอย่างย่ิงว่าคู่มือการสร้างเว็บไซต์ด้วย Google Site เล่มน้ีจะช่วยให้ผู้เข้ารับการ
อบรมเข้าใจเนื้อหาเพมิ่ ยิง่ ขึน้ และสามารถนาความรทู้ ไ่ี ด้รับสร้างเว็บไซต์ได้อย่างสมบูรณ์ ต้ังแต่กระบวนการ
แรก จนถงึ นาไซตเ์ ผยแพร่ต่อสาธารณะได้

กรกฎาคม 2563

การสรา้ งเวบ็ ไซตด์ ้วย Google Sites ข

สารบัญ

เรอ่ื ง หน้า
คำนำ.................................................................................................................................................. ก
สำรบัญ...............................................................................................................................................ข
ร้จู ัก GOOGLE SITES ......................................................................................................................... 1
กำรสรำ้ งเวบ็ ไซต์ (GOOGLE SITES) เพือ่ กำรเรยี นกำรสอน .................................................................. 2

วธิ กี ารสร้างไซต์.......................................................................................................................................2
การเพม่ิ โลโกไ้ ซต์.....................................................................................................................................7
การเปล่ียนแบนเนอรป์ ระกาศ ...............................................................................................................12
การเปลยี่ นหัวไซต์ .................................................................................................................................15
การเปลยี่ นธีม........................................................................................................................................18
การสรา้ งหน้าหลักของไซต์ ....................................................................................................................20
การเพมิ่ หนา้ ยอ่ ย...................................................................................................................................22
การแทรกเน้ือหา ...................................................................................................................................24
การแทรกจานวนผูเ้ ขา้ ชมเว็บไซต์..........................................................................................................30
การเผยแพร่ไซต์ .................................................................................................................................... 35
การย่อไซต์ ............................................................................................................................................38
การแชรล์ งิ ก์..........................................................................................................................................40
ตัวอย่างเว็บไซต์ทสี่ าเรจ็ แล้ว..................................................................................................................42
บรรณำนุกรม ....................................................................................................................................43

รูจ้ ัก Google Sites

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

ข้อดขี อง Google sites
1. Google Sites สามารถทางานร่วมกับแอพพลิเคช่ันอื่นๆ ได้เป็นอย่างดี เช่น Google Docs,
Google Sheets, Google Slide, Google Map, VDO อ่นื ๆ เพอื่ ช่วยในทางานให้เป็นไปอย่างมีระบบ
2. มเี ทมเพลตใหเ้ ลือกหลากหลาย
3. สามารถเข้าถึงได้ทกุ ทท่ี ่ีมอี ินเทอรเ์ น็ต
4. ทางานได้หลายระบบปฏิบัติการ เช่น Window, Mac, Linux โดยการทางานผ่านเบราว์เชอร์
ตา่ ง ๆ
5. สามารถเขา้ ชมผา่ นโทรศัพท์ Smart Phone ได้
6. ระบบมคี วามรกั ษาความปลอดภัยท่ดี ี โดยผู้ดแู ลระบบสามารถจัดการสทิ ธิในการแบง่ ปันไชตได้
7. พน้ื ทจ่ี ัดเกบ็ ข้อมูลไมจ่ ากดั ใช้บรกิ ารไดฟ้ รี ไมเ่ สยี ค่าใชจ้ า่ ย

การสรา้ งเวบ็ ไซต์ (Google Sites) เพ่อื การเรยี นการสอน

การสร้างเวบ็ ไชตเ์ พอ่ื การเรยี นการสอนเป็นการนาองค์ความรู้ต่าง ๆ รวบรวมเพ่ือง่ายต่อนักศึกษา
ในการศกึ ษาค้นคว้าหาข้อมูลทีเ่ ก่ยี วข้องกับวชิ าทีส่ อนโดยอาจารย์ สามารถเพิ่มวดิ ีโอก่อนเขา้ เรยี น แบง่ ปนั ไฟล์
ให้นักศึกษา สร้างแบบทดสอบก่อนและเรียน ให้นักศึกษาส่งงานผ่านทาง Google Sites และอ่ืน ๆ อีก
มากมาย เนอื่ งจาก Google Sites มี 2 รูปแบบ คือ รูปแบบเก่า (Sites แบบคลาสสิก) และรูปแบบใหม่ ใน
ทีน่ จ้ี ะกล่าวถงึ เฉพาะรูปแบบใหมเ่ ท่านั้น

วิธกี ารสร้างไซต์

1. ล็อกอนิ ด้วย Google Account
2. เลือกสญั ลกั ษณ์ ท่มี ุมบนขวา

3. เลือกไซต์ ตามหมายเลข

4. เลือก Google Sites ใหม่

5. เลือกสญั ลักษณ์ บรเิ วณดา้ นลา่ งขวา เพื่อสรา้ งเวบ็ ไซต์ใหม่

6. ต้งั ชอื่ ไซต์ บรเิ วณดา้ นบนซ้าย
7. เลือกภาพสว่ นหัวของไซต์
เพือ่ เลอื กภาพสาหรบั ใช้เป็นภาพส่วนหวั ของไซต์ โดยสามารถเลอื กได้ 2 แบบ ดังขอ้ 2 และ ขอ้ 3

อพั โหลดภาพจากเครือ่ งคอมพิวเตอร์ / ไดร์ฟตา่ งๆ
เลือกรปู ภาพจากปมุ่ เลอื กรปู ภาพ เม่อื กดจะพบหนา้ ต่างเลอื กรปู ภาพข้นึ มา ดงั ต่อไปน้ี

ภาพจากคลงั แกลลอรี
ภำพจำกลงิ ก์ URL
ภำพจำกกำรค้นหำภำยในเว็บไซต์
ภำพจำกอัลบ้มั ของคุณ
Google Drive

สามารถเลอื กภาพไดโ้ ดยการอปั โหลดภาพจากเครอื่ งคอมพวิ เตอร์ หรือ เลอื กภาพจากแหลง่ อื่น เชน่
แกลเลอรี URL เวบ็ ไซต์ อลั บม้ั Google Drive

8. ตัวอย่างไซตท์ ส่ี ร้าง

ประโยชน์ของการสรา้ งไชตเ์ พอ่ื การเรียนการสอน
1. นักศึกษาสามารถเขา้ ถึงไซต์ ไดง้ ่าย ดว้ ยการลงิ ก์
2. นักศึกษาสามารถหาศึกษาหาข้อมลู ไดง้ ่าย จากเว็บไชต์เดยี วเพราะอาจารย์ได้รวบรวมขอ้ มลู ไว้ให้
3. อาจารยส์ ามารถสรา้ งไซต์ และแกไ้ ขข้อมลู หรอื อพั เดต ได้งา่ ย สะดวก และรวดเรว็

การเพ่ิมโลโก้ไซต์

1. การเพม่ิ ในสว่ นบรเิ วณปา้ ยช่ือเว็บไซต์ใช้เมาส์ลากผา่ นบรเิ วณชอื่ ไซต์ > เพิ่มโลโก้

คลิก “เพม่ิ โลโก้”

เลือกภาพโดยการ “อปั โหลด” ภาพจากเครอื่ งคอมพวิ เตอร์

หรอื “เลอื ก” จากแหลง่ อ่นื

2.การเพม่ิ จาก การตั้งค่า บรเิ วณดา้ นขวาบน ดังภาพด้านลา่ ง
2.1 เมื่อคลิก ดงั ภาพด้านบน จะเกดิ หนา้ ต่างดังภาพด้านลา่ ง

คลิกเลอื กขอ้ ความ “รปู ภาพแบรนด์” หรอื โลโก้
บรเิ วณสาหรบั การเพ่มิ โลโก้ โดยสามารถเพมิ่ ภาพจากการอัปโหลด หรอื เลือกจากท่อี ่นื ๆ

เพิ่มเตมิ

คลกิ เลอื กขอ้ ความ “อัปโหลด”เปน็ การอัปโหลดรปู ภาพจากเครื่องคอมพวิ เตอร์ ในไดรฟ์
ตา่ งๆขึ้นมาใสใ่ นโลโก้ ดงั ภาพ

คลกิ เลือกข้อความ “เลือก” เปน็ การเลอื กรปู ภาพจากแหลง่ อนื่ ๆ บนอินเทอรเ์ นต็ ดังภาพ
เปน็ การเลือกรูปภาพจากอินเทอร์เน็ต โดยการคัดลอกลิงกม์ าใส่
เปน็ การเลอื กรปู ภาพจาก Google ท่ที าการค้นหารูปภาพตา่ งๆ บนอนิ เทอรเ์ นต็

เปน็ การเลอื กรปู ภาพจาก Google photo ของบัญชี แล้วคลิก ดังภาพ
เป็นการเลือกรูปภาพจาก Google Drive ของบญั ชี
4. สามารถปรบั แตง่ สพี ื้นหลังของโลโก้ได้ด้วยการเลอื กสพี ืน้ หลงั โดยให้ไปท่ี

เปน็ การแกไ้ ขสีพ้นื หลงั ของโลโก้ ด้วยข้อความ “การนาทาง”เป็นการปรบั เปลยี่ นสีของโลโก้
เป็นการเลือกสพี ืน้ หลงั ของโลโก้ มีใหเ้ ลือก 3 แบบ คอื โปรง่ ใส, สขี าว, สีดา ดังภาพ

5. ภาพโลโกท้ เ่ี ลือกจะแสดงดา้ นบนซา้ ย ค่กู ับชื่อของไซต์

การเปลย่ี นแบนเนอรป์ ระกาศ

การเปล่ียนแบนเนอรป์ ระกาศ สามารถดาเนินการได้ 2 วิธี
1. ลากเมาสไ์ ปบรเิ วณ เคร่ืองหมาย รายละเอียดดงั ภาพดา้ นลา่ ง

2. ลากเมาส์ไปบรเิ วณสว่ นแก้ไขโลโก้ คลิกทเ่ี ครื่องหมาย รายละเอยี ดดงั ภาพดา้ นลา่ ง

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

เลือกแบนเนอรป์ ระกาศ
บริเวณที่กาหนดค่าในส่วนของแนบเนอรป์ ระกาศ

ในส่วนแบนเนอรป์ ระกาศมรี ายละเอียดการต้งั ค่าดงั นี้

บริเวณแสดงแบนเนอรห์ รอื ไม่แสดงแบนเนอร์
บริเวณเพ่อื เลอื กสขี องแบนเนอรท์ จ่ี ะให้แสดงผล.
ใส่ข้อความทจี่ ะแสดงผลในสว่ นแบนเนอร์ไมเ่ กิน 150 อกั ขระ

สาหรับสร้างปุม่ แสดงในส่วนแบนเนอร์
สาหรบั ใสล่ งิ ก์ใหก้ บั ปมุ่

ติก๊ เลอื ก “เปดิ ในแท็บใหม่” เพ่อื ให้แสดงแบนเนอร์ในแทบ็

ใหมข่ อง browser หากไมต่ อ้ งการใหแ้ สดงในแทบ็ ใหมข่ อง browser ไมต่ อ้ งต๊ิกเลอื ก และในสว่ นของระดบั

การมองเหน็ มีให้เลือก 2 แบบคือ “หน้าแรกเท่าน้ัน” และ “ทกุ หน้า” หมายความว่า ตอ้ งการให้แบนเนอร์

ประกาศแสดงในหน้าไหนบา้ ง เช่น หน้าแรกเทา่ นนั้ หรอื แสดงแบนเนอรใ์ นทุกหนา้

ตัวอยา่ ง

กาหนดให้แบนเนอร์ประกาศแสดงผลในทกุ หน้าของเว็บไซต์ ดงั นี้

การเปลยี่ นหวั ไซต์

หวั ไซต์เป็นอกี จดุ หน่งึ ที่ดงึ ดดู ความสนใจของผเู้ ขา้ ชม นอกจากจะสวยงามแลว้ จะตอ้ งเหมาะสมและ
สะดดุ ตา มวี ธิ กี ารเปลยี่ น ดังนี้

1. ใชเ้ ม้าสล์ ากผา่ นบรเิ วณสว่ นหวั ข้อความ “ประเภทสว่ นหวั ” จะปรากฏ

2. คลกิ “ประเภทสว่ นหัว” เลอื ก “แบนเนอร์”

3. จะไดส้ ว่ นหวั ซงึ่ มีภาพพน้ื หลงั ปรากฏ

4. สามารถเปล่ยี นรปู ภาพใหม่ได้ โดยการลากเมาสผ์ ่าน บริเวณสว่ นหวั เลอื ก “เปลย่ี นรปู ภาพ”
5. เลอื ก “อปั โหลด” กรณเี ลอื กภาพในคอมพวิ เตอร์ หรือ “เลอื กรปู ภาพ” กรณีภาพอยู่ในแหล่งอ่นื
6. เลอื กภาพที่ตอ้ งการ

7. คลิก “เลือก”
8. จะได้ภาพสว่ นหวั ตามต้องการ

การเปลีย่ นธีม

ธมี คือ ชุดรปู แบบของสพี ืน้ หลัง และแบบตัวอักษร ท่รี ะบบจดั เตรยี มไวใ้ ห้ สามารถปรบั เปลี่ยนได้
ดงั น้ี

1. เลือกแถบ “ธมี ”

2. เลือกธีมทีต่ ้องการ

3. เลือกสีที่ตอ้ งการ
4. เลอื กแบบตัวอักษร

การสรา้ งหนา้ หลักของไซต์

การสร้างหนา้ ของไซตเ์ ปรยี บเสมอื นสรา้ งสารบญั ของเอกสารนน่ั เอง ซึ่งผสู้ รา้ งไซตต์ อ้ งออกแบบว่าจะ
แบ่งออกเป็นหมวดหมู่ใดบ้าง เชน่ แบบทดสอบ แบบฝกึ หัด บทเรียน ซ่ึงในแตล่ ะหนา้ จะสามารถแบ่งเป็นหน้า
ยอ่ ย ๆ ไดอ้ ีก เช่น ในแบบทดสอบ จะถูกแบ่งออกเป็น แบบทดสอบก่อนเรียน แบบทดสอบหลังเรียน ฯลฯ
มวี ธิ ีสรา้ ง ดงั นี้

1. เลอื กแถบ “หน้าเวบ็ ”

2. คลกิ เลอื กสญั ลักษณ์ เพอ่ื เพม่ิ หน้า

3. สรา้ งหนา้ ใหมต่ ามทีอ่ อกแบบไว้
หนา้ เว็บใหม่
สร้างหน้าเว็บใหมด่ ว้ ยการใสล่ งิ ก์

4. เลอื ก “เสรจ็ ส้นิ ”

5. จะปรากฏหนา้ “แบบทดสอบ” ทีส่ ร้างข้นึ สาหรบั ใชส้ าหรับแบบทดสอบ

การเพ่มิ หนา้ ย่อย

การสร้างหน้าย่อย หมายถึง การนาหน้าย่อย ๆ วางภายใต้หน้าหลัก สามารถวางได้หลาย ๆ หน้า
ยอ่ ยภายใต้หน้าหลกั 1 หนา้ มวี ธิ กี ารสร้าง ดงั นี้

1. เลอื กหนา้ หลักทตี่ อ้ งการเพิ่มหนา้ ย่อย เลอื กสญั ลกั ษณ์

2. เลือก “สรา้ งหน้ายอ่ ย”

3. พิมพ์ชอื่ หนา้ ย่อยทตี่ อ้ งการ
4. คลกิ “เสรจ็ ส้นิ ”
5. หน้าย่อย “แบบทดสอบก่อนเรยี น” จะถกู สร้างขึ้นภายใตห้ น้าหลกั “แบบทดสอบ”

6. ปรบั แตง่ หัวข้อใหส้ วยงาม โดยคลกิ เลือกท่หี วั ข้อในหน้าใหม่

7. คลิกเปลย่ี นรปู แบบข้อความ

8. จะไดร้ ปู แบบตามตอ้ งการ
กรณเี พมิ่ หนา้ ยอ่ ยหลาย ๆ หนา้ สามารถทาการสาเนาได้

การแทรกเน้ือหา

การแทรกเน้ือหา คอื การนาเนือ้ หา รายละเอียดต่าง ๆ วางในหนา้ ไซตท์ ีส่ ร้างไว้ เพ่ือให้สอดคล้องกบั
หวั ข้อท่สี ร้างไว้ มีวธิ กี ารแทรก ดังนี้

1. คลิกเลือกหน้าท่ตี อ้ งการแทรกเนือ้ หา เลอื กแถบ “แทรก”

2. เลือกไฟล์ข้อมลู ท่ตี อ้ งการนามาแทรก ซ่ึงสามารถนามาจากหลายแหลง่ ข้อมูล ดังน้ี
หมายเลข 1 การแทรกกล่องข้อความ
หมายเลข 2 การแทรกรปู ภาพ
หมายเลข 3 การฝงั URL จากเว็บไซตอ์ ื่น
หมายเลข 4 แทรกข้อมลู จาก Google Drive

หมายเลข 5 แทรกการออกแบบมุมมองต่างๆ

หมายเลข 6 แทรกขอ้ ความแบบยุบได้
หมายเลข 7 แทรก สารบญั
หมายเลข 8 แทรกภาพหมนุ
หมายเลข 9 แทรกปมุ่
หมายเลข10 แทรกตัวแบง่
หมายเลข11 ตัวยดึ ตาแหนง่
หมายเลข 12 แทรก (YouTube)
หมายเลข 13 แทรกปฏิทิน (Google Calendar)
หมายเลข 14 แทรกแผนที่ (Google Maps)
หมายเลข 15แทรกเอกสาร (Google Doc)
หมายเลข 16แทรกสไลด์ (Google Slide)
หมายเลข 17แทรกชีต (Google Sheet)
หมายเลข 18แทรกฟอร์ม (Google Form)
หมายเลข 19แทรกแผนภมู ิ

ในท่นี จ้ี ะทดสอบแทรกไฟลแ์ บบทดสอบกอ่ นเรียนทส่ี ร้างจาก Google Form โดยการเลือก ฟอรม์
แบบทดสอบท่สี รา้ งไวม้ าวางยังหน้า แบบทดสอบก่อนเรยี น เลอื ก “ฟอรม์ ”

3. คลกิ ฟอรม์ ที่ตอ้ งการแทรก

4. คลิก “แทรก” ดา้ นลา่ งขวา
5. แบบทดสอบก่อนเรียนจะถกู นาไปแทรกยังหน้าแบบทดสอบก่อนเรยี น
6. สามารถปรบั แต่งใหส้ วยงามโดยการลากวางบรเิ วณกง่ึ กลางของหนา้

7. เปล่ยี นสีของสว่ นด้วยการคลกิ ทสี่ ัญลกั ษณ์ ดา้ นซ้ายของหนา้
8. เลือก “อปั โหลด” กรณีเลือกภาพในคอมพิวเตอร์ หรือ “เลอื กรูปภาพ” กรณีภาพอย่ใู นแหลง่ อ่นื
9. จะได้พื้นหลังส่วนท่ีสวยงาม

10.ทดสอบดใู นมมุ มองของผเู้ ข้าชมเว็บไซต์ดว้ ยการคลกิ ทส่ี ญั ลักษณ์

หมายเหตุ : บรเิ วณทเี่ น้อื หาถูกนามาวางเรยี กวา่ “ส่วน”
กรณีตอ้ งการทาสาเนาส่วน ใหค้ ลิกสญั ลักษณ์
กรณีตอ้ งการลบสว่ น ใหค้ ลิกสญั ลกั ษณ์

การแทรกจานวนผู้เขา้ ชมเว็บไซต์

การสร้างเคานเ์ ตอร์
จานวนผู้เข้าชมเวบ็ ไซต์เป็นตัวบ่งช้ีหนึ่งท่ีทาให้ผู้สร้างเว็บไซต์ทราบว่ามีจานวนผู้เข้าชมมากน้อย
เพียงใด สามารถทาได้ ดังนี้
1. เข้าสเู่ ว็บไซต์ http://www.freecounterstat.com/

2. มีรูปแบบเคาน์เตอรใ์ ห้เลอื กใช้มากมาย หากชอบแบบไหนกส็ ามารถท่ีจะคลิกเลอื กเพื่อนามาใช้
งานไดเ้ ลย

3. เลือกรูปแบบเคาน์เตอรร์ ูปแบบใดรปู แบบหนงึ่ ที่ต้องการ โดยการคลกิ เลือกไดเ้ ลย

4. เมือ่ คลกิ เลอื กแล้วเว็บไซต์จะพาไปยัง "Step 2" ซ่ึงจะเป็นการต้ังค่าต่าง ๆ ให้กับเคาน์เตอร์
โดยให้ต้งั ค่าดังนี้

1. Location เลือกเป็น Asia/Bangkok (GMT+7) ซึ่งช่องแรกน้ีปกติระบบจะเลอื กใหแ้ ลว้
2. Category of your site ชอ่ งนี้ใหเ้ ลอื กประเภทวา่ เว็บไซตท์ ่จี ะนาเคานเ์ ตอรน์ ับจานวน
ไปใสเ่ ป็นเวบ็ ไซตป์ ระเภทใด หากไม่ทราบวา่ จะเลือกอะไรใหเ้ ราเลือกเป็น "Internet"

3. Sub-category อันน้เี ปน็ หัวข้อยอ่ ยจากประเภทเว็บไซตท์ ีเ่ ลือกไปจากข้อ 2 ให้เลือกข้อ
ใดข้อหนึง่ หากไมท่ ราบว่าจะเลือกอะไรให้เลือกเป็น "Website creation" (ก่อนเราจะเลือกเป็น Website
creation ไดน้ ้นั ดา้ นบนในสว่ นของ "Sub-category" ตอ้ งเลือกเป็น "Internet" ก่อน)

4. Numbers digit ส่วนนเ้ี ป็นการตง้ั คา่ จานวนหลักให้กับเคาน์เตอร์วา่ จะนบั จานวนกหี่ ลัก
5. Init your counter ส่วนนเี้ ปน็ การตั้งค่าใหเ้ ร่ิมนับตัง้ แต่จานวนเทา่ ใด
6. ตาแหนง่ เคานเ์ ตอร์ใหเ้ ลอื กเป็น Standard (มาตรฐาน)
7. รูปแบบการนบั จานวน ให้เลอื กเป็น Visitor counter
8. เมื่อตง้ั คา่ ต่าง ๆ เสร็จเรยี บรอ้ ยแล้วให้กด "ส่ง"

5. หลงั จากกดส่งแลว้ ระบบจะพาไปยงั "Step 3" ให้ทาการแดรกเมาส์คลุมซอสโค้ดในช่องท่ี 2
ทัง้ หมดและทาการ “Copy”

6. กรอกอีเมลทีส่ ามารถใชง้ านไดเ้ พื่อในกรณที ท่ี าซอสโค้ดทค่ี ดั ลอกไวห้ ายแลว้ ยงั สามารถกลับไป
คดั ลอกในอเี มลได้ โดยระบบจะส่งซอสโค้ดไปใหท้ างอเี มล

7. กด "สง่ "

การฝงั ซอสโคด้ เคานเ์ ตอร์
เม่ือ Copy ซอสโค้ดไว้แล้วจะต้องนามาวางบนเว็บไซต์เพ่ือให้แสดงผลการนับจานวนผู้เข้าชม
แนะนาใหว้ างในสว่ นทา้ ยของเว็บไซต์หนา้ แรกเพ่อื ใหน้ ับจานวนผู้เขา้ ชมในทุกหน้าของเว็บไซต์ ทาได้ ดงั นี้
1. เปดิ เว็บไซตห์ น้าหลกั ในแถบเครื่องมือ “แทรก” เลือก “ฝัง”

2. เลือกแถบ “ฝงั โค้ด”
3.วางโค้ดลงในชอ่ งวา่ ง
4. คลิก “ถดั ไป”

5. คลกิ “แทรก”

6. จะปรากฏจานวนนับบนเวบ็ ไซต์ จากนั้นสามารถนาไปจัดวางไว้ยงั ตาแหนง่ ท่เี หมาะสม

การเผยแพรไ่ ซต์

หลงั จากสรา้ งไซต์เสรจ็ เรียบรอ้ ยแลว้ เมอ่ื ตอ้ งการเผยแพรไ่ ซต์ มวี ิธีการ ดังนี้
1. ในหน้าไซต์ คลิก “เผยแพร”่

2. พิมพ์ที่อยเู่ ว็บ ระบบจะทาการตรวจสอบว่าสามารถใช้ได้หรือไม่ กรณีใชไ้ มไ่ ด้ ใหเ้ ลอื กใช้ช่ืออน่ื
จนกวา่ จะใชไ้ ด้ดงั ภาพด้านลา่ ง หมายเลข 1

ให้ใสท่ อี่ ยูเ่ ว็บไซตเ์ ป็นภาษาอังกฤษ ,- (ขดี กลาง) , ตวั เลข หา้ มใช้เปน็ ภาษาไทยหรอื อกั ขระ
พเิ ศษ

ในสว่ นขอ้ ความ “จดั การ” เมอื่ คลกิ เข้าไปจะเกดิ หน้าต่างขนึ้ มาใหต้ ้งั ค่าดงั นี้

จากหมายเลย เมอ่ื กดขอ้ ความ “ เปล่ยี น” จะเกดิ หนา้ ตา่ งข้นึ มาให้กาหนดคา่ ดังนี้

ในสว่ นข้ันตอนท่ี เป็นการกาหนดคา่ ว่าเวบ็ ไซตท์ ่เี ราสร้างขนึ้ ตอ้ งการเผยแพรแ่ บบไหน เชน่
จากดั การเข้าถงึ เวบ็ ไซต์ , Distance Education Institute, สาธารณะ ดังภาพดา้ นลา่ ง เมื่อต้งั ค่าเสรจ็ แลว้ ให้
กดที่ปุม่ “เสร็จสนิ้ ”

คาอธบิ าย
จากัด คอื ผทู้ ่ีเข้าเว็บไซต์ทีต่ งั้ คา่ เผยแพร่แบบ “จากัด” จะไม่สามารถดูเว็บไซต์ได้
Distance Education Institute คือ การตงั้ คา่ เว็บไซตใ์ ห้เผยแพรส่ าหรบั คนภายในองค์กร
Distance Education Institute เท่าน้นั ทส่ี ามารถดเู ข้าถงึ
เว็บไซต์ได้
สาธารณะ คอื การต้ังค่าใหเ้ ผยแพรด่ ้วย “สาธารณะ” จะทาใหใ้ ครก็ได้ทม่ี ีลงิ ก์สามารถดูเวบ็ ไซต์ได้
โดยไม่มกี ารลงทะเบียนใดๆ

หากชื่อนน้ั สามารถใช้ได้ กด “เผยแพร”่

หมายเหตุ : สรา้ งที่อยเู่ วบ็ เพอื่ เผยแพร่ จะทาในครั้งแรกเทา่ นั้น เมือ่ มกี ารปรับเปลีย่ น หรอื เพมิ่ เตมิ เนื้อหา
ในไซต์ครงั้ ถัดไป เน้อื หาในไซตจ์ ะปรบั เปล่ียนให้เองโดยอัตโนมัติ

การย่อไซต์

เม่ือกดปุ่ม “เผยแพร่” เรียบร้อยแล้ว ให้นาลิงก์จากภาพต่อไปน้ีเพ่ือเผยแพร่ให้ผู้คนเข้าชม
เว็บไซต์ตอ่ ไป ดงั ภาพดา้ นล่าง

เมือ่ สร้างไซต์เสร็จเรยี บรอ้ ยแลว้ สามารถยอ่ ไซตเ์ พ่อื ให้สนั้ ลง และจดจาไดง้ ่ายเมือ่ นาไปเผยแพร่ตอ่
มวี ิธีการทาดังน้ี

1. สญั ลักษณ์ เพอ่ื ใช้คัดลอกลิงก์นาไปเผยแพรห่ รือจดั สง่ ใหก้ ล่มุ เปา้ หมายหรอื ผคู้ นอ่ืนตอ่ ไป
ดังตวั อย่างดา้ นล่าง

2. นาลิงก์ทไ่ี ด้ไปยอ่ หรือตัดให้ส้ัน ด้วยการพิมพ์ gg.gg ท่ีบริเวณ Address Bar แล้วกด Enter
ดงั ภาพ

3. .นาลงิ กท์ คี่ ดั ลอกมาแบบยาวๆ มาวางในชอ่ งทมี่ ีข้อความวา่ “Put your long URL here…”
เพ่อื เตรยี มตัดลงิ กใ์ หส้ ั้น ดังภาพต่อไปนี้

เมอ่ื กดป่มุ Shorten URL แลว้ จะเปน็ ไปตามภาพดังน้ี

จากหมายเลข เมือ่ กดปมุ่ QR code For This Link แลว้ จะได้รบั QR code ดงั นี้

ทาการคัดลอก QR code หรือ บันทึก QR code ไปเป็นรูปภาพ โดยทาการคลิกขวาท่ีตัว
QR code ดังน้ี

บนั ทึก QR code ออกเปน็ รปู ภาพ
คัดลอกรปู ภาพ
คัดลอกทีอ่ ยรู่ ูปภาพ เพอ่ื นาไปใชง้ านเลย
คน้ หารปู ภาพจาก Google เพ่ิมเตมิ

การแชร์ลงิ ก์

การแชร์ลงิ ก์ เป็นการกาหนดวา่ จะใหใ้ ครสามารถเข้าถึงไซตข์ องเราได้ซงึ่ จะสามารถแกไ้ ขไซตไ์ ดด้ ้วย
จะมีทง้ั หมด 3 สทิ ธ์ดิ ้วยกัน คอื

1. เปิด (ฉบบั รา่ ง-บุคคลทร่ี ะบจุ ะแก้ไขได้) หมายถึง การแชร์สทิ ธิ์ในการแก้ไขไซต์ให้กบั บุคคลทร่ี ะบุ
เปน็ แบบอีเมลเทา่ นั้นทจ่ี ะสามารถแกไ้ ขไซตไ์ ด้

2. เปิด (เผยแพรแ่ ล้ว–ทกุ คนจะคน้ หาและดไู ด้) หมายถงึ ผใู้ ช้อนิ เทอรเ์ น็ตทุกคนสามารถคน้ พบ
และเขา้ ถึงไซต์ได้โดยไมต่ ้องลงช่อื เข้าใช้

3. หมายถงึ บญั ชีผ้ใู ช้ทเ่ี ป็นเจ้าของ ไซต์
4. สาหรับป้อนช่อื หรอื ท่อี ยอู่ เี มล สาหรับบคุ คลท่ีตอ้ งการแชรส์ ทิ ธิใ์ ห้เข้าถงึ ไซต์
5. การตั้งค่าของเจ้าของ ใหค้ ลิกเลอื ก เพอ่ื เป็นการปอ้ งกันไมใ่ หผ้ ู้แกไ้ ข เผยแพร่ เปลยี่ นสิทธ์ิ
การเข้าถงึ และเพมิ่ คนใหม่

เมื่อตั้งคา่ เสร็จแลว้ กดปมุ่ “เสร็จสน้ิ ”
หากไมม่ คี วามจาเปน็ ตอ้ งแก้ไขไซต์ร่วมกบั ผอู้ ่นื ควรระบสุ ทิ ธเิ์ ป็น ปิด (ผใู้ ชท้ ีร่ ะบ)ุ

หมายเหตุ คาวา่ ไซต์ หมายถงึ เวบ็ ไซต์

ตวั อยา่ งเวบ็ ไซต์ท่สี าเรจ็ แลว้

บรรณานกุ รม

[ออนไลน]์ . เขา้ ถึงได้จาก : https://support.google.com/edu/site. (วันทค่ี น้ ขอ้ มลู : 19 พฤษภาคม
2562).

[ออนไลน]์ . เข้าถงึ ได้จาก : https://www.google.co.th/edu/training/get- trained/classroom
(วนั ท่คี น้ ขอ้ มูล : 19 พฤษภาคม 2562).

ท่ปี รึกษา คณะผ้จู ดั ทา

นายณัฐพงษ์ รงคะวิรจุ น์ ผู้อานวยการสถาบนั การศึกษาทางไกล

เรยี บเรยี งเนือ้ หา/ออกแบบปก สถาบัน กศน.ภาคตะวันออก
สานกั งาน กศน.จังหวดั ฉะเชงิ เทรา
นางกัญญาทิพ เสนาะวงศ์ สานักงาน กศน.จงั หวัดฉะเชิงเทรา
นางสาวฐติ ารยี ์ สโุ อ๊ะ
นางชณาภา และไหม

บรรณาธกิ าร สถาบนั กศน.ภาคตะวนั ออก
สานกั งาน กศน.จงั หวัดฉะเชิงเทรา
นางกญั ญาทพิ เสนาะวงศ์ สานักงาน กศน.จงั หวดั ฉะเชงิ เทรา
นางสาวฐิตารีย์ สุโอะ๊
นางชณาภา และไหม

จัดทำรูปเลม่ สถาบัน กศน.ภาคตะวันออก
สานกั งาน กศน.จงั หวัดฉะเชิงเทรา
นางกญั ญาทิพ เสนาะวงศ์ สานักงาน กศน.จงั หวดั ฉะเชงิ เทรา
นางสาวฐติ ารยี ์ สุโอ๊ะ
นางชณาภา และไหม