วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 1

เอกสารประกอบโครงการพฒนาคณภาพครและบคลากรทางการศกษา

ดานการพฒนาสอและจดการเรยนรโดยใชเทคโนโลยสอสงคม (Social Media) ระหวางวนท 26-28 พฤษภาคม 2558 ณ ส านกงานเขตพนทการศกษาประถมศกษานครพนม เขต 1

กจกรรมท 2 การใช Wordpress

การสมครสมาชก Wordpress

1. เขาเวบไซต www.th.wordpress.com 2. เลอก สรางเวบไซต

3. ใสชอเวบไซตของตนเอง เชน kruwit, ittoday….. 4. คลก

5. กรอกรายละเอยด 6. คลก

1. www.th.wordpress.com

2

3. ชอเวบไซต 4

กรอกอเมล

ชอผใช (ใชเวลาเขาระบบ)

รหสผาน ใหมตวพมพใหญ พมพเลก+ตวเลข รวมกนอยางนอย 6 ตว

5

6

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 2

7. คลก 8. เลอกธม (ไมตองเลอกธมใด ๆ สามารถเปลยนธมไดภายหลง) คลก

9. Select Free

10. สมครสมาชก Wordpress เรยบรอยแลว

11. เปดอเมลลทใชในการสมคร เพอยนยน

7

8

9

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 3

กรอกขอมล/เพมรปภาพเจาของบลอก

1. คลก

3. กรอกขอมล

2. คลก

5. คลก

4. คลก

8. คลก

6. th-ไทย

7. คลก

9. คลก

10. คลก

11. คลก 12. คลก

14. คลก 13. คลก

15. คลก

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 4

การเขาระบบ Wordpress

ขณะน ยงอยในหนาของ wordpress ใหท าการ Sign Out ออกกอน เพอจะไดเรมตนเขาระบบใหม

การเขาระบบ ใหพมพชอบลอก แลวตามดวย /admin เชน http://www.smnkp1.wordpress.com/admin

**เปดบราวเซอร 2 หนา

หนาท 1 คอหนาจดการระบบ http://www.ชอบลอก.wordpress.com/admin

หนาท 2 คอหนาบลอกทแสดง https://www.ชอบลอก.wordpress.com

** หนาบลอกทแสดง อาจจะมเมนดานขาง ทไมเหมอนกน สามารถแกไขไดในการจดรปแบบ (เนอหานจะอยในวนท 2 ของการอบรม)

คลก

ใชชอผใช รหสผาน แลวคลกเขาสระบบ

หนาจดการระบบ (หลงบาน)

หนาบลอกทแสดง (หนาบาน)

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 5

การจดการเรองในบลอก

เรอง คอ รายการขอมลตางๆ ทเจาของบลอกเพมลงไปในหนาบลอก เรองทเพมจะอยในหนาแรกของบลอกเสมอ

การเพมรปภาพ คลกเลอก เพมสอ

แกไขลงค หวขอเรอง

รายละเอยดเรอง

เพมรปภาพ/ไฟลตาง ๆ

1 2

คลกเพมหลายไฟล แลวเลอกรปทตองการ

คลก

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 6

หากตองการเชอมโยงขอมล ไปยงลงคอน ๆ ท าไดโดย

เรองทเพมจะแสดงทหนาบลอก

เมนแกไขรปภาพ

2. คลก

1. ใสขอความหรอรปภาพทตองการจะเชอมโยง

คลกเผยแพร เมอใสขอมลเรยบรอยแลว

3. ใสชอ url ทตองการเชอมโยง

4. คลก

https://smnkp1.wordpress.com

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 7

การแกไขเรองในบลอก

2. คลกเรองทตองการแกไข

การจดหมวดหมเรอง

หมวดหม คอ การสรางกลมใหกบเรองในบลอก เชน หมวดหมคอมพวเตอร หมวดหมเทยวทวไทย หมวดหมความรทวไป

1. เลอกเรองทงหมด

แกไขเตมรปแบบ

แกไขเฉพาะ หวขอ หมวดหม ปกหมด สถานะการเผยแพร

ลบเรอง

หมวดหมทสรางขน

1. คลกหมวดหม

2. ใสชอหมวดหม

3. คลก

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 8

การใสหมวดหมใหกบเรองในบลอก (ขนตอนนท าในตอนเขยนเรองใหม แตหากยงไมไดใสหมวดหมสามารถใสทหลงได)

การจดการหนาในบลอก

หนาในบลอก คอ สวนทแสดงรายการตางๆ ทในบลอก (เมนดานบน)

การเพมหนาใหม

หนาในบลอก

1. เลอกเรองทงหมด

2. แกไขอยางเรว

3. เลอกหมวดหม

4. อปเดต

1 2

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 9

การเพมหนายอย

ตวอยางหนาหลก

ตวอยางหนายอย

3. ใสชอหนา เชน คอมพวเตอร ป.1 4. แกไขลงค เปนภาษาองกฤษ

5. ใสเนอหา/บทความ 6. เผยแพร

มลกษณะเหมอนเดม แสดงแบบเตมหนา ไมมเมนดานขาง

ไปทหนาบลอก จะเหนหนา คอมพวเตอร ป.1

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 10

เพมหนาใหม ใสขอมลใหเรยบรอย

การสรางคลงรปภาพ

1. เพมหนาใหม โดยใหหนาหลก ชอ อลบมรปภาพ หนายอย ชอ วนวาน...นครพนม

2. ไปทหนา วนวาน...นครพนม

3. เลอกหนาหลก

1. ใสชอหนา 4. แกไขลงค เปนภาษาองกฤษ

5. เผยแพร

2. ใสเนอหา/บทความ

1. เพมสอ

หนาหลกและหนายอย

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 11

2. สรางคลงรปภาพ

3. เลอกหลายไฟล

5.รายละเอยดคลงรปภาพ

6.สรางคลงภาพใหม

7.รปแบบการแสดงรปภาพ

8. ใสคลงรป

4. เลอกรปภาพ

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 12

หากตองการบอกแหลงทมาของรปภาพโดยการลงคขอมล

ผลลพธทได

10.คลก

12.เพมลงค

9. บอกแหลงทมาของรปภาพ

11.เพมลงค

13. อปเดต

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 13

การแกไขอลบมรปภาพ

การเพมรปภาพลงในอลบมรปภาพ

3. เลอกแกไข หรอเพมรปภาพ

1. ไปทหนาอลบมรป

2. คลกเลอกรปภาพ จะมเครองมอแกไข ปรากฎ

7 อปเดต

2

3 4 เลอกรป

5 เพมไฟลไปยงไฟลภาพ 6 อปเดตคลงภาพ

3

1

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 14

3 เลอกธม

4 คลก 5 คลก

การจดรปแบบบลอก

ธม

เลอกธมทตองการ (สามารถเปลยนไดตลอดเวลา) แตเพอความพรอมในการอบรมขอใหคณครทกทานเลอกธมเดยวกนเนองจากแตละธมจะมลกษณะและต าแหนงการแสดงผลลพธทไมเหมอนกน ธมทเลอก คอ Twenty Ten

1 2

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 15

ปรบแตงธม

1

2

เปลยนธม

เปลยนลกษณะธม เชน ฟอนต โหมดส เปลยนไดบางธม

พนหลงรปภาพ หรอสพนหลง

4.3

3

4

4.1

3.1

3.2

4.2 4.4

4.5

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 16

วตเจด คอ รายการตาง ๆ ท Wordpress สรางไวใหผสรางบลอกเลอกไปวางในบลอกไดอสระ เชน ปฏทน สถต ขอความ โพลล likebox ซงวตเจดบางตวจะไมแสดงผลในบางธมจงควรพจารณาเลอกตามลกษณะการใชงานใหเหมาะสมกบธม

5 การเปลยนสวนหว (banner)

5.2 เลอกรปภาพสวนหว

5.1เพมรปภาพสวนหวใหม

หรอ

5.3

หนาบลอกทแสดง

1 2

วตเจด ทมใน wordpress

พนทลากวตเจดมาวาง

วตเจดจะแสดงอยดานบนเสมอ และจะตองมอยางนอย 1 วตเจดเสมอ หากไมเลอก wordpress จะเลอกวางให (เฉพาะบางธม)

วตเจดจะแสดงอยตอจาก วตเจดหลก วตเจดทแสดงในบลอกขณะนจะมรายการตามน

วตเจดจะแสดงดานลางเวบบลอก

วตเจดทแสดงหนาบลอก

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 17

วตเจดทใน wordpress มหลายตว จะแนะน าวธการใช คอ 1. ปฏทน 2. คนหา 3. เรองลาสด

4. หมวดหม 5. สถตบลอก 6. I vote 7. Social Media Icon 8. RSS 9. ขอความ 10. Facebook like Box เพอใหการแสดงผลหนาบลอกเหมอนกน ใหผเขารบการอบรม เกบวตเจดทงหมดทแสดงในหนาบลอกมาไว

ในสวนทไมไดแสดง

น าวตเจด 1. ปฏทน 2. คนหา 3. เรองลาสด 4. หมวดหม 5. สถตบลอก มาวาง ท าได 2 วธ คอ

เลอกจากดรอปดาวนของแตละวตเจด และ ลากมาวางไวในพนทวางวตเจด

ลากมาไวทน

วตเจดทเหลออยสามารถแกไขไดในวตเจดหลก

พนทวางวตเจด

ดรอปดาวนของแตละวตเจด

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 18

วตเจด I vote (ส ารวจโพลลของบลอก)

1. สรางโพลล

1

2

3

4 ตงชอหวขอโพลล

6 เลอกรปแบบโพลล

5. ค าถามโพลล

8 คดลอก code

7

วตเจดทน ามาใช

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 19

2. น าโพลลมาไวในบลอก

1

2 4 เลอกวาจะวางวตเจดไว ทสวนใดของบลอก

โพลลทแสดงหนาบลอก

8 วาง code ทคดลอกไว

10

7 ใสชอหวขอจะแสดงหนาบลอก (วางไวได)

6

9

3 เลอก วตเจด ขอความ

5

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 20

วตเจด Social Media Icon

น าวตเจด Social Media Icon มาวางในพนทวตเจดตามขนตอนเดม แลวใสลงคของ Social Media

วตเจด RSS RSS คอ การดงขาวหรอหวขอจากเวบตางๆ

มาแสดงบนหนาเวบบลอก โดยน ามาเฉพาะหวขอ เมอผใชคลกลงคกจะแสดงรายละเอยดขาวในเวบตนฉบบนนๆ

น าวตเจด RSS มาวางในพนทวตเจดตามขนตอนเดม แลวใสลงคของ RSS (ลงคของ RSS คนจาก google)

5 ใสชอผใช

7 6

Social Media Icon ทแสดงหนาบลอก

RSS

4 ใสชอหวขอจะแสดง หนาบลอก (วางไวได)

2 เลอกวาจะวางวตเจดไว ทสวนใดของบลอก

1 เลอก Social Media Icon

2 เลอกวาจะวางวตเจด ไวทสวนใดของบลอก

3

1 เลอก RSS

3

4 วางลงค RSS

5 ชอ RSS

6 การแสดง RSS

7 8

RSS ทแสดงหนาบลอก

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 21

วตเจดขอความ วตเจดขอความ เปนวตเจดทผสรางบลอกสามาถพมพขอความ ใสรปภาพ และลงคเชอมโยงขอมลเองได

1. ใสขอมลประเภทขอความ น าวตเจดขอความมาวางในพนทวตเจดตามขนตอนเดมแลวพมพขอความตามทตองกร

2 เลอกวาจะวางวตเจดไว ทสวนใดของบลอก

1 เลอกขอความ

3 4 ใสขอความ

5 6

ขอความทแสดงหนาบลอก

การเขยน code ปรบแตงตวอกษร สตวอกษร คอ <font color="blue">ขอความ</font> ขนบรรทดใหม คอ <br>ขอความ

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 22

2. ใสขอมลประเภทรปภาพ เพมรปภาพในไฟลสอ 7

เพมวตเจดขอความตามขนตอนเดม แลววาง url ทคดลอกมา

1 2

3

4 เลอกไฟล

5 คลกรปทเพมมา

6 คดลอก URL

การลงคเชอมโยง <a href="ชอเวบไซตทตองการลงค" target="_blank">

การวางรปภาพ <img src="url ทคดลอกมา">

การลงคเชอมโยงโดยรปภาพ <a href="ชอเวบไซตทตองการลงค" target="_blank"> <img src="url ทคดลอกมา"></a>

รปภาพทแสดงหนาบลอก

7 วาง URL ทคดลอกไว

8

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 23

กจกรรมท 5 การใช facebook

Facebook fanpage น า Facebook Likebox มาวางในบลอก

1 เขาระบบ Facebook เลอกสรางเพจ

2

3 ใสชอเพจ

4 กรอกขอมล

Facebook fanpage

1 ไปทหนา Fanpage

2 คดลอกลงค

3 วตเจด facebook like box

4 เลอกพนทวางวตเจด

6 วางลงคทคดลอกไว

Likebox ทแสดงหนาบลอก

5

7

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 24

4 เลอก google ฟอรม

3 เลอกไดรฟ

5 ชอแบบทดสอบ/ชอฟอรม

6 ค าชแจง/อธบายฟอรม

7 ชอ- นามสกล ชน เลขท โรงเรยน --- เปนประเภท ขอความ ระดบชน----- เปนประเภท เลอกจากรายการ

8

9 เพมรายการจนครบ

ผลลพธทได

2 เขาเมล gmail

กจกรรมท 6 การใช google drive (แบบทดสอบ รายงานคะแนน)

1 สรางหนาแบบทดสอบขนมา

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 25

10 ค าถาม ค าตอบ

แกไข คดลอก ลบ

11 คลกบงคบตอบ

12

13 เพมรายการจนครบจ านวนขอ

14 เปลยนธม

15 เลอกธม

ตงคาธม

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 26

การน าแบบทดสอบไปวางในบลอก

1 เลอก ไฟล --- ฝง

2 คดลอก code

3

5 ไปทหนาแบบทดสอบแลววาง code ทคดลอกไว 6

แบบทดสอบแสดงทหนาบลอก

4

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 27

การตรวจแบบทดสอบ

2

1 ท าแบบทดสอบทบลอก (เลอกขอทถก)

3

4

อธบายฟงกชนการใหคะแนน

=if(F2="ข.ทะเบยนรถ",1,0)

5 ไปเซลลหลงขอสอบสดทายพมพฟงกชน การใหคะแนน

ต าแหนง เซลลค าตอบ

ค าตอบท ถกตอง

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 28

การใหคะแนนทงหมด

การน าคะแนนไปแสดงหนาบลอก จากนนไปท google drive

ไปเซลลสดทาย ใสฟงกชน การรวมคะแนน คอ

=sum(k2:o2) อธบายฟงกชนการใหคะแนนรวม

=sum(k2:o2)

เซลลทเปนคะแนนในแตละขอ เรมจากเซลลแรกถงเซลลสดทาย

1 สรางหนาคะแนนขนมา

2 ซอนคอลมภ A (ประทบเวลา)

3 เลอกคอลมภทเปนค าตอบและคะแนนรายขอ

4 คลกขวา ซอนคอลมภทเลอก

ผลจากการซอนคอลมภ

วารณ บ ารงสวสด : โรงเรยนอนบาลนครพนม : หนา 29

5

6

7

9

10 คดลอกลงค

11 เลอกเผยแพรซ า

8

12 เลอกหนาคะแนน

13 วางลงคทคดลอกไว

14

ผลการแสดงคะแนนหนาบลอก