_คู่มือชำนาญการ

คูมอื การปฏูบัตงูาน (Work Manual) การพัฒนาเว็บไซต์เพื่อใหบ้ รการห้องสมุดู สานกั หอสมุดูมหาวทยาลยั บรพา นายเฉลมเกยี รตููดีสม สานักหอสมดุ ูมหาวทยาลยั บรพา มนี าคมูพ.ศ.ู2562

คำนำ คมู่ อื การปฏิบตั ิงาน เร่ือง การพัฒนาเว็บไซต์ เพ่อื ให้บริการหอ้ งสมุด สานักหอสมดุ มหาวทิ ยาลยั บรู พา ฉบับน้ี ได้จัดทาขึน้ เพ่ือให้ผปู้ ฏิบัตงิ านใช้เปน็ แนวทางในการดาเนนิ งาน ปรบั ปรุงเน้ือหาบนเวบ็ ไซตข์ องสานักหอสมุด เพ่ือใชเ้ ป็นแนวทางเดยี วกัน ในการจดั ทาเว็บไซต์ ที่แสดงผลเป็นมาตรฐานแบบ Responsive Web Design โดยผู้จัดทาไดร้ วบรวมประสบการณ์ ในการปฏิบตั ิงานมาเปน็ แนวทางในการปฏบิ ตั ิ ตามขน้ั ตอนอยา่ งถูกต้อง ผู้จดั ทาหวังเปน็ อยา่ งยง่ิ วา่ คมู่ ือฉบับนจี้ ะเปน็ ประโยชน์สาหรบั การปฏบิ ัติงานของ ผทู้ ีเ่ กี่ยวขอ้ งและผูท้ ่ปี ฏบิ ัติหน้าที่แทน เพอื่ ใชเ้ ปน็ แนวทางสาหรบั การปฏิบตั ิงาน ทาใหเ้ กิดความเขา้ ใจ และสามารถนาไปปฏิบัตงิ านไดส้ ะดวกย่งิ ข้ึน เฉลิมเกยี รติ ดสี ม

ฉ สารบญั หน้า สารบญั ......................................................................................................................................... ฉ สารบัญภาพ ................................................................................................................................. ช การบริหารจัดการข้อมูลเพื่อเผยแพร่บนเวบ็ ไซต์ของสานกั หอสมุด มหาวทิ ยาลยั บูรพา................. 1 ความเปน็ มา ................................................................................................................................. 1 วัตถุประสงค์................................................................................................................................. 1 ขอบเขต ....................................................................................................................................... 2 คาจากดั ความ............................................................................................................................... 2 โครงสรา้ งองค์กร .......................................................................................................................... 3 โครงสรา้ งของฝา่ ยเทคโนโลยสี ารสนเทศ....................................................................................... 4 หนา้ ทร่ี บั ผดิ ชอบของโครงสร้างฝา่ ยเทคโนโลยีสารสนเทศ............................................................. 4 ผังกระบวนการ/ งาน (Work flow) ............................................................................................. 7 ขัน้ ตอนการปฏบิ ัตงิ าน.................................................................................................................. 16 ในการปรบั ปรงุ การบรหิ ารจัดการข้อมลู เพื่อเผยแพรบ่ นเว็บไซตข์ องสานกั หอสมดุ ........................ 32 ภาคผนวก..................................................................................................................................... 49 ภาคผนวก ก.......................................................................................................................... 50 ภาคผนวก ข.......................................................................................................................... 54 ภาคผนวก ค.......................................................................................................................... 59 ภาคผนวก ง........................................................................................................................... 65 ภาคผนวก จ .......................................................................................................................... 67 บรรณานกุ รม................................................................................................................................ 73 ประวัติของผูจ้ ดั ทา........................................................................................................................ 74

ช สารบัญภาพ ภาพท่ี หน้า 1 โครงสรา้ งองค์กร สานักหอสมุด มหาวิทยาลยั บรู พา........................................................... 3 2 โครงสรา้ งของฝ่ายเทคโนโลยีสารสนเทศ ............................................................................ 4 3 ผงั กระบวนการปฏบิ ตั ิงาน (Work flow)............................................................................ 6 4 เขา้ เวบ็ ไซตโ์ ดยพมิ พ์ URL ทเ่ี บาร์เซอร์............................................................................... 16 5 ใชโ้ ปรแกรม Illustrator ในการออกแบบภาพเพื่อทาเช่ือมตอ่ เว็บไซต์................................ 17 6 สง่ ออก (Export) ไฟล์เพื่อนาไปใช้บนเว็บไซต์ .................................................................... 17 7 Save as เป็นไฟล์ประเภท PNG ........................................................................................ 18 8 ตั้งช่ือไฟลแ์ ละเลือก ตาแหนง ทจี่ ะบันทึกไฟล์ .................................................................... 18 9 บนั ทึกข้อมูลเรยี บร้อย ........................................................................................................ 19 10 หนา้ เว็บไซต์สานักหอสมุด.................................................................................................. 19 11 เข้าหนา้ เวบ็ ไซตส์ านักหอสมุด เพอื่ แก้ไขข้อมูล ................................................................... 20 12 เขา้ หน้าเวบ็ ไซต์สานักหอสมุด เพ่ือแกไ้ ขข้อมลู ................................................................... 20 13 หน้าจอท่ตี ้องการแก้ไขข้อมลู .............................................................................................. 21 14 หน้าแก้ไขข้อมูล ................................................................................................................. 21 15 การแทรก Element ส่วนรปู ภาพ ...................................................................................... 22 16 การแทรกรูปท่ีออกแบบ ..................................................................................................... 22 17 การนาภาพเข้าระบบ.......................................................................................................... 23 18 การนาภาพแทรกในสว่ นทวี่ าง element ........................................................................... 23 19 การเลอื ก Custum URL เพ่ือกาหนด URL การเช่อื มโยงของรปู ภาพ................................. 24 20 พิมพ์ URL ทชี่ อ่ งวา่ ง.......................................................................................................... 24 21 คลกิ ปมุ่ update เพอ่ื บันทกึ ข้อมูลลา่ งซ้าย ........................................................................ 25 22 คลิกปุ่ม preview เพอื่ ทดสอบการแสดงผล ....................................................................... 25 23 ทดสอบการแสดงผลแบบ Responsive Mode.................................................................. 26 24 ทดสอบแสดงผล Tablet.................................................................................................... 26 25 การแสดงผลแบบ Tablet .................................................................................................. 27 26 การแสดงผลแบบ Mobile (360 px).................................................................................. 27 27 คลกิ เมนู Config เพือ่ ออกจากหนา้ จอสรา้ งเวบ็ ไซต์............................................................ 28 28 คลิกปมุ่ Exit Dashboard.................................................................................................. 28 29 กลับสหู่ น้าจอ Dashboard ................................................................................................ 29 30 ออกจากระบบ Wordpress............................................................................................... 29 31 หนา้ เวป็ ไซต์ที่พฒั นาขึน้ ..................................................................................................... 30 32 คลกิ ที่ไอคอน PULINET 2019........................................................................................... 30

ซ สารบญั ภาพ (ตอ่ ) ภาพที่ หน้า 33 หนา้ เวบ็ ไซต์ PULINET 2019............................................................................................. 31 34 ออกแบบสไลด์ด้วยโปรแกรม Illustrator CC 2018........................................................... 32 35 บันทึกไฟลส์ ไลดเ์ ปน็ รูปแบบ JPG หรอื PNG...................................................................... 32 36 แกไ้ ขสว่ นสไลด์ คลิกปุ่ม ADD ITEM .................................................................................. 33 37 คลิก Add Item................................................................................................................. 33 38 Upload รูปสไลด์............................................................................................................... 34 39 ใส่ลงิ ค์ (URL) ไปยัง Page ท่ีตอ้ งการ ................................................................................. 34 40 รบั เมล์ไฟลเ์ อกสารตารางฝกึ อบรมจากฝ่ายบริการ.............................................................. 35 41 เปดิ ไฟล์ตารางฝกึ อบรม...................................................................................................... 35 42 ตารางการอบรมการใชห้ อ้ งสมุด......................................................................................... 36 43 แกไ้ ขข้อความและลิงค์ลงทะเบยี นในเวบ็ ไซต์ตามไฟลเ์ อกสารตารางฝึกอบรม .................... 36 44 การเพิ่มหรอื ลบวนั ท่ีอบรม ................................................................................................. 37 45 คลกิ ปมุ่ update................................................................................................................ 37 46 สร้าง Post ขน้ึ พรอ้ มคลกิ ปุ่ม Add New............................................................................ 38 47 เลือก Categories.............................................................................................................. 38 48 สร้าง หวั ข้อ, รปู ภาพ, รายละเอียดเหตกุ ารณแ์ ละใสข่ ้อมลู ................................................. 39 49 สร้างอัลบม้ั รูปภาพ............................................................................................................. 39 50 สรา้ ง Code อลั บ้ัมภาพแบบอัตโนมตั ิแล้วคดั ลอก.............................................................. 40 51 เม่ือคลิกไอคอน Add Gallery จะขน้ึ Pop up .................................................................. 40 52 คลกิ เลือก Gallery ท่ีจะนาไปแสดงทห่ี นา้ เวบ็ ไซต์.............................................................. 41 53 เลอื กรูปแบบในการแสดง จากนน้ั คลิกปุ่ม INSERT GALLERY ........................................... 41 54 คลกิ TAB Text เพื่อแสดง Short Code ของการแสดงภาพหนา้ เวบ็ ไซต์........................... 42 55 คัดลอก Short Code เพอื่ นาไปวางในส่วนที่ตอ้ งการแสดงในหนา้ เวบ็ ไซต์......................... 42 56 นา code อลั บมั้ ภาพมาใชใ้ น Post.................................................................................... 43 57 สรา้ ง Post ในเวอร์ช่ันภาษาอังกฤษ................................................................................... 43 58 Post เวอร์ชัน่ ภาษาอังกฤษก่อนแก้ไขขอ้ ความ ................................................................... 44 59 แก้ไขข้อมูลเปน็ ภาษาองั กฤษจากฝ่ายบรกิ ารสารสนเทศ..................................................... 44 60 สร้างภาพด้วยโปรแกรม Illustrator CC2018.................................................................... 45 61 บันทึกภาพในรูปแบบ JPG หรือ PNG ................................................................................ 45 62 เขา้ ระบบบรหิ ารจดั การเวบ็ ไซตส์ านกั หอสมดุ ..................................................................... 46 63 พมิ พช์ ่อื Page แลว้ คลกิ ทปี่ ุม่ Edit with Elementer........................................................ 46 64 คลกิ ปมุ่ เพื่อสรา้ ง Section ใสร่ ูปภาพ............................................................................... 47

ฌ สารบญั ภาพ (ตอ่ ) ภาพที่ หน้า 65 เลือก Structure แบบแรก................................................................................................. 47 66 เลือก Wedget รูปภาพแล้ว Upload ภาพทีส่ ร้างไวก้ ่อนหนา้ นามาใส่แล้ว คลิกปมุ่ Publish................................................................................................................ 48

การบริหารจดั การขอ้ มลู เพอื่ เผยแพรบ่ นเว็บไซต์ ของสานกั หอสมดุ มหาวทิ ยาลัยบรู พา ความเป็นมา สำนักหอสมดุ มหำวิทยำลยั บรู พำ เป็นแหลง่ ใหบ้ ริกำรสำรสนเทศต่ำง ๆ ทุกประเภทไมว่ ่ำ จะเป็นหนงั สอื วำรสำร วิทยำนพิ นธ์ งำนวิจัย กฤตภำค ซีดีรอม ดีวีดีรอม ฯลฯ ทงั้ ท่ีอยู่ในรปู ตัวเล่ม และสื่ออเิ ลก็ ทรอนกิ ส์หรือส่อื สำรสนเทศทใ่ี ห้บริกำรผำ่ นเครือขำ่ ย โดยกำรเข้ำถงึ สื่อสำรสนเทศนัน้ ในกรณีเปน็ ตัวเลม่ ผู้ใช้บริกำรสำมำรถเขำ้ ใชไ้ ด้ท่สี ำนักหอสมดุ โดยตรง ตำมเวลำกำรเปิดให้บรกิ ำร สว่ นสื่อสำรสนเทศในรูปแบบอเิ ลก็ ทรอนิกส์ ผู้ใช้บริกำรสำมำรถเข้ำถึงได้ตลอดเวลำ 24 ชั่วโมง ผำ่ นเวบ็ ไซต์ https://www.lib.buu.ac.th ซง่ึ ปัจจบุ ันมีผใู้ ช้บริกำร เขำ้ ใช้เวบ็ ไซตส์ ำนักหอสมุด เฉลี่ยเดือนละ 50,000 คร้ัง ซึ่งในปัจจุบนั สำนักหอสมุดมบี ริกำรทำงออนไลน์มำกมำย เช่น E-book, E-journal, E-databases, E-thesis และE-From เปน็ ตน้ เนือ่ งดว้ ยปจั จบุ ันผู้ใช้บริกำรเขำ้ ถึงเว็บไซต์สำนกั หอสมดุ ผ่ำนอุปกรณห์ ลำยรูปแบบ ดงั นี้ คอมพวิ เตอร์, โน้ตบุ๊ค, แท็บเลต็ และมือถือ เน่ืองด้วยขนำดจอภำพบนอปุ กรณ์แตล่ ะประเภทมขี นำด ไม่เทำ่ กันดงั นน้ั เพือ่ ให้เว็บไซต์ของสำนักหอสมุดแสดงผลได้อย่ำงมปี ระสทิ ธิภำพบนอปุ กรณ์ในแตล่ ะ ประเภท ผจู้ ดั ทำเว็บไซต์จึงจัดทำเว็บไซตท์ ่ีมกี ำรแสดงผลเป็นมำตรฐำนแบบ Responsive Web Design โดยมำตรฐำนดงั กล่ำวนี้ เวบ็ ไซต์สำนกั หอสมุดสำมำรถแสดงผลได้อยำ่ งเหมำะสมบนอุปกรณ์ แต่ละประเภทอยำ่ งอตั โนมัติ เพ่ือใหผ้ ู้ใชบ้ ริกำรสำมำรถเข้ำถึงสอ่ื สำรสนเทศและกำรบรกิ ำรออนไลน์ ตำ่ ง ๆ ได้อย่ำงมีประสทิ ธิภำพ วตั ถปุ ระสงค์ 1. เพอ่ื ใหส้ ำนักหอสมดุ มหำวทิ ยำลัยบูรพำ มีคู่มอื กำรปฏิบตั งิ ำนท่ชี ัดเจน อยำ่ งเปน็ ลำยลักษณ์อกั ษร ท่แี สดงถึงรำยละเอยี ดข้ันตอนกำรปฏบิ ัติงำนของกจิ กรรม/ กระบวนกำรต่ำง ๆ ของหนว่ ยงำน และสรำ้ งมำตรฐำนกำรปฏิบัติงำนท่มี ุ่งไปสู่กำรบริหำรคณุ ภำพท่วั ท้ังองค์กรอยำ่ งมี ประสิทธิภำพ เกิดผลงำนทีไ่ ด้มำตรฐำนเป็นไปตำมเปำ้ หมำย ไดผ้ ลิตผลหรอื กำรบริกำรที่มีคณุ ภำพ และบรรลุขอ้ กำหนดทีส่ ำคัญของกระบวนกำร 2. เพื่อเปน็ หลักฐำนแสดงวิธีกำรทำงำนทสี่ ำมำรถถำ่ ยทอดให้กบั ผูเ้ ข้ำมำปฏิบัติงำนใหม่ พัฒนำให้กำรทำงำนทเี่ ปน็ มืออำชีพ และใชป้ ระกอบกำรประเมนิ ผลกำรปฏบิ ัติงำนของบุคลำกรรวมทง้ั แสดงหรือเผยแพรใ่ หก้ บั บุคคลภำยนอก 3. เพ่ือเปน็ แนวทำงให้ผปู้ ฏิบัติงำนในกระบวนกำร กำรบริหำรจดั กำรข้อมูลเพ่ือเผยแพร่ บนเวบ็ ไซตข์ องสำนกั หอสมุด

2 ขอบเขต คู่มอื กำรปฏิบัตงิ ำนนี้ใช้สำหรับผปู้ ฏิบัติงำนทีร่ ับผดิ ชอบงำนกำรบรหิ ำรจัดกำรข้อมลู เว็บไซตข์ องสำนักหอสมดุ หรือผู้ปฎิบัติหน้ำที่แทน เพ่ือเปน็ แนวทำงในกำรแก้ไขปรับปรงุ ข้อมลู ตลอดจนสรำ้ งข้อมลู ใหม่ ๆ บนเวบ็ ไซต์อย่ำงเปน็ มำตรฐำนตำมแบบ Responsive Web Design โดยอำศยั โปรแกรม WordPress และใชโ้ ปรแกรมสว่ นเสรมิ (Plugin) Elementor Pro เป็นเครือ่ งมือ ในกำรบริหำรจดั กำรเว็บไซต์` คาจากดั ความ WordPress คือ โปรแกรมสำเรจ็ รปู ที่ใช้สร้ำงและจัดกำรเนอื้ หำบนเครือข่ำยอินเทอร์เน็ต (Contents Management System: CMS) กลำ่ วคอื แทนท่ีจะต้องติดต้ังโปรแกรมที่ใช้สร้ำงและ ออกแบบเวบ็ ไซต์ลงบนเครื่องคอมพิวเตอร์อย่ำงเช่น Macromedia Dreamwaver, Microsoft Fontpage เป็นต้น แต่ CMS น้นั ถูกสร้ำงมำเพ่ือใช้งำนผ่ำนเครือขำ่ ยอินเทอร์เน็ตโดยตรง หมำยควำมวำ่ เมื่อจะใช้งำนโปรแกรมน้ี กส็ ำมำรถใชไ้ ด้ทันทผี ำ่ นอนิ เทอร์เน็ต เพียงแค่เข้ำสู่ระบบจัดกำรของ CMS นั้น ๆ เช่น joomla, simple machines, open cart, magento เปน็ ตน้ Plugin คือ สว่ นเสริมของ WordPress ท่ชี ว่ ยเพมิ่ ควำมสำมำรถใหก้ ับโปรแกรม Wordpress เปรยี บเสมือนกำรเพิ่มประสิทธภิ ำพของโปรแกรม WordPressใหส้ ำมำรถทำงำนในแบบ ทเี่ รำตอ้ งกำร หรอื แมแ้ ต่ดัดแปลงกำรสำหรบั กำรใช้งำนเฉพำะด้ำน เช่น ปล๊ักอนิ Elementor Pro ตดิ ตง้ั เพื่อสร้ำงเวบ็ ไซตใ์ นรูปแบบ Responsive Web Design Responsive Web Design (RWD) หมำยถึง กำรออกแบบเพอื่ ให้เว็บไซตส์ ำมำรถแสดง ผลไดเ้ หมำะกบั กำรใช้งำน บนอปุ กรณ์พกพำ(Mobile Device) หรอื หนำ้ จอคอมพวิ เตอร์ทว่ั ไป (Desktop) โดยปกติแล้วเวบ็ ไซต์ทไ่ี ม่ได้ออกแบบให้รองรบั Responsive Web Design เม่ือเปดิ จำก อปุ กรณ์พกพำจะเหน็ เว็บไซต์หน้ำจอเต็ม ๆ หน้ำและเหน็ ตัวอักษรแสดงเป็นตวั เล็ก ๆ ทำใหอ้ ่ำนยำก เวลำที่ตอ้ งกำรอ่ำนจะต้องซมู เข้ำไปเพอ่ื อำ่ นข้อควำม โดยท่ัวไปจะมีมำตรฐำนกำรต้งั ขนำดไว้ 3 ขนำด คอื Desktop กวำ้ งประมำณ 1000px ขน้ึ ไป Tablet มำกกวำ่ 768px Mobile นอ้ ยกว่ำ 768px Elementor Pro หมำยถึง โปรแกรมส่วนเสริมของโปรแกรม WordPress เป็นเคร่อื งมือใน กำรสรำ้ งเวบ็ ไซต์ในรูปแบบ Responsive Web Design ระบบจัดการเนอ้ื หา (Content management system: CMS) คือระบบซอฟต์แวร์ คอมพวิ เตอร์ที่ใชเ้ พื่อจัดระเบียบ และส่งเสริมกำรทำงำนในหมู่คณะ ใหส้ ำมำรถสรำ้ งเอกสำรหรือ เนอ้ื หำสำระอนื่ ๆ โดยมำกแล้ว ระบบจดั กำรเนือ้ หำมกั จะเปน็ เว็บแอปพลิเคชัน ซง่ึ ใชจ้ ัดกำรเว็บไซต์ และเนือ้ หำบนเว็บไซต์

โครงสรา้ งองค์กร โครงส สาน สำนกั งำนเลขำนกุ ำร ฝำ่ ยบรกิ ำร ฝำ่ ยพัฒนำทรัพยำกรสำรสนเทศ ฝำ่ ยวิเครำะห์ท สำรสนเทศ สำรสนเ งบกำรเงิน งำนบริกำร งำนพัฒนำ งำนบุคลำกร ผู้อำ่ น ทรัพยำกร สำรสนเทศ งำนแผนและ งำนบริกำร ธุรกำร ยืม-คืน งำนบำรุงรกั ษำ งำนอำคำร หนังสอื งำนสง่ เสริม สถำนท่ีและ กำรใชส้ ำรสนเทศ ยำนพำหนะ ภำพท่ี 1 โครงสร้ำงองค์กร สำนกั หอสมุด มหำวทิ ยำลัยบูรพำ

3 สร้างองค์กร คณะกรรมการประจาสานักหอสมุด นักหอสมดุ ทรพั ยำกร ฝ่ำยโสตทัศนศึกษำ ฝ่ำยเอกสำรและวำรสำร ฝ่ำยเทคโนโลยี เทศ สำรสนเทศ งำนพฒั นำ งำนบรกิ ำรสือ่ งำนบริกำร งำนนวัตกรรม ฐำนข้อมลู โสตทศั น์และ วำรสำรและ เทคโนโลยี หนงั สือ โสตทัศนปู กรณ์ หนงั สอื พิมพ์ สำรสนเทศ งำนพฒั นำ งำนเทคนิค งำนจัดหำวำรสำร งำนระบบ ฐำนข้อมูล และหนังสอื พิมพ์ เครือข่ำย สื่อโสตทศั น์และ คอมพวิ เตอร์ ส่อื เล็กทรอนิกส์ งำนพฒั นำ ฐำนข้อมลู งำนห้องสมุดดิจทิ ัล ดรรชนีวำรสำรและ งำนข้อมูลท้องถ่นิ วำรสำร ขอ้ มลู ภำคตะวนั ออก อเิ ล็กทรอนิกส์ งำนจดหมำยเหตุ มหำวทิ ยำลัยบรู พำ 3

4 โครงสร้างของฝา่ ยเทคโนโลยีสารสนเทศ ฝ่ายเทคโนโลยสี ารสนเทศ งำนนวัตกรรม งำนระบบเครือข่ำย งำนห้องสมดุ ดิจิทลั เทคโนโลยสี ำรสนเทศ คอมพิวเตอร์ ภำพท่ี 2 โครงสรำ้ งของฝ่ำยเทคโนโลยีสำรสนเทศ หน้าท่ีความรบั ผิดชอบของฝา่ ยเทคโนโลยีสารสนเทศ ฝำ่ ยเทคโนโลยีสำรสนเทศทำหน้ำทด่ี แู ลรบั ผิดชอบงำนให้บริกำรเทคโนโลยสี ำรสนเทศ แก่ฝำ่ ยตำ่ ง ๆ ดูแลระบบเครือขำ่ ย จัดกำรฐำนข้อมูล ตลอดจนแก้ไขปัญหำทเ่ี กิดจำกเคร่ืองคอมพิวเตอร์ อุปกรณ์ โปรแกรมและระบบเครือข่ำย เพ่ือใหฝ้ ่ำยตำ่ ง ๆ สำมำรถใชเ้ ทคโนโลยีในกำรดำเนนิ งำนและ ให้บรกิ ำรได้อยำ่ งมปี ระสิทธภิ ำพ รวมท้ังกำรฝึกอบรมเพื่อส่งเสริมกำรใช้เทคโนโลยีสำรสนเทศแก่ ผูป้ ฏบิ ตั งิ ำน ใหส้ ำมำรถใช้เทคโนโลยสี ำรสนเทศไดอ้ ยำ่ งมีประสทิ ธิภำพฝำ่ ยเทคโนโลยีสำรสนเทศ รับผิดชอบงำน 6 ลักษณะ ดังนี้ 1. วำงแผนและพฒั นำระบบเทคโนโลยี ทำหนำ้ ที่วำงแผนและพฒั นำระบบคอมพวิ เตอร์ ภำยในสำนกั หอสมุด โดยกำรศึกษำเทคโนโลยใี หม่ ๆ จดั หำเครอ่ื งคอมพิวเตอร์ และโปรแกรมต่ำง ๆ สำหรบั กำรพฒั นำงำน 2. งำนระบบเครือขำ่ ยคอมพิวเตอร์ ดแู ลระบบคอมพิวเตอร์ ระบบเครือข่ำยคอมพวิ เตอรแ์ ละ โปรแกรมคอมพิวเตอร์อื่น ๆ ทเี่ ก่ียวข้องกบั กำรบรกิ ำร กำรพัฒนำหรอื บริหำรงำนหอ้ งสมุด 3. งำนฐำนขอ้ มูล ดแู ลรับผดิ ชอบฐำนขอ้ มูลระบบห้องสมดุ อตั โนมตั ิ ฐำนข้อมูลวทิ ยำนิพนธ์ ออนไลน์ฉบบั เต็ม ฐำนขอ้ มลู ปญั หำพเิ ศษระปริญญำตรี และฐำนขอ้ มูลอื่น ๆ ที่พัฒนำขึ้นเพือ่ ใชป้ ระโยชน์ ในกำรให้บริกำรสำรสนเทศ 4. งำนพฒั นำเวบ็ ไซต์ ดูแลและพัฒนำแกไ้ ขปรบั ปรงุ เว็บไซต์ของสำนักหอสมุด 5. งำนระบบห้องสมุดอัตโนมัติ ทำหนำ้ ท่ใี ห้คำปรกึ ษำเรื่องระบบหอ้ งสมุดอัตโนมัติบริกำรกำร ตดิ ต้งั รวมถึงดูแลระบบห้องสมดุ อตั โนมตั ิกบั คณะต่ำง ๆ ในมหำวทิ ยำลัยและหนว่ ยงำนรำชกำรทีร่ ้องขอ 6. งำนฝึกอบรม พัฒนำบุคลำกรใหม้ คี วำมรู้และทักษะในด้ำนเทคโนโลยีสำรสนเทศใน กำรฝกึ อบรมดำ้ นเทคโนโลยสี ำรสนเทศแก่บุคลำกรในระดบั ตำ่ ง ๆ 7. งำนระบบกล้องวงจรปิด ออกแบบผังเพ่ือวำงจดุ กล้อง ดูแลควบคมุ กำรติดตง้ั และใหบ้ ริกำร ตรวจสอบขอ้ มูลกล้องวงจรปิดย้อนหลงั

5 เรม่ิ ต้น รับขอ้ มูลเพ่อื ปรบั ปรงุ เว็บไซต์จาก ฝ่ายต่างๆ ตรวจสอบความ ไม่ถูกต้อง สง่ ข้อมลู กลบั ใหใ้ ห้ ถกู ตอ้ งขอ้ มลู ฝำ่ ยต่ำงๆ แกไ้ ข ถูกต้อง ไมต่ อ้ ง ออกแบบหน้าเวบ็ ไซต์ ออกแบบ ใหมห่ รอื ไม่ ไม่ต้อง ออกแบบ ตกแตง่ ภำพ ตรวจสอบว่าต้องตกแตง่ ภาพ ไม่ต้องเขียน หรอื ไม่ Scripts Program ตกแตง่ ภำพ ต่อ ตรวจสอบวา่ ต้องเขียน Script Program หรือไม่ เขียน Scripts Program ตอ่

ตอ่ 6 ตอ่ พฒั นาหนา้ เวบ็ ไซต์ ไมถ่ ูกต้อง ตรวจสอบความถูกต้อง ไมถ่ กู ต้อง ถูกต้อง นาเว็บไซต์ทพ่ี ัฒนาขนึ้ เผยแพร่บนเครอื ข่ายอินเทอร์เน็ต ตรวจสอบความถูกตอ้ ง การแสดงผล ถูกต้อง เวบ็ ไซตแ์ สดงผล อยา่ งถูกตอ้ ง จบกำรทำงำน ภำพที่ 3 ผังกระบวนกำรปฏิบตั ิงำน (Work flow)

ผังกระบวนการ/ งาน (Work flow) ชื่อกระบวนการ.........กำรบริหำรจัดกำรข้อมูลเพื่อเผยแพร่บนเวบ็ ไซตข์ องสำนกั หอสมดุ มห ขอ้ กาหนดสาคัญของกระบวนการ......สำมำรถบริหำรจดั กำรขอ้ มลู เวบ็ ไซตโ์ ดยสอดคล้องก ครบถ้วนสมบูรณ์ ตัวชีว้ ดั สาคญั ของกระบวนการ.....รอ้ ยละของจำนวนคร้งั ในกำรบรหิ ำรจัดกำรขอ้ มลู เว็บไซต อย่ำงถูกต้องครบถ้วนสมบูรณ์ (ร้อยละ 100) ท่ี ผังกระบวนการ ระยะเวลา รายละเอีย เร่ิมตน้ เรมิ กระบวนกำ 1 10 นำที รับขอ้ มูลจำกผ ภำยในส่วนงำน รับข้อมลู เพื่อปรับปรงุ 1. กำรบอกโด เวบ็ ไซตจ์ ำกฝำ่ ยต่ำง ๆ 2. อเี มล์ (e-M 3. ไลน์ (LINE 4. Facebook 5. Handy dr

7 หำวิทยำลัยบรู พำ.............................................................................................. กบั ควำมต้องกำรของผ้ใู ชภ้ ำยในส่วนงำนสำนักหอสมดุ ได้อย่ำงถูกต้อง ต์โดยสอดคล้องกับควำมต้องกำรของผู้ใชภ้ ำยในส่วนงำนสำนกั หอสมดุ ได้ ยดงาน มาตรฐานคณุ ภาพงาน เอกสารท่เี ก่ียวข้อง ผูร้ ับผิดชอบ ำรทำงำน ผ้ใู ช้ - ข้อมลู ตัวอักษรในรปู แบบ บคุ ลำกร น *.doc,*.docx และ *.txt สำนักหอสมุด ดยวำจำ - ขอ้ มลู ภำพอยู่ในรปู แบบ*. (ผสู้ ง่ ข้อมลู ) Mail) PSD,*.PNG,*.GIF,*.JPG E) และ*.AI k - ขอ้ มลู เอกสำร ในรปู แบบ rive PDF 7

ที่ ผงั กระบวนการ ระยะเวลา รายล 2 10 นำที ตรวจส ควำมถ ของข้อ ภำพปร ไม่ถูกต้อง ตรวจสอบ ส่งขอ้ มูลกลับ ควำมถกู ตอ้ ง ใหใ้ หฝ้ ่ำย ขอ้ มลู ตำ่ งๆ แก้ไข ถูกตอ้ ง

8 ละเอยี ดงาน มาตรฐานคุณภาพงาน เอกสารท่เี กยี่ วขอ้ ง ผรู้ บั ผดิ ชอบ สอบ 1. ขอ้ มูล สว่ นขอ้ ควำม พระรำชบญั ญตั ิ วำ่ เฉลิมเกียรติ ถูกต้อง เวบ็ ไซตต์ ้องมีควำมถูกตอ้ ง ด้วยกำรกระทำ ดสี ม อมูลเอกสำร ของขอ้ มลู ร้อยละ 100 ควำมผิดเกยี่ วกับ ระกอบ 2. ขอ้ มูล URL หรือ LINK คอมพิวเตอร์ พ.ศ. กำรเชอื่ มโยงตอ้ งสำมำรถ 2550 และท่แี ก้ไข เชือ่ มโยงได้อยำ่ งถูกต้อง เพ่ิมเตมิ 3. ข้อมูลรหัสผ่ำน (User & Password) เพอื่ เขำ้ ใช้ ฐำนขอ้ มูลทดลองใช้ ตอ้ ง สำมำรถเขำ้ ระบบฐำนขอ้ มลู ได้อยำ่ งถูกต้อง 4. เอกสำรประเภท PDF ต้องแสดงผลได้อยำ่ งถูกตอ้ ง 5. ขอ้ มลู ภำพ ทีไ่ ด้รบั ตอ้ ง สำมำรถเปดิ แสดงผลใน โปรแกรมไดอ้ ย่ำงถกู ตอ้ งและ ไมล่ ะเมดิ ลขิ สิทธติ์ ำม พ.ร.บ. คอมพิวเตอร์ 2550 และ แกไ้ ขเพ่ิมเติม 8

ที่ ผังกระบวนการ ระยะเวลา ราย 3 5-10 นำที ใหม้ ควำ ในเร ทเี่ รีย ออกแบบหนำ้ ไม่ต้อง ควำ เว็บไซต์ใหม่หรือไม่ ออกแบบ ภำพ เวบ็ ไ ออกแบบ

9 ยละเอียดงาน มาตรฐานคุณภาพงาน เอกสารทเี่ ก่ยี วข้อง ผ้รู ับผดิ ชอบ มี 1. รูปแบบของเว็บไซต์ 1. เวบ็ ไซตร์ ปู แบบ เฉลมิ เกียรติ ำมเหมำะสม สำมำรถแสดงผลแบบ กำรออกแบบ ดสี ม ร่ืองใชส้ ี Responsive WEB Design (web Tiles for ยบงำ่ ยและ คือสำมำรถแสดงผลได้ UX Designers) ำมสมดลุ ของ 2. เว็บไซต์ พรวมของ 1.1 แสดงผลแบบหนำ้ จอ กำรออกแบบสี ไซต์ คอมพิวเตอร์ท่ัวไป 3. เวบ็ ไซต์ กำรออกแบบ 1.2 แสดงผลแบบหนำ้ จอ Layout ต่ำง ๆ แทบเล็ต (768 px) 1.3 แสดงผลแบบหนำ้ จอ มือถือ (360 px) 9

ที่ ผงั กระบวนการ ระยะเวลา 4 10-60 นำที 1 ด I P ตรวจสอบวำ่ ตอ้ ง ไม่ตอ้ ง ตกแต่งภำพหรือไม่ ตกแต่ง ตกแต่งภำพ ภำพ

10 รายละเอยี ดงาน มาตรฐานคุณภาพงาน เอกสารทีเ่ กย่ี วข้อง ผู้รับผดิ ชอบ 1. ตกแต่งภำพ 1. รูปแบบของภำพท่ี 1. เว็บไซตใ์ หบ้ ริกำร เฉลมิ เกียรติ ดว้ ยโปรแกรม นำไปแสดง ได้แก่ ดำวน์โหลดภำพฟรี ดีสม Illustrator หรอื Format PNG และ 2. พ.ร.บ.คอมพิวเตอร์ Photoshop JPG 2560 2. ขนำดควำมละเอียด 3. สญั ญำอนุญำต ภำพ 72 dpi (จุดต่อ ครีเอทีฟคอมมอนส์ ตำรำงนว้ิ ) (Creative Commons Licence: CC) 10

ที่ ผงั กระบวนการ ระยะเวลา เ 5 10-60 นำที โ ต ตรวจสอบวำ่ ต้อง ไม่ต้อง เ เขียน Script เขยี น ถ Script เ Program หรอื ไม่ Program จ ส เขียน Script W Program ภ J

11 รายละเอยี ดงาน มาตรฐานคุณภาพงาน เอกสารที่เกีย่ วขอ้ ง ผู้รับผดิ ชอบ เขยี นโปรแกรม 1. PHP เวอร์ชน่ั 1. เว็บไซต์ เฉลมิ เกียรติ โดยเรียกใชฟ้ ังชนั่ ตำ่ งๆ ของระบบ 7.0.22 ให้บรกิ ำรควำมรู้ ดสี ม เพ่อื แสดงผลท่ี ถกู ตอ้ งและสวยงำม 2. JS เวอร์ชน่ั ES5 ทั่วไปภำษำ PHP เพ่อื แสดงทีถ่ กู ตอ้ ง จำกฐำนข้อมลู ขน้ึ ไป และ JavaScript สว่ นตำ่ งๆ ของ WordPress โดยใช้ 2. เวบ็ ไซต์ ภำษำ PHPและ JavaScript ให้บริกำรควำมรู้ ทั่วไป WordPress 11

ท่ี ผังกระบวนการ ระยะเวลา 1 6 15-60 นำที เ 2 พฒั นำหนำ้ เวบ็ ไซต์ ใ เ 3 เ 4 เ อ 5 ๆ ท

12 รายละเอยี ดงาน มาตรฐานคุณภาพงาน เอกสารท่ีเกยี่ วข้อง ผรู้ ับผดิ ชอบ 1. เข้ำระบบ 1. สำมำรถแสดงผลได้ 1. มำตรฐำน เฉลมิ เกียรติ เว็บไซต์ ถูกต้องตำมมำตรฐำน Responsive Web ดีสม 2. สรำ้ งเพจเว็บไซต์ กำรแสดงผลแบบ Design ใหม/่ แก้ไขเพจ (Responsive Web 2. มำตรฐำนกำร เวบ็ ไซตเ์ ก่ำ Design) แสดงผลของ 3. คลิกส่วนเมนู โปรแกรม เพ่อื ทำเว็บไซต์ 1.1 แสดงผลแบบ บรำวเซอรต์ ำ่ ง ๆ 4. สร้ำงโครงสร้ำง หนำ้ จอคอมพวิ เตอรไ์ ด้ Chrome, Firefox, เวบ็ ไซตต์ ำมท่ี สมบูรณ์ Internet ออกแบบ Exporer, Safari 5. เลือกฟงั ชนั่ ต่ำง 1.2 แสดงผลบน และOpera ๆ วำงตำมโครงสรำ้ ง หน้ำจออปุ กรณพ์ กพำ ทีส่ รำ้ งไว้ ไดอ้ ยำ่ งสมบรู ณ์ 2. รองรบั ฺกำรแสดงผล Browser ประเภทประ ต่ำง ๆ อยำ่ งน้อย Chrome, Firefox, Internet Exporer และ Safari 12

ที่ ผังกระบวนการ ไม่ถูกตอ้ ง ระยะเวลา รายล 7 5-10 นำที 1. ท ตรวจสอบ เวบ็ ไซ ควำมถูกตอ้ ง กอ่ นน จริง ถูกตอ้ ง หมำย ตอ้ งเข สคริป ตอ้ งใ มำกก

13 ละเอียดงาน มาตรฐานคณุ ภาพงาน เอกสารท่ีเก่ียวขอ้ ง ผู้รับผดิ ชอบ ทดสอบหนำ้ 1. สำมำรถแสดงผลได้ 1. มำตรฐำน เฉลิมเกยี รติ ซตท์ สี่ ร้ำงข้นึ ถกู ตอ้ งตำมมำตรฐำน Responsive Web ดีสม นำไปใช้งำน กำรแสดงผลแบบ Design (Responsive Web 2. มำตรฐำน ยเหตุ หำก Design) กำรแสดงผลของ ขียนภำษำ โปรแกรมบรำวเซอร์ ปเพิ่มอำจ 1.1 แสดงผลแบบ ต่ำง ๆ Chrome, ใชเ้ วลำ หน้ำจอคอมพวิ เตอรไ์ ด้ Firefox, Internet กว่ำน้ี สมบูรณ์ Exporer, Safari และ Opera 1.2 แสดงผลบน หน้ำจออปุ กรณ์พกพำได้ อย่ำงสมบูรณ์ 2. รองรบั กฺ ำรแสดงผล Browser ประเภทประ ตำ่ ง ๆ อยำ่ งนอ้ ย Chrome, Firefox, Internet Exporer และ Safari 13

ท่ี ผังกระบวนการ ระยะเวลา รายละเอียดงาน 8 5 นำที 1. คลิกท่ี Dash Bo นำเว็บไซตท์ พ่ี ฒั นำข้นึ เผยแพรบ่ น ของ CMS WordPr เครอื ข่ำยอนิ เทอรเ์ น็ต 2. ไปทหี่ นำ้ เว็บไซต CMS WordPress คลิกปุ่ม Publish เพ แสดงผลบนอนิ เทอ

14 มาตรฐานคุณภาพงาน เอกสารที่เกีย่ วข้อง ผรู้ ับผิดชอบ oard 2.1 เว็บไซตส์ ำมำรถแสดงผลได้บน มำตรฐำน เฉลมิ เกยี รติ ress Web Browser บนเครอื่ ง desktop กำรแสดงผลแบบ ดสี ม ต์ ตำมวตั ถุประสงคข์ องผสู้ ง่ ข้อมูล Responsive Web แล้ว 2.2 เว็บไซตต์ อ้ งสำมำรถแสดงผล Design พ่อื บนอุปกรณ์พกพำไดอ้ ยำ่ งถูกต้อง อร์เนต็ และสมบูรณ์ 2.3 รองรบั ฺกำรแสดงผล Browser ประเภทต่ำง ๆ อยำ่ งน้อย Chrome, Firefox, Internet Exporer และ Safari 14

ท่ี ผงั กระบวนกำร ไม่ถูกตอ้ ง ระยะเวลำ 9 3 ช.ม. ผสู้ ง่ ตรวจสอบ ควำ ควำมถูกต้อง ทแ่ี ส กำรแสดงผล - YES ถูกตอ้ ง ต่อไ 10 - NO เวบ็ ไซตแ์ สดงผล ข้นั ต อยำ่ งถกู ตอ้ ง เวบ็ ไ ระยะเวลำ เว็บไ ตำม อินเท กำหนด ระย ของขอ้ มูล ขอ้ ม จบกำรทำงำน

15 รำยละเอยี ดงำน มำตรฐำนคณุ ภำพงำน เอกสำรที่เกย่ี วขอ้ ง ผ้รู ับผดิ ชอบ ขอ้ มูลที่จัดสง่ ให้ งข้อมลู ตรวจสอบ ขอ้ มลู ทแ่ี สดงผลบน บคุ ลำกร ำมถูกตอ้ งของขอ้ มูล เว็บไซตม์ คี วำมถกู ต้อง สำนกั หอสมดุ สดงบนเว็บไซต์ ครบถ้วนสมบรู ณ์ (ผสู้ ง่ ข้อมลู ) S เผยแพรข่ ้อมูล รอ้ ยละ 100 ไป กลับไปแกไ้ ขใน ตอนพฒั นำหนำ้ ไซต์ ไซตเ์ ผยแพรบ่ น 1. เว็บไซต์สำมำรถ 1. เก็บข้อมลู ที่ เฉลิมเกยี รติ ทอรเ์ น็ตตำม แสดงผลไดอ้ ย่ำงถูกต้อง สำมำรถนำไปใช้ ดีสม ยะเวลำที่กำหนดตำม 2. เวบ็ ไซต์สำมำรถ ครัง้ ตอ่ ไป เช่น มลู แสดงผลบนฺ Browser ภำพทตี่ กแตง่ และ ประเภทตำ่ ง ๆ ไดอ้ ย่ำง ภำษำสครปิ ต์ที่ใช้ ถูกตอ้ ง ทำเวบ็ ไซต์ 3. สำมำรถแสดงตำม 2. ปิด Record ลง มำตรฐำน Responsive บันทกึ สถติ กิ ำรทำ Web Design เวบ็ ไซต์ 15

16 ขั้นตอนการปฏบิ ตั ิงาน ขั้นตอนกำรปฏิบตั งิ ำน กำรบริหำรจดั กำรข้อมูลเพ่ือเผยแพร่บนเวบ็ ไซต์ของสำนกั หอสมุด มีรำยละเอยี ดในกำรปฏิบัติงำน ดงั น้ี 1. รับข้อมลู จำกผสู้ ่งข้อมูลภำยในส่วนงำน โดยไดร้ ับมอบหมำยจำก ผ้อู ำนวยกำร สำนักหอสมดุ ในกำรทำกำรเชื่อมเว็บไซต์ PULINET 2019 2. ตรวจสอบควำมถกู ต้อง สอบถำม URL เว็บไซต์ PULINET 19 จำกผู้จดั ทำ จำกน้ันทดสอบเขำ้ เว็บไซตโ์ ดยพิมพ์ URL ที่ Web Browser ภำพที่ 4 เขำ้ เวบ็ ไซต์โดยพมิ พ์ URL ทเี่ บำร์เซอร์

17 3. ออกแบบเว็บไซต์ และตกแต่งภำพ ภำพท่ี 5 ใช้โปรแกรม Illustrator ในกำรออกแบบภำพเพื่อทำเช่ือมโยงเวบ็ ไซต์ 3.1 ส่งออก (Export) ไฟล์เพ่ือนำไปใชบ้ นเว็บไซต์ ภำพท่ี 6 ส่งออก (Export) ไฟล์เพ่ือนำไปใช้บนเว็บไซต์

18 3.2 Save as เป็นไฟล์ประเภท PNG ภำพที่ 7 Save as เป็นไฟล์ประเภท PNG 3.3 ต้งั ชอื่ ไฟล์และเลือก ตำแหนง่ ท่ีจะบนั ทึกไฟล์ ภำพที่ 8 ตง้ั ชอ่ื ไฟล์และเลอื ก ตำแหน่ง ท่ีจะบนั ทกึ ไฟล์

19 3.4 บนั ทกึ ข้อมูลเรยี บร้อย ภำพท่ี 9 บนั ทกึ ข้อมูลเรยี บรอ้ ย 4. พัฒนำหน้ำเวบ็ ไซต์ 4.1 เข้ำหน้ำเว็บไซตส์ ำนักหอสมดุ ภำพท่ี 10 หนำ้ เว็บไซตส์ ำนักหอสมุด

20 4.2 เข้ำหนำ้ เว็บไซต์สำนักหอสมุดเพ่ือแก้ไขข้อมูลที่ URL https://www.lib.buu.ac.th/web/wp-login.php เข้ำระบบWordpress พมิ พ์ user และ password ภำพท่ี 11 เข้ำหน้ำเว็บไซต์สำนกั หอสมุดเพื่อแก้ไขข้อมลู 4.3 เขำ้ หน้ำเวบ็ ไซต์เพือ่ แก้ไขข้อมลู ภำพที่ 12 เขำ้ หน้ำเวบ็ ไซต์สำนกั หอสมดุ เพ่ือแก้ไขข้อมูล (ตอ่ )

21 4.4 เป็นทหี่ น้ำตอ้ งกำรแกไ้ ขขอ้ มูล ซง่ึ เปน็ หน้ำแรกของเว็บไซต์ ภำพท่ี 13 หน้ำจอท่ีตอ้ งกำรแก้ไขข้อมลู 4.5 เขำ้ หน้ำแก้ไข ภำพที่ 14 หน้ำแก้ไขขอ้ มลู

22 4.6 กำรแทรก Element สว่ นรูปภำพ ภำพท่ี 15 กำรแทรก Element สว่ นรูปภำพ 4.7 กำรแทรกรูปที่ได้ทำกำรออกแบบไวใ้ นภำพที่ 7 ภำพที่ 16 กำรแทรกรปู ท่ีออกแบบ

23 4.8 กำรนำภำพเขำ้ ระบบ ภำพท่ี 17 กำรนำภำพเข้ำระบบ 4.9 กำรนำภำพแทรกในสว่ นทว่ี ำง element ไว้ ภำพที่ 18 กำรนำภำพแทรกในส่วนทีว่ ำง element

24 4.10 กำรเลอื ก Custum URL เพอ่ื กำหนด URL กำรเชือ่ มโยงของรูปภำพ ภำพท่ี 19 กำรเลือก Custum URL เพื่อกำหนด URL กำรเชอื่ มโยงของรูปภำพ 4.11 พิมพ์ URL ที่ช่องวำ่ ง ภำพท่ี 20 พิมพ์ URL ทีช่ อ่ งว่ำง

25 4.12 คลิกปุ่ม update เพ่อื บนั ทึกข้อมลู ล่ำงซ้ำย ภำพที่ 21 คลิกปุ่ม update เพื่อบนั ทึกข้อมูลล่ำงซ้ำย 4.13 คลกิ ปุ่ม preview เพ่ือทดสอบกำรแสดงผล ภำพท่ี 22 คลิกปุ่ม preview เพือ่ ทดสอบกำรแสดงผล

26 4.14 ทดสอบกำรแสดงผลแบบ Responsive Mode โดยปกตแิ ลว้ ระบบจะแสดงผล 1024x768 ภำพท่ี 23 ทดสอบกำรแสดงผลแบบ Responsive Mode 4.15 ทดสอบแสดงผลบนอุปกรณ์ Tablet (786 px) โดยคลกิ ปมุ่ Tablet ภำพที่ 24 ทดสอบแสดงผล Tablet

27 4.16 กำรแสดงผลแบบ Tablet ภำพที่ 25 กำรแสดงผลแบบ Tablet 4.17 กำรแสดงผลบนอุปกรณ์ Mobile (360 px) ภำพที่ 26 กำรแสดงผลแบบ Mobile (360 px)

28 4.18 เมอ่ื แสดงผลได้ถูกต้องตำมควำมต้องกำรแลว้ คลกิ เมนู Config อย่ดู ำ้ นบนซำ้ ยก่อน เพื่อออกจำกหน้ำจอสร้ำงเวบ็ ไซต์ ภำพท่ี 27 คลิกเมนู Config เพือ่ ออกจำกหน้ำจอสรำ้ งเวบ็ ไซต์ 4.19 คลิกปุม่ Exit Dashboard เพ่ือออกจำกส่วนหน้ำจอ Elementor ภำพท่ี 28 คลกิ ปุ่ม Exit Dashboard

29 4.20 กลับสู่หน้ำจอ Dashboard ภำพที่ 29 กลับสู่หน้ำจอ Dashboard 4.21 ออกจำกระบบ Wordpress ภำพท่ี 30 ออกจำกระบบ Wordpress

30 5. เว็บไซต์ทีพ่ ัฒนำขนึ้ เผยแพรบ่ นเครอื ข่ำยอนิ เทอรเ์ น็ตหรืออนิ ทรำเนต็ ภำพที่ 31 หน้ำเวป็ ไซต์ท่ีพฒั นำข้นึ ตรวจสอบความถกู ต้อง 1. คลกิ ทไ่ี อคอน PULINET 2019 ภำพท่ี 32 คลิกทไ่ี อคอน PULINET 2019

31 2. เว็บไซต์ PULINET 2019 ภำพที่ 33 หนำ้ เว็บไซต์ PULINET 2019

32 การปรับปรุงการบรหิ ารจัดการขอ้ มลู เพือ่ เผยแพร่บนเว็บไซต์ของสานกั หอสมุด การดาเนนิ การปรบั ปรงุ ในสว่ นต่าง ๆ ดงั ต่อไปน้ี 1. กำรปรบั ปรงุ สไลด์ประชำสัมพนั ธห์ น้ำแรก 2. ตำรำงอบรมกำรใชห้ ้องสมุด 3. กำรปรับปรุงขำ่ ว Library News/Events และภำษำอังกฤษ 4. กำรปรบั ปรุงกำรประชำสัมพันธ์แบบ POP-UP 1. สไลดป์ ระชาสัมพนั ธห์ นา้ แรก 1.1 ออกแบบสไลด์ด้วยโปรแกรม Illustrator CC 2018 โดยสไลดท์ ่ีทำกำรออกแบบควรมี ขนำด Width 405 pixels Height 318 pixels ภำพที่ 34 ออกแบบสไลด์ดว้ ยโปรแกรม Illustrator CC 2018 1.2 บันทึกไฟล์สไลด์เป็นรปู แบบ JPG หรือ PNG ภำพที่ 35 บนั ทึกไฟลส์ ไลด์เป็นรปู แบบ JPG หรือ PNG

33 1.3 แกไ้ ขส่วนสไลด์ คลิกปุ่ม Add Item ภำพท่ี 36 แก้ไขส่วนสไลด์ คลิกปุ่ม Add Item 1.4 คลิก Add Item ภำพที่ 37 คลิก Add Item

34 1.5 Upload รูปสไลด์ ขอ้ มูลสไลด์ให้ถกู ต้อง ภำพท่ี 38 Upload รปู สไลด์ 1.6 ใส่ลงิ ค์ (URL) เพ่ือเช่อื มโยงไปยัง URL ทต่ี อ้ งกำร ภำพท่ี 39 ใส่ลงิ ค์ (URL) ไปยัง Page ที่ต้องกำร