คู่มือสำหรับผู้ดูแลระบบ
- คู่มือผู้ดูแลระบบเว็บไซต์สำนักงานก่อสร้างชลประทานขนาดกลางที่ 2
- Plugins ในระบบสำนักงานก่อสร้างชลประทานขนาดกลางที่ 2
คู่มือผู้ดูแลระบบเว็บไซต์สำนักงานก่อสร้างชลประทานขนาดกลางที่ 2
1.การเข้าใช้งานระบบ
การเข้าใช้งานระบบสำนักงานก่อสร้างชลประทานขนาดกลางที่ 2 สามารถเข้าสู่ระบบผ่านทางเว็บเบราว์เซอร์ URL : https://mwd2.rid.go.th แสดงหน้าต่างเข้าสู่ระบบ โดยขั้นตอนการเข้าสู่ระบบดังนี้
- กดที่ URL : https://mwd2.rid.go.th หรือพิมพ์บน Web Address แสดงดังภาพที่ 1
ภาพที่ 1 การเข้าเว็บไซต์
- หลังจากพิมพ์เสร็จเมื่อกดปุ่ม Enter ที่แป้นพิมพ์ ระบบจะดำเนินการไปยังหน้าหลักของเว็บไซต์ แสดงดังภาพที่ 2
ภาพที่ 2 หน้าหลักของเว็บไซต์
การที่จะเข้าใช้ระบบหลังบ้านเพื่อแก้ไขหน้า เพิ่มข่าว เพิ่มเมนู เพิ่มส่วนที่ลิ้งก์ไปหน้าอื่น จะต้องเข้าระบบหลังบ้าน
- วิธีเข้าระบบหลังบ้าน กดที่ URL : https://mwd2.rid.go.th/wp-admin หรือเข้ามาที่หน้าหลักของเว็บไซต์ด้านบนจะมี Web Address ให้พิมพ์ต่อท้ายดังนี้ /wp-admin เพิ่มเข้าไปจากนั้นกดปุ่ม Enter ที่แป้นพิมพ์ แสดงดังภาพที่ 3
ภาพที่ 3 วิธีเข้าระบบหลังบ้าน
- เมื่อ Enter ระบบจะดำเนินการไปหน้าเข้าสู่ระบบหลังบ้านของเว็บไซต์ แสดงดังภาพที่ 4
ภาพที่ 4 หน้าจอเข้าสู่ระบบหลังบ้านของเว็บไซต์
- กรอก Username และ Password จากนั้นคลิก
แสดงดังภาพที่ 5
ภาพที่ 5 หน้าจอการเข้าสู่ระบบ
- เมื่อเข้าสู่ระบบสำเร็จ ระบบจะดำเนินการไปหน้าหลักของระบบสำนักงานก่อสร้างชลประทานขนาดกลางที่ 2 ซึ่งจะมีเมนูแสดงดังภาพที่ 6
ภาพที่ 6 หน้าจอหลักของระบบสำนักงานก่อสร้างชลประทานขนาดกลางที่ 2
2.เมนูหลักสำหรับการปรับแต่งเว็บไซต์
2.1 Pages
- เมนู Pages (หน้า) คือส่วนสำหรับสร้างและจัดการ “หน้าถาวรของเว็บไซต์” ซึ่งใช้แสดงข้อมูลที่มีลักษณะคงที่ ไม่เปลี่ยนแปลงบ่อย
- ภายในเมนู Pages ประกอบด้วย
-
All Pages – แสดงรายการหน้าทั้งหมด
-
Add New Page – สร้างหน้าใหม่
-
- เมื่อคลิกที่ All Pages สำหรับแสดงรายการหน้าทั้งหมดของเว็บไซต์ แสดงดังภาพที่ 7
ภาพที่ 7 เมนู Pages
-
ภายในหน้านี้ประกอบด้วย
-
รายการหน้าทั้งหมด
-
การจัดกลุ่มแบบโฟลเดอร์
-
สถานะของหน้า (Published / Draft)
-
วันที่แก้ไข
-
ผู้สร้าง
-
-
ความหมายของ “โฟลเดอร์” ในเมนู Pages โฟลเดอร์ที่ปรากฏใน All Pages ทำหน้าที่จัดหมวดหมู่หน้าตามโครงสร้างเว็บไซต์จัดหมวดหมู่หน้าตามโครงสร้างเว็บไซต์แบ่งหน้าหลักและหน้าย่อยช่วยให้ค้นหาและแก้ไขได้สะดวกไม่ส่งผลต่อ URL โดยตรง แต่ส่งผลต่อโครงสร้างเมนู
2.1.1 เพิ่มหน้า Pages
- เมนู Add Page แสดงดังภาพที่ 8
ภาพที่ 8 เมนู Add Page
- เมื่อคลิกที่ Add Page แสดงดังภาพที่ 9
ภาพที่ 9 Page
-
Title (ชื่อหน้า) ใช้กำหนดชื่อของหน้า คลิก
ที่มุมขวาบนเพื่อเผยแพร่หน้านี้แสดงดังภาพที่ 10
ภาพที่ 10 Title Page
- หลังจากที่คลิก
แสดงดังภาพที่ 11
ภาพที่ 11 เผยแพร่ Page สำเร็จ
- เมื่อสร้าง Page แล้วกลับไปที่ All Pages จะเห็นว่า Page ที่พึ่งสร้างยังไม่ได้จัดโฟลเดอร์ แสดงดังภาพที่ 12
ภาพที่ 12 โฟลเดอร์ Page
- ถ้าต้องการจัดเรียงหมวดหมู่ให้ Page ที่สร้าง คลิก
แสดงดังภาพที่ 13
ภาพที่ 13 Quick Edit Page
2.1.2 การจัดรูปแบบเนื้อหา Page
การจัดรูปแบบเนื้อหา Page จะต้องใช้ส่วนเสริมที่เรียกว่า Elementor
- การใช้ Elementor หลังสร้าง Page คลิก
แสดงดังภาพที่ 14
ภาพที่ 14 Page Edit with Elementor
2.2 Menus
ภาพที่ 15 Menus
- ภายในหน้าจัดการเมนูประกอบด้วย รายการเมนูที่มีอยู่ โครงสร้างเมนูหลัก รายการ Pages / Posts / Custom Links สำหรับเพิ่มเข้าเมนูดังภาพที่ 16
ภาพที่ 16 จัดการเมนู
2.3 Posts
- โพสต์ (Post) คือเนื้อหาข่าวสารที่เผยแพร่แบบ ตามเวลา เพื่อแจ้งประชาสัมพันธ์กิจกรรม โครงการ ข่าวสาร หน่วยงาน หรือประกาศต่าง ๆ ให้กับผู้เข้าชมเว็บไซต์
- เมนู Posts เข้าโดยคลิกที่
ระบบจะแสดงรายการข่าวทั้งหมดดังภาพที่ 17
ภาพที่ 17 เมนู Posts
2.3.1 Add Posts
- เมนู Add Posts แสดงดังภาพที่ 18
ภาพที่ 18 Add Posts
- เมื่อคลิกที่ Add Post แสดงดังภาพที่ 19
ภาพที่ 19 Post
-
พิมพ์ ชื่อข่าว ลงในช่อง Add Title
-
หมวดหมู่ (Categories) ให้ตรงประเภทข่าว แสดงดังภาพที่ 20
ภาพที่ 20 หมวดหมู่ Post
-
ใส่ รูปภาพปกข่าว (Featured Image) เพื่อให้แสดงบนรายการข่าว คลิกที่
- ภายในหน้า Post จะใส่เนื้อหาข่าว คลิกที่
ตัวอย่างหลังจากคลิก แสดงดังภาพที่ 21
ภาพที่ 21 Post Elementor
Plugins ในระบบสำนักงานก่อสร้างชลประทานขนาดกลางที่ 2
หน้าที่ของ Plugin ที่ใช้ในระบบสำนักงานก่อสร้างชลประทานขนาดกลางที่ 2
1.Ajax Search Lite
- ปลั๊กอินสำหรับ WordPress ที่ใช้สร้างระบบ ค้นหาแบบเรียลไทม์ (Live Search) บนเว็บไซต์ โดยใช้เทคโนโลยี AJAX ทำให้เมื่อผู้ใช้พิมพ์คำค้นหา ระบบจะแสดงผลลัพธ์ทันทีโดยไม่ต้องโหลดหน้าเว็บใหม่
- ตัวอย่างแสดงในเว็บไซต์หน้าของข่าวประชาสัมพันธ์ URL : https://mwd2.rid.go.th/4-ข่าวประชาสัมพันธ์/ข่าวประชาสัมพันธ์ แสดงดังภาพที่ 1
ภาพที่ 1 Ajax Search Lite
2.Ally - Web Accessibility & Usability
- ปลั๊กอินสำหรับเพิ่มความสามารถด้านการเข้าถึงเว็บไซต์ (Accessibility) ช่วยให้ผู้ใช้งานทุกกลุ่ม สามารถใช้งานเว็บไซต์ได้ง่ายขึ้น และช่วยให้เว็บไซต์ผ่านมาตรฐาน WCAG (Web Content Accessibility Guidelines)
- ตัวอย่างแสดงในทุกหน้าเว็บไซต์จะมีสัญลักษณ์
เมื่อคลิกแสดงดังภาพที่ 2
ภาพที่ 2 Ally - Web Accessibility & Usability
3.Contact Form 7
- ปลั๊กอินสำหรับ สร้างแบบฟอร์มติดต่อ (Contact Form) บนเว็บไซต์ เช่น ฟอร์มติดต่อหน่วยงาน ฟอร์มสอบถามข้อมูล หรือฟอร์มสมัครเข้าร่วมกิจกรรม โดยผู้ดูแลสามารถสร้างและปรับแต่งฟอร์มได้ง่ายผ่านระบบหลังบ้านของ WordPress
- ตัวอย่างแสดงในเว็บไซต์หน้าของติดต่อหน่วยงาน URL : https://mwd2.rid.go.th/5-ติดต่อหน่วยงาน/ติดต่อหน่วยงาน แสดงดังภาพที่ 3
ภาพที่ 3 Contact Form 7
4.Download Monitor
- ปลั๊กอินสำหรับ จัดการไฟล์ดาวน์โหลดบนเว็บไซต์ WordPress ช่วยให้ผู้ดูแลสามารถอัปโหลด จัดหมวดหมู่ และให้ผู้ใช้งานดาวน์โหลดไฟล์จากเว็บไซต์ได้อย่างเป็นระบบ เช่น เอกสาร PDF แบบฟอร์มราชการ คู่มือ หรือไฟล์ประกาศต่าง ๆ
-
หน้าที่หลักของปลั๊กอิน Download Monitor
1.จัดการไฟล์ดาวน์โหลด
2.สร้างลิงก์ดาวน์โหลด
3.แสดงรายการไฟล์ดาวน์โหลด
4.นับจำนวนการดาวน์โหลด
5.ควบคุมการเข้าถึงไฟล์ - ตัวอย่างแสดงในเว็บไซต์หน้าของข่าวที่มีเนื้อหา ไฟล์เอกสารเพิ่มเติม แสดงดังภาพที่ 4
ภาพที่ 4 Download Monitor
5.Duplicator
- ปลั๊กอินที่ใช้สำหรับ Backup / Clone / ย้ายเว็บไซต์ WordPress
- วิธีใช้ 1.เข้าหลังบ้านของเว็บไซต์ แล้วหาเมนู Duplicator > Backups
- 2.เมื่อเข้าเมนู Backups แสดงดังภาพที่ 5
ภาพที่ 5 วิธีใช้ปลั๊กอิน Duplicator
- 3.คลิก Create New แสดงดังภาพที่ 6
ภาพที่ 6 วิธีใช้ปลั๊กอิน Duplicator 1
- 4.หลังจากนั้นคลิก Next ขวาล่างเพื่อตรวจสอบเว็บไซต์ว่าสามารถ Backup แสดงดังภาพที่ 7
ภาพที่ 7 วิธีใช้ปลั๊กอิน Duplicator 2
- 5.หลังจากนั้นกด Build เพื่อเริม Backup เว็บไซต์
6.Elementor
- ปลั๊กอินสำหรับสร้างและออกแบบหน้าเว็บไซต์ WordPress แบบ Page Builder (ลาก-วาง) ผู้ใช้งานสามารถออกแบบหน้าเว็บได้โดยไม่ต้องเขียนโค้ด เช่น HTML หรือ CSS โดยใช้การลากองค์ประกอบต่าง ๆ มาวางบนหน้าเว็บ
- ตัวอย่างการใช้งานจะขึ้นเมื่อกด Edit with Elementor เมนูด้านซ้ายแสดงองค์ประกอบที่สามารถนำมาปรับแต่งเว็บไซต์ แสดงดังภาพที่ 8
ภาพที่ 8 Elementor
7.ElementsKit Lite
- เป็นปลั๊กอินเสริมสำหรับ Elementor ที่ช่วยเพิ่มเครื่องมือและองค์ประกอบ (Widgets) ให้สามารถออกแบบหน้าเว็บไซต์ได้หลากหลายและสวยงามมากขึ้น โดยไม่ต้องเขียนโค้ด เพิ่ม Widget สำหรับ Elementor
- ตัวอย่างการใช้งาน องค์ประกอบจะเพิ่มมาใน Elements แสดงดังภาพที่ 9
ภาพที่ 9 ElementsKit Lite
8.Essential Addons for Elementor
- Essential Addons for Elementor เป็นปลั๊กอินเสริมของ Elementor ที่ช่วยเพิ่ม Widgets และ Template สำหรับออกแบบหน้าเว็บไซต์ ทำให้ผู้ใช้งานสามารถสร้างหน้าเว็บที่มีฟังก์ชันและรูปแบบมากขึ้นโดยไม่ต้องเขียนโค้ด
- ตัวอย่างการใช้งาน องค์ประกอบจะเพิ่มมาใน Elements แสดงดังภาพที่ 10
ภาพที่ 10 Essential Addons for Elementor
9.GDPR Cookie Compliance
- ปลั๊กอินสำหรับ WordPress ที่ใช้ในการ แจ้งเตือนและขอความยินยอมการใช้คุกกี้ (Cookie Consent) จากผู้ใช้งานเว็บไซต์ เพื่อให้เว็บไซต์สอดคล้องกับกฎหมายคุ้มครองข้อมูลส่วนบุคคล เช่น GDPR และ PDPA
- ตัวอย่างแสดงอยู่ในหน้าหลักเมื่อเป็นผู้ใช้ใหม่ แสดงดังภาพที่ 11
ภาพที่ 11 GDPR Cookie Compliance
10.Image Optimizer - Compress, Resize and Optimize Images
- ปลั๊กอินสำหรับ WordPress ที่ใช้ในการ ปรับขนาดและบีบอัดรูปภาพบนเว็บไซต์ เพื่อให้ไฟล์ภาพมีขนาดเล็กลง ทำให้เว็บไซต์โหลดได้เร็วขึ้น และช่วยประหยัดพื้นที่จัดเก็บบนเซิร์ฟเวอร์
-
ตัวอย่างการใช้งานบนเว็บไซต์ ปลั๊กอินนี้ทำงานกับรูปภาพทั้งหมดในเว็บไซต์ โดยจะทำงาน อัตโนมัติเมื่อมีการอัปโหลดรูปภาพใหม่
11.LiteSpeed Cache
- ปลั๊กอินสำหรับ WordPress ที่ช่วย เพิ่มความเร็วและประสิทธิภาพของเว็บไซต์ โดยใช้เทคนิคการแคช (Cache) และการปรับแต่งไฟล์เว็บไซต์ ทำให้หน้าเว็บโหลดได้เร็วขึ้น ลดภาระการทำงานของเซิร์ฟเวอร์ และช่วยปรับปรุงประสบการณ์ของผู้ใช้งาน
- ตัวอย่างการใช้งานบนเว็บไซต์ ปลั๊กอิน LiteSpeed Cache ทำงานกับหน้าเว็บทั้งหมด ทำงาน เบื้องหลังระบบ เพื่อเพิ่มความเร็วในการโหลดเว็บไซต์
12.Popup Maker
- ปลั๊กอินสำหรับสร้าง Popup (หน้าต่างเด้ง) บนเว็บไซต์ WordPress
- ตัวอย่างการใช้งานบนเว็บไซต์ เมื่อเข้าเว็บไซต์ครั้งแรก แสดงดังภาพที่ 12
ภาพที่ 12 Popup Maker
13.Prime Slider
- ปลั๊กอินเสริมสำหรับ Elementor ที่ใช้สำหรับ สร้างสไลด์ (Slider / Carousel) บนเว็บไซต์ WordPress โดยช่วยให้สามารถแสดงภาพ ข่าว หรือเนื้อหาแบบเลื่อนอัตโนมัติได้อย่างสวยงาม โดยไม่ต้องเขียนโค้ด
- ตัวอย่างการใช้งานบนเว็บไซต์อยู่ในหน้าหลัก แสดงดังภาพที่ 13
ภาพที่ 13 Prime Slider
14.PublishPress Capabilities
-
ปลั๊กอินสำหรับ จัดการสิทธิ์การใช้งาน (Permissions) และบทบาทผู้ใช้ (User Roles) ในเว็บไซต์ WordPress ช่วยให้ผู้ดูแลระบบสามารถกำหนดได้ว่า ผู้ใช้แต่ละกลุ่มสามารถทำอะไรได้บ้างในเว็บไซต์
- ปลั๊กอินนี้เหมาะสำหรับเว็บไซต์ที่มีผู้ใช้งานหลายคน เช่น เว็บไซต์องค์กรหรือหน่วยงานราชการ ที่ต้องมีการแบ่งหน้าที่การทำงานอย่างชัดเจน
15.Redirection
-
ปลั๊กอินสำหรับ จัดการการเปลี่ยนเส้นทางของลิงก์ (URL Redirect) ในเว็บไซต์ WordPress โดยใช้สำหรับเปลี่ยนเส้นทางจากลิงก์เดิมไปยังลิงก์ใหม่โดยอัตโนมัติ เพื่อป้องกันปัญหา หน้าเว็บไม่พบ (404 Not Found) และช่วยให้ผู้ใช้งานเข้าถึงข้อมูลได้อย่างถูกต้อง
- ปลั๊กอินนี้มีประโยชน์มากเมื่อมีการ ย้ายหน้าเว็บ เปลี่ยน URL หรือปรับโครงสร้างเว็บไซต์
16.Royal Elementor Addons
-
ปลั๊กอินเสริมสำหรับ Elementor ที่ช่วยเพิ่ม วิดเจ็ต (Widgets) และฟังก์ชันการออกแบบหน้าเว็บไซต์ ให้สามารถสร้างหน้าเว็บที่มีความสวยงามและมีลูกเล่นมากขึ้น โดยไม่ต้องเขียนโค้ด
-
ปลั๊กอินนี้ถูกใช้เพื่อช่วยในการออกแบบหน้าเว็บไซต์ให้มี องค์ประกอบเพิ่มเติม เช่น แกลเลอรี ปุ่ม เอฟเฟกต์ และเลย์เอาต์ต่าง ๆ
- ตัวอย่างการใช้งาน องค์ประกอบจะเพิ่มมาใน Elements แสดงดังภาพที่ 14
ภาพที่ 14 Royal Elementor Addons
17.Ultimate Addons for Elementor (UAE)
- ปลั๊กอินเสริมสำหรับ Elementor ที่ช่วยเพิ่ม วิดเจ็ต (Widgets) และเครื่องมือออกแบบหน้าเว็บ ให้กับ Elementor เพื่อให้สามารถสร้างหน้าเว็บไซต์ที่มีรูปแบบและลูกเล่นหลากหลายมากขึ้น โดยไม่ต้องเขียนโค้ด
- ปลั๊กอินนี้ช่วยให้ผู้ดูแลเว็บไซต์สามารถออกแบบหน้าเว็บได้ง่ายขึ้น และเพิ่มองค์ประกอบต่าง ๆ ที่ Elementor ปกติไม่มีให้ใช้งาน
- ตัวอย่างการใช้งาน องค์ประกอบจะเพิ่มมาใน Elements แสดงดังภาพที่ 15
ภาพที่ 15 Ultimate Addons for Elementor (UAE)
18.Wicked Folders
- ปลั๊กอินสำหรับ จัดระเบียบไฟล์ โพสต์ และหน้าต่าง ๆ ใน WordPress ให้เป็นโฟลเดอร์ (Folder) เพื่อให้ผู้ดูแลเว็บไซต์สามารถจัดการข้อมูลจำนวนมากได้ง่ายขึ้น โดยปกติ WordPress จะไม่มีระบบโฟลเดอร์สำหรับจัดเก็บไฟล์หรือเนื้อหา แต่ปลั๊กอินนี้ช่วยเพิ่มระบบ จัดหมวดหมู่แบบโฟลเดอร์เหมือนในคอมพิวเตอร์
- ตัวอย่างการใช้งานจะอยู่หลังบ้าน แสดงหน้าทั้งหมด
แสดงดังภาพที่ 16