1.
คูมอ
 ื
โปรแกรมการจัดการ
Website สําเร็จรูป
Joomla

2. คํานํา
คูมือ โปรแกรมการจัดการ Web site สําเร็จรูป Joomla จัดทําเพื่อใหผูสนใจ ศึกษาวิธีการใชงาน
เบื้องตน การจัดการงานใน Web site ในสวนที่ตนเองสนใจไดดวยตนเอง Joomla เปนระบบบริหารจัดการ
web site (content management system : CMS) ระบบบริหารจัดการเว็บไซต ซึ่งเปนระบบทีนํามาชวย ่
ในการสรางและบริหารเว็บไซตแบบสําเร็จรูป โดยในการใชงาน CMS นั้นผูใชงานแทบไมตองมีความรูใน
ดานการเขียนโปรแกรม ก็สามารถสรางเว็บไซตได โดยที่ตัว CMS เองมีโปรแกรมประยุกต แบบพรอมใช
งานอยูภายในมากมาย อาทิ ระบบจัดการบทความและขาวสาร (News and Story), ระบบจัดการสมาชิก
(Member), ระบบจัดการรูปภาพ (Media Manager), ระบบจัดการไฟลดาวนโหลด (Download), ระบบ
จัดการปายโฆษณา(Banner) และตรวจสอบสถิติความนิยมในเว็บไซต (Tracking and Statistics) เปนตน
ระบบการจัดการเวปไซต CMS ในลักษณะเดียวกันนี้มี โปรแกรม Mambo โปรแกรม Joomla และ
mambo แตกอนเปนทีมพัฒนาเดียวกัน ซึ่งการใชงานจะคลายกันมากความสามารถของ Joomla นั้น จะชวย

ใหผูใชงานสามารถพัฒนาเวปไซตหรืออัพเดทขอมูลขาวสารของตนเองไดโดยไมตองใชเครื่องเดิม โดย
สามารถจัดการผานเว็ปไซตไดทุกที่ (สําหรับที่สามารถใชInternet ไดเทานั้น)
จัดทําโดย
นาบวริศ คุมพงษ 48051752
นายรุงโรจน พงษโสพณ 48051660

นางสาวสิตา กังวานพณิชย 48052186

3. -1-
แนะนําโปรแกรม Joomla
"joomla" เปนระบบบริหารจัดการเว็บไซต (content management system: cms) ที่ชวยให
การพัฒนาเว็บไซตเปนเรื่องงายและรวดเร็ว สามารถติดตั้งใชงานและอัพเดทขอมูลไดทุกที่ทุกเวลา
ตามตองการ โปรแกรม joomla จะแบงเว็บไซตออกเปนสองสวนหลัก ๆ คือ
frontend คือสวนที่แสดงผลใหกับผูเขาชมเว็บไซต หรืออีกนัยหนึ่งก็คือเนื้อหาของ
เว็บไซตนั่นเอง
backend คือสวนการจัดการเนื้อหารวมถึงโครงสรางของเว็บไซต หรือเรียกอีกชื่อหนึ่งวา
สวน administrator
- สวนของ frontend-

4. -2-
-สวนของ backend-
เราสามารถทําความเขาใจไดงาย ๆ ก็คือสวนของ frontend เปนสวนของเว็บไซตที่คนอื่นจะ
เขามาดู สําหรับสวน backend จะเปนสวนใหผูดูแลเว็บไซตเขาไปแกไขขอมูลตาง ๆ นั่นเอง

5. -3-
WORKSHOP 1
การติดตั้ง Joomla [บน Windows]
วิธีติดตัง Joomla
้
การติดตั้ง Joomla ที่จําลองเครื่องเปนเซิรฟเวอรดวย Appserv จากการทดลองติดตั้งพบวา
Joomla มีความตองการทั่วๆไป ตามประสา การทํางานบน web base ดังนี้
1. Apache webserver
2. php Script Language
3. MySQL Database
แตถาใหสะดวกก็ติดตั้ง AppServ ที่ทําหนาที่จําลองเครื่องเปนเว็บเซิฟเวอร และมีชุด
โปรแกรมดังกลาวติดตั้งใหพรอมอยูแลวดวยไปเลยครับ
การติดตั้ง Joomla ผานเว็บเบราเซอร
ในที่นี้จะติดตั้งบน windows ใช AppServe จําลองเปนเซิฟเวอร ซึ่งจะมี PHP, MySQL,
PhpMyAdmin มาใหอยูแลว
1. ดาวนโหลด JoomlaInstallation เวอรชั่น 1.0.7
2. แตกไฟล ไวในไดเรกทอรีที่ของ web server ที่จะใช run
สรางไดเรกทอรี joomla ไวที่ c:/AppServ/www จะได c:/AppServ/www/joomla
แตกไฟลในไดเรกทอรีนี้
เปลี่ยนโหมดไดเรกทอรี joomla ใหสามารถ read,write,execute ได โดย
คลิ้กขวาที่โฟลเดอร joomla > properties
คลิ้กตรง Read Only ออก > apply > ok ดังภาพ

6. -4-
3. เมื่อเปดดูภายในไดเรกทอรี /joomla จะพบหลายไฟลและหลายไดเรกทอรี ดังภาพ
4. เขาไปที่ "http://localhost/phpmyadmin" จากนันกรอกยูสเซอรและพาสเวิรดที่ได
้
กําหนดไวตอนติดตั้ง AppServ จากนันสรางฐานขอมูลเปลาๆ ชื่ออะไรก็ได ในที่นี้ใชชื่อ joomla_db
้

7. -5-
5. แกไขไฟล configuration.php-dist ดังนี้
$mosConfig_offline = '0';
$mosConfig_host = 'localhost'; // This is normally set to localhost
$mosConfig_user = 'yourUser'; // MySQL username
$mosConfig_password = 'yourPassword'; // MySQL password
$mosConfig_db = 'joomla_db'; // MySQL database name
$mosConfig_dbprefix = 'jos_'; // Do not change unless you need to!
แกไขแลวเปลียน เปนชื่อไฟล configuration.php
่

8. -6-
6. เปด web Browser ขึ้นมาเรียกไปยัง ไดเรกทอรี joomla "http://localhost/joomla"
7. จะเห็นหนาแรก ของการติดตั้ง เปนการตรวจสอบความเรียบรอยของไฟลตางๆ เกี่ยวกับ
การติดตั้ง pre-install check
ทุกอยางควร set ตามคําแนะนํา โดยเฉพาะ ตรง configuration.php ควรเปน writeable
กด Next

9. -7-
8. เขาสูหนาแสดง license
ถาตองการติดตั้ง หลังจากยอมรับขอตกลง กด Next
9. เขาสู ขั้นตอนที่ 1
step-1

10. -8-
ใสคา Hostname ("สวนใหญใช localhost")
ใสคา MySQL? Username (ชื่อ user ที่ใชฐานขอมูล )
ใสคา MySQL? Password (พาสเวริ์ด ที่ใชฐานขอมูล)
ใสชื่อ MySQL? Database name (ชื่อฐานขอมูลที่ใช ในทีนี้ใช "joomla_db")
่
ใส MySQL? table prefix (ใสหรือไมใสกได เปนการตั้งคานําหนาชื่อตารางในฐานขอมูล)
็
กด Next
10. เขาสูขั้นตอนที่ 2
step-2
ใสชื่อเว็บไซต ที่ตองการ ในที่นี้เปน The Home of JoomlaInstallation
กด Next

11. -9-
11. เขาสูขั้นตอนที่ 3
step-3
ยืนยันคาตางๆ ไดแก URL,Path,Admin email,password( จํา หรือแกไขไดตามตองการ)
กด Next
12. เขาสูขั้นตอนที่ 4
step-4
ขั้นตอนสุดทาย ของการติดตั้ง ถาติดตั้งสําเร็จ จะแสดงขอความวา "Congratulations! Joomla is
installed"

12. - 10 -
แสดงชื่อ admin และ password สําหรับการแกไข รายละเอียดของ joomla ซึ่งจะกลาวใน
หัวขอถัดไป
ปุมดานบน ขวามือ คือ View Site และ Administration
ถาเกิดโปรแกรมฟอง ใหแกไข globals.php ก็ไปที่ ไฟล
C/AppServ/www/Joomla/globals.php/ แลวแกไฟลบรรทัด define( 'RG_EMULATION', 1 );
เปน define( 'RG_EMULATION', 0 ); แลวกด Save
สวน php.ini ไปที่ C/WINDOWS/php.ini แลวแกไฟลทบรรทัด register_globals จาก
ี่
On เปน off (โดยใชโปรแกรม Editplus) แลวทําการ restart ; mysql ใหม
ถาเลือก View Site และ Administration ในขณะนีจะพบหนาจอ ดังนี้
้
แสดงวาเราตองไปลบ หรือเปลี่ยนขื่อไดเรกทอรี ใน joomla ที่ชื่อวา installation แลวทําการ
refresh ใหม

13. - 11 -
13. เขาสู JoomlaInstallation ถาเลือก View Site และ Administration (หลังจาก ลบ หรือ
เปลี่ยนขื่อไดเรกทอรี installation )
View site : สําหรับแสดงหนา interface สําหรับ user ของ joomla
Administration : สําหรับหนา interface การปรับแตง แกไข joomla เปนสวนของผูดูแล

ระบบ
14. สิ้นสุดการติดตั้ง joomla

14. - 12 -
WORKSHOP 2
การติดตั้ง Joomla [บน Hosting]
การเตรียมการติดตั้ง
การเตรียมไฟลติดตั้งของ Joomla Open Source จะตองทําการดาวนโหลดไฟติดตั้ง
JoomlaInstallationไดจากเว็ปไซต
http://joomla.org
http://www.joomlasiam.com
http://mamboxchange.com เปนตน
การติดตั้ง Joomla บน Hosting
การติดตั้ง Joomla บน Hosting จะแตกตางจากการติดตั้งบนเครื่องคอมพิวเตอรทั่วไป ที่ทํา
การติดตั้ง Appserv หรือ WMServer โดยในขั้นแคกทานตองคัดลอก ไฟลติดตั้งขึ้นไปไวบน
Hosting โดยการใชโปรแกรม FTP เชน SSH Secure Shell Client, WS_FTP, CuteFTP เปนตน
การคัดลอก หรือการ Upload ไฟลติดตั้ง Joomla ขึ้นไปไวบน Hosting โดยใช (SSH Secure
Shell Client) กอนอื่นจะตองทราบ Username Password ของ Hosting เพื่อที่จะใชในการ Login และ
ตองทําการติดตั้ง SSH Secure Shell Client โดยสามารถดาวนโหลดไดที่ http://www.ssh.com เมื่อ
ไดโปรแกรมแลวจึงทําการติดตั้ง ดังนี้
เมื่อดาวนโหลดโปรแกรมไดแลว ทําการดับเบิ้ลคลิกโปรแกรม แลวโปรแกรมจะทําการ
ติดตั้งโดยขึ้นหนาจอ ดังรูป

15. - 13 -
ทําการเลือกปุม Next แลวจะไดหนาจอ ดังรูป
เมื่ออานเงื่อนไขเสร็จแลว ใหคลิก Yes
ทําการ Next

16. - 14 -
ทําการกด Next
ทําการกด Next
ทําการกด Next

17. - 15 -
รอจนกวาทําการติดตั้งแลวเสร็จจะขึ้นหนาจอ ดังรูป
หนาจอเมื่อติดตั้งโปรแกรมเสร็จเรียบรอยแลว ใหกด Finish เพื่อเสร็จสิ้นการติดตั้ง
เมื่ อ ได ทํ า การติ ด ตั้ ง โปรแกรมเสร็ จ เรี ย บร อ ยขั้ น ตอนต อ ไปคื อ การ Upload File
JoomlaInstallation ขึ้นบน Hosting
ทําการเปดโปรแกรม SSH Secure Shell Client ขึ้นมา ดังรูป

18. - 16 -
ทําการ Connect ไปยัง Hosting โดยกดปุม จะไดหนาถัดไป
หลังจากนันใหใสขอมูล
้
Host Name: (ตองทราบจากเจาของ Hosting)
User Name: (ตองทราบจากเจาของ Hosting)
เมื่อทําการกรอกขอมูลเสร็จเรียบรอยแลว คลิกปุม Connect จะไดหนาจอถัดไป ดังนี้
หนาจอสําหรับใส Password หลังจากใส Password เรียบรอยแลว คลิกที่ปุม OK เพื่อ
Connect เขาสู Hosting หลังจากที่ Connect เรียบรอยแลว จะไดหนาจอถัดไป

19. - 17 -
ทําการคลิกที่ปุม OK อีกครั้ง
เมื่ อ เข า มายั ง ระบบเรี ย บร อ ยแล ว ให ทํ า การสร า ง Folder โดยใช คํ า สั่ ง
$ mkdir public_html สราง Folder public_html แลว ใชคําสั่ง $ ls เพื่อดูวา Folder public_html
ถูกสรางหรือยัง
หลังจากที่ Folder public_html ถูกสรางขึ้นเรียบรอยแลว ใหทําการเปลี่ยน Permission ของ
Folder public_html โดยใชคําสั่ง $ chmod 777 public_html
ขั้นตอนตอไป คือ การ Upload file ขึ้นไปยัง Hosting มีขั้นตอนดังนี้ ไปที่ Window -->
New File Transfer in Current Directory ดังรูป

20. - 18 -
ทําการ Upload File โดยการคลิก JoomlaSiam_1[1].0.12-Stable-Full_Package.tar.gz เมาส
ปุมขวามือ ที่ไฟล Joomla แลวคลิกที่ Upload
เมื่อไฟล Joomla upload ขึ้นไปยัง Hosting เรียบรอยแลว ใหกลับมาที่ ssh ตัวเดิม แลวใช
คําสั่ง $ tar –xzvf ตามดวยชือไฟล เชน $ tar –xzvf JoomlaSiam_1[1].0.12-Stable-
่
Full_Package.tar.gz
รอสักครู แลวใชคําสั่ง ls เพื่อดูวา ดปรแกรมได Unzip เรียบรอยยัง
หลังจากนันใหเปด Browser แลวพิมพ URL ในชอง Address เชน
้
http://www.esanenvi.com จะปรากฏหนาจอแสดงการตรวจสอบขอมูลของ Joomla ขึ้นมาทําการ
เลือก Next ดังรูป

21. - 19 -
ทุกอยางควร set ตามคําแนะนํา โดยเฉพาะ ตรง configuration.php ควรเปน writeable
กด Next

22. - 20 -
เขาสูหนาแสดง license
ถาตองการติดตั้ง หลังจากยอมรับขอตกลง กด Next
เขาสู ขั้นตอนที่ 1
step-1

23. - 21 -
ใสคา Hostname ("สวนใหญใช localhost")
ใสคา MySQL? Username (ชื่อ user ที่ใชฐานขอมูล / Username ที่เขา Hosting )
ใสคา MySQL? Password (พาสเวริ์ด ที่ใชฐานขอมูล / Password ที่เขา Hosting )
ใสชื่อ MySQL? Database name (ชื่อฐานขอมูลที่ใช ในทีนี้ใช "joomla_db")
่
ใส MySQL? table prefix (ใสหรือไมใสกได เปนการตั้งคานําหนาชื่อตารางในฐานขอมูล)
็
กด Next
เขาสูขั้นตอนที่ 2
step-2
ใสชื่อเว็บไซต ที่ตองการ ในที่นี้เปน The Home of JoomlaInstallation
กด Next

24. - 22 -
เขาสูขั้นตอนที่ 3
step-3
ยืนยันคาตางๆ ไดแก URL,Path,Admin email,password( จํา หรือแกไขไดตามตองการ)
กด Next
เขาสูขั้นตอนที่ 4
step-4
ขั้นตอนสุดทาย ของการติดตั้ง ถาติดตั้งสําเร็จ จะแสดงขอความวา "Congratulations! Joomla is
installed"

25. - 23 -
แสดงชื่อ admin และ password สําหรับการแกไข รายละเอียดของ joomla ซึ่งจะกลาวใน
หัวขอถัดไป
ปุมดานบน ขวามือ คือ View Site และ Administration
ถาเลือก View Site และ Administration ในขณะนีจะพบหนาจอ ดังนี้
้
แสดงวาเราตองไปลบ หรือเปลี่ยนขื่อไดเรกทอรี ใน joomla ที่ชื่อวา installation แลวทําการ
refresh ใหม

26. - 24 -
เขาสู JoomlaInstallation ถาเลือก View Site และ Administration (หลังจาก ลบ หรือเปลี่ยน
ขื่อไดเรกทอรี installation )
View site : สําหรับแสดงหนา interface สําหรับ user ของ joomla
Administration : สําหรับหนา interface การปรับแตง แกไข joomla เปนสวนของผูดูแล

ระบบ
14. สิ้นสุดการติดตั้ง joomla

27. - 25 -

28. - 25 -
WORKSHOP 3
สวนประกอบตาง ๆ ภายใน Joomla Administrator
ในการเริ่มตนสรางเวปไซต จะตองเขาสูระบบการจัดการที่เรียกวา Joomla administration
การเขาสูสวนจัดการนี้สามารถทําไดโดย http://address เว็ปไซต/administrator/ ตัวอยางเชน
http://www.esanenvi.com/administrator

29. - 26 -
หลังจาก Login เขามาในสวน administrator แลว จะพบสวนประกอบตางๆ 4 สวน ดังนี้
1. Menubar คือสวนที่แสดงชื่อคําสั่งทั้งหมดของโปรแกรม Joomla
2. Infobar คือ สวนที่แสดงขอมูลรายละเอียดตอไปนี้
- ชื่อของเว็บไซต
- ตําแหนงปจจุบัน (Current Location) ใน Admin Section ที่กําลังใชงานอยู
- จํานวนขอความที่ไดรับจาก Users อื่น ๆ
- จํานวนผูเขาใชงานโปรแกรม Joomla ในขณะนัน ้
- ชื่อผูใชที่ Login เขามา เชน admin

30. - 27 -
3. Toolbar คือ เมนูคําสั่งยอยจะปรากฏหลังจากคลิกเลือกคําสั่งบน Menubar แลว (อาจจะแสดง
จํานวนปุมไมเทากัน เมื่อคลิกเลือกคําสั่งบน menubar)
4. Workspace คือ พื้นที่แสดงการทํางานตาง ๆ ซึ่งอยูดานลาง Menubar, Infobar และ Toolba
ความหมายของปุมคําสั่งตาง ๆ
สราง Content Item, Category, Section
แกไข content item, category, section
เปดใหผูอื่นสามารถเห็นได
ซอนไมใหผูอนสามารถเห็น
ื่
ยาย item ไปยัง Category อื่น หรือ ยาย category ไปยัง Section อื่น
คัดลอก content item, category, section
ลบ
บันทึกและกลับไปยังหนากอนหนา
บันทึกแตยังคงทํางานที่หนาเดิม
ยกเลิกการสรางหรือการแกไข
ยาย Content Item ไปเก็บในสวน Archive
แสดง popup preview การเปลี่ยนแปลงทีไดทําไวกับ item
่
ขนยายไฟลไปเก็บไวในสวน Media Manager

31. - 28 -

32. - 28 -
WORKSHOP 4
โครงสรางการจัดเก็บเนื้อหา / ขาว (Content)
กอนที่จะเริ่มสรางเนื้อหาภายในเว็บไซตนน ควรทําความเขาใจเรื่องความสัมพันธระหวาง
ั้
section หมวดหมูหลัก
category หมวดหมูยอย
content item เนื้อหา ขอมูลหรือบทความ
เราอาจเปรียบ Section เปน Folder ใหญ ซึ่งภายในจะเก็บ Folder ยอยในที่นี้ก็คือ Category
และภายใน Category จะเปนที่เก็บ Content Item หรือไฟลเอกสารและไฟลขอมูลตาง ๆ ดังรูป
ตัวอยางโครงสรางการจัดเก็บเนื้อหา (content)

33. - 29 -
ตัวอยาง
Section Category Content Item
ขาว ขาวประชาสัมพันธ - รับสมัครพนักงานราชการ
- ประกาศผลสอบพนักงาน
ราชการ
ขาวกิจกรรม - สสภ.10 รวมโครงการปลูก
ตนไมเพื่อพอหลวง
ปฏิทินขาว - สสภ.10 จัดอบรมการจัดทํา
web site
โครงการที่นาสนใจ - โครงการจัดอบรม อปท.
1. การจัดการ Section
Section (หมวดหมูหลัก) ทําหนาที่จดเก็บ Category (หมวดหมูยอย)
ั 
• การเขาสูสวนการจัดการ Section
• การสราง Section
• การลบ Section
• การแกไข Section
• การเปดและซอน section
การเขาสูสวนการจัดการ Section (Section Manager) สามารถทําได 2 วิธีดังนี้
วิธีที่ 1
1. คลิก Menubar แลวเลือกคําสั่ง Content => Section Manager

34. - 30 -
วิธีที่ 2
1. คลิก menubar แลวเลือกคําสั่ง Home เพื่อไปที่หนาแรก (สวนของ Control Panel)
2. คลิกปุม Section Manager
เมื่อเขาสูสวนการจัดการ Section โดยวิธีที่ 1 หรือ 2 จะปรากฏสวนแสดงรายละเอียดภายใน Section
Manager ดังรูป
- สวนการจัดการ section (Section Manager) -
การสราง Section สามารถทําได ดังนี้
1. เขาสูสวนการจัดการ Section (section manager)
2. กดปุม จากนั้นจะเขาสูสวนการกําหนดคาตาง ๆ

35. - 31 -
3. กําหนดชื่อของ Section ลงใน Title และ Section Name (ใชชื่อเดียวกันได) และกําหนดระดับของ
ผูที่สามารถเขามาดูในสวนของ Access Level ซึ่งประกอบดวย
- Public ทุกคนสามารถเปดดูได
- Registered เฉพาะผูที่ผานการ Log in เขาระบบสมาชิกจึงจะสามารถเปดดูได
- Special สําหรับผูที่อยูกลุมพิเศษ(กลุมที่แกไขขอมูลได)เทานั้นที่เปดดูได
4. เมื่อกําหนดเสร็จเรียบรอยใหกดปุม หรือ
การลบ Section สามารถทําไดดังนี้
1. เขาสูสวนการจัดการ section (section manager)
2. เช็คเครื่องหมาย √ ของ Section ที่ตองการลบ
3. กดปุม (การลบ Section นั้นภายในตองไมมี Category ใด ๆ อยู)

36. - 32 -
การแกไข Section สามารถทําไดดังนี้
1. เขาสูสวนการจัดการ section (Section Manager)
2. เช็คเครื่องหมาย √ ที่กลองสี่เหลี่ยมหนาชื่อ Section ที่ตองการแกไข
3. กดปุม เพื่อเขาสูการแกไข Section
4. เมื่อแกไขเสร็จเรียบรอยใหกดปุม หรือ
การเปดและซอน Section สามารถทําไดดงนี้ ั
1.เขาสูสวนการจัดการ section (section manager)
2.หากตองการเปด Content ใด ๆ ที่อยูภายใน Section นั้น ใหปรากฏบนเว็บไซต สามารถทําไดโดย
คลิกรูปสัญลักษณ ในคอลัมนของ published และหากไมตองการใหปรากฏบนเว็บไซตใหคลิก
เปลี่ยนเปนรูปสัญลักษณ
2. การจัดการ Category
Category (หมวดหมูยอย) ทําหนาที่จดเก็บ Content Items (เนื้อหา ขอมูลหรือบทความ)
 ั
• การเขาสูสวนการจัดการ Category
• การสราง Category
• การลบ Category
• การแกไข Category
• การเปดและซอน Category

37. - 33 -
การเขาสูสวนการจัดการ Category (Category Manager) สามารถทําได 2 วิธีดังนี้
วิธีที่ 1
1. คลิก Menubar แลวเลือกคําสั่ง Content => Category Manager
วิธีที่ 2
1. คลิก menubar แลวเลือกคําสั่ง Home เพื่อไปที่หนาแรก (สวนของ Control Panel)
2. คลิกปุม Category Manager
เมื่อเขาสูสวนการจัดการ Category โดยวิธีที่ 1 หรือ 2 จะปรากฏสวนแสดงรายละเอียด
ภายใน Category Manager ดังรูป

38. - 34 -
- สวนการจัดการ Category (Category Manager) -
การสราง Category สามารถทําไดดังนี้
1. เขาสูสวนการจัดการ Category (Category manager)
2. กดปุม จากนั้นจะเขาสูสวนการกําหนดคาตาง ๆ

39. - 35 -
3. กําหนดชื่อของ Category ลงใน Category Title และ Category Name (ใชชื่อเดียวกันได)
4. กําหนด Section ที่จัดเก็บ Category นี้
5. กําหนดระดับของผูที่สามารถเขามาดูในสวนของ Access Level ซึ่งประกอบดวย
- Public ทุกคนสามารถเปดดูได
- Registered เฉพาะผูที่ผานการ Log in เขาระบบสมาชิกจึงจะสามารถเปดดูได
- Special สําหรับผูที่อยูกลุมพิเศษ(กลุมที่แกไขขอมูลได)เทานั้นที่เปดดูได
4. เมื่อกําหนดเสร็จเรียบรอยใหกดปุม หรือ
การลบ Category สามารถทําไดดังนี้
1. เขาสูสวนการจัดการ Category (Category manager)
2. เช็คเครื่องหมาย √ ของ Category ที่ตองการลบ
3. กดปุม (การลบ Category นั้นภายในตองไมมี Category ใด ๆ อยู)
การแกไข Category สามารถทําไดดังนี้
1. เขาสูสวนการจัดการ Category (Category Manager)
2. เช็คเครื่องหมาย √ ที่กลองสี่เหลี่ยมหนาชื่อ Category ที่ตองการแกไข
3. กดปุม เพื่อเขาสูการแกไข Category
4. เมื่อแกไขเสร็จเรียบรอยใหกดปุม หรือ
การเปดและซอน Category สามารถทําไดดังนี้
1.เขาสูสวนการจัดการ Category (Category manager)
2.หากตองการเปด Content ใด ๆ ที่อยูภายใน Category นัน ใหปรากฏบนเว็บไซต สามารถทําได
้
โดยคลิกรูปสัญลักษณ ในคอลัมนของ published และหากไมตองการใหปรากฏบนเว็บไซตให
คลิกเปลี่ยนเปนรูปสัญลักษณ

40. - 36 -
3. การจัดการ Content Item
Content Items (เนื้อหา ขอมูลหรือบทความ)
• การเขาสูสวนการจัดการ Content Item
• การสราง Content Item
• การลบ Content Item
• การแกไข Content Item
• การนํา content item แสดงบนหนาแรกของเว็บไซต
• การเปดและซอน Content Item
การเขาสูสวนการจัดการ Content Item (Content Items Manager) สามารถทําได 2 วิธีดังนี้
วิธีที่ 1
1. คลิก Menubar แลวเลือกคําสั่ง Content => All Content Items
วิธีที่ 2
1. คลิก menubar แลวเลือกคําสั่ง Home เพื่อไปที่หนาแรก (สวนของ Control Panel)
2. คลิกปุม Content Items Manager
เมื่อเขาสูสวนการจัดการ Content Item โดยวิธีที่ 1 หรือ 2 จะปรากฏสวนแสดงรายละเอียด
ภายใน Content Items Manager ดังรูป

41. - 37 -
- สวนการจัดการ Content Item (Content Items Manager) -
การสราง Content Item สามารถทําไดดังนี้
1. เขาสูสวนการจัดการ Content Item (Content Items manager)
2. กดปุม จากนั้นจะเขาสูสวนการกําหนดคาตาง ๆ
3. กําหนดชื่อของ Content Item ลงใน Title และ Title Alias (ใชชื่อเดียวกันได)
4. กําหนด section และ Category ที่จัดเก็บ Content Item นี้

42. - 38 -
5. พิมพและใสขอมูลลงในกรอบ Intro Text และ Main Text
6. ระหวางพิมพและใสขอมูลสามารถกดปุม เพื่อเปด pop up แสดง Content Item
7. เสร็จเรียบรอยใหกดปุม หรือ
การลบ Content Item สามารถทําไดดังนี้
1. เขาสูสวนการจัดการ Content Item (Content Items manager)
2. เช็คเครื่องหมาย √ ของ Content Item ที่ตองการลบ
3. กดปุม (การลบ Content Item นั้นภายในตองไมมี Content Item ใด ๆ อยู)
การแกไข Content Item สามารถทําไดดังนี้
1. เขาสูสวนการจัดการ Content Item (Content Items manager)
2. เช็คเครื่องหมาย √ ที่กลองสี่เหลี่ยมหนาชื่อ Content Item ที่ตองการแกไข
3. กดปุม เพื่อเขาสูการแกไข Content Item
4. ระหวางแกไขสามารถกดปุม เพื่อเปด pop up แสดง content item
5. เมื่อแกไขเสร็จเรียบรอยใหกดปุม หรือ
การนํา Content Item แสดงบนหนาแรกของเว็บไซต สามารถทําไดดังนี้
1. เขาสูสวนการจัดการ content item (content items manager)
2. คลิกในคอลัมนของ Front Page ใหแสดงเครื่องหมาย ของ content item ที่ตองการแสดงบน
หนาแรก หากไมตองใหคลิกอีกครั้งใหแสดงเครื่องหมาย
การเปดและซอน Content Item สามารถทําไดดังนี้
1.เขาสูสวนการจัดการ Content Item (Content Items manager)
2.หากตองการเปด Content ใด ๆ ที่อยูภายใน Content Item นั้น ใหปรากฏบนเว็บไซต สามารถทํา
ไดโดยคลิกรูปสัญลักษณ ในคอลัมนของ published และหากไมตองการใหปรากฏบนเว็บไซต
ใหคลิกเปลี่ยนเปนรูปสัญลักษณ

43. - 39 -
WORKSHOP 5
การจัดการผูใช
การจัดการผูใชตองทราบวาผูใชงานใน Joomla มีกี่ระดับ แตละระดับมีหนาที่และแตกตาง
กันอยางไร โดยผูใชงานจะแบงเปน2 กลุมใหญ ดังนี้
1. Front End User
1.1 Registered คือ ผูที่ลงทะเบียน ที่สามารถมองเห็นเนื้อหาบางสวนที่มากกวาปกติ
1.2 Author คือ สามารถสงประกาศขาว และแกไขขาวที่ตัวเองไดสงเขามาได
1.3 Editor คือ สามารถสงประกาศขาว และแกไขขาวของตัวเองและคนอื่นได
1.4 Publisher คือ เปนคนที่สามารถอนุญาตใหขาว สามารถแสดงขาวตอสาธารณขน
ได
2. Back End User
2.1 Manager สามารถจัดการเกียวกับผูใช Module และ Component บางตัวได
่
2.2 Administrator ทําไดทุกอยาง ยกเวนเปลียนคาที่สําคัญบางอยาง และเปลียน
่ ่
รูปแบบไมได
2.3 Super Administrator ทําไดทกอยาง และไมสามารถลบออกได
ุ
ก็จะปรากฏหนานี้

44. - 40 -
ถาตองการเพิ่มขอมูลผูใชใหม ใหคลิกที่ New ตรง Tool ber ดังรูป
ก็จะปรากฏหนาตอไป
หลังจากที่กรอกรายละเอียดของผูใชเรียบรอยแลว ก็มาถึงขั้นตอนการกําหนดระดับของผูใชงานวา
เราตองการใหผูใชงานอยูในระดับไหน สามารถกําหนดไดใน Group ดังรูป
เมื่อทําการกําหนดระดับการใชงานเรียบรอยแลว ขั้นตอนสุดทายตองการที่จะ Block ไมใหใชงาน
หรือไม ถาตองการก็ใหกด Yes แตถาไมตองการให Block ก็กด No


45. - 41 -
การแกไขขอมูลของ User
คลิกเครื่องหมายถูกที่ Name ที่ตองการแกไข แลวคลิกที่ Edit
Tool bar
ทําการแกไขขอมูล แลวกด Seve
การลบ User ที่ไมตองการ
คลิกเครื่องหมายถูกที่ Name ที่ตองการลบ แลวกด Delete ตรง Tool bar ก็เสร็จการลบ User

46. - 42 -
WORKSHOP 6
การติดตั้ง WYSIWYG Editor
ในบทเรียนนี้ จะนําเสนอ WYSIWYG Editor 2 อยาง คือ TinyMCE และ HTML Area3 XTD
1. TinyMCE
การใชงาน TinyMCE สําหรับใสและแกไขขอมูล Content Item การใสและแกไขขอมูลลง
ใน Content จะมีลักษณะคลาย ๆ กับโปรแกรมออกแบบเว็บไซตทั่วไป เชน Macromedia
Dreaweaver โดยจะมีกรอบที่สามารถใสขอมูลสองสวนคือ
สวนแรก Intro Text เปนสวนที่ Content Item จําเปนตองมี อาจจะใสขอมูลทั้งหมดหรือ
ขอความบางสวนที่เกริ่นถึงเนื้อหาใน Content Item ทั้งหมด
สวนที่สอง Main Text เปนสวนที่แสดงเนื้อหาที่เหลือตอจาก Intro Text ทั้งหมด

47. - 43 -
ความหมายของปุมคําสั่งบน Toolbar
ตัวหนา, ตัวเอียง, ขีดเสนใต, ตัวขีดทับ
จัดขอความ ชิดซาย, ชิดขวา, กึ่งกลาง, เต็มบรรทัด
ชนิดตัวอักษร
ขนาดตัวอักษร
ตัดขอความ, คัดลอกขอความ, วางขอความแบบ Plain Text, วางขอความแบบ
Word, เลือกทั้งหมด
สรางรายการแบบสัญลักษณ, สรางรายการแบบลําดับ
ยกเลิก, ทําซ้ํา
ใส Link, นํา Link ออก, ใส Link ภายในหนาเดียวกัน
ใสรูปภาพ
เปด pop up เพือแกไขขอมูลในรูปแบบ HTML
่
คนหาหรือแทนที่
วันที,่ เวลา
รูปอมยิ้ม
สีตัวอักษร, สีพื้นหลังตัวอักษร
ลบรูปแบบที่ถูกกําหนด
ตัวหอย, ตัวยก
ตัวอักษรพิเศษ
เสนคั่น
ใส Flash, ใสไฟล Multimedia (Flash, Quicktime, Shockwave, Windows
Media, Real Media)
ใสตาราง

48. - 44 -
การจัดการตาราง (Table)
การแทรกตาราง
1. ใหกดปุม ที่ Toolbar ของ TinyMCE Editor
2. กําหนดคาตาง ๆ ดังนี้
Columns จํานวนของแถวในแนวตั้ง
Rows จํานวนของแถวในแนวนอน
Cellpadding ระยะหางระหวางชอง Cell กับตัวอักษรภายในชอง
Cell Cellspacing ระยะหางระหวางชอง Cell
Alignment กําหนดใหตารางชิดซาย ขวาหรือกึ่งกลาง
Width, Height กําหนดความกวางและความสูงหนวยเปน pixels
(สามารถเปลี่ยนหนวยเปน % ได โดย เติม % ตอทายคาที่กําหนด) จากนั้น
ใหกดปุม เพื่อแทรกตาราง
3. กดปุม เพื่อแทรกตาราง
การแทรกและลบ Row หรือ Column
1. คลิกชอง Cell
2. เลือกกดปุมคําสั่งบน Toolbar ดังนี้
แทรก Row ใหมตรงดานบน แทรก Column ใหมกอนหนา
แทรก Row ใหมตรงดานลาง แทรก Column ใหมดานหลัง
ลบ Row ลบ Column

49. - 45 -
การรวม ชอง Cell
1. คลิกชอง Cell จากนันกดปุม
้ จะปรากฏสวนกําหนดคาตาง ๆ ดังรูป
2. กําหนดคาการรวมชอง Cell ในสวน Merge table cells
การรวมชอง Cell จะรวมโดยยึดตําแหนงจากชอง Cell ที่เลือกไวไปดานซายในกรณี
Column และดานลางในกรณี Row)
3. กดปุม Update (การรวมจะเริ่มรวมจากทางขวาและดานลาง ของชอง Cell ที่คลิกเลือกไว)
การแยก ชอง Cell
1. คลิกชอง cell ที่ไดถูกรวมไว จากนั้นกดปุม

50. - 46 -
การจัดการรูปภาพและ MOSImage
สามารถเลือกใช Tools ในการจัดการรูปภาพไดแก
• ปุม Images บน Toolbar
• MOSImage
ปุม images บน toolbar
การแทรกรูปภาพ
1. กดปุม ที่ TinyMCE Editor จะปรากฏสวนกําหนดคาตาง ๆ ดังรูป
2. ระบุ Image URL เชน http://esanenvi.com/~nitit.j/images/stories/clock.jpg
3. กําหนด Image description (คําอธิบายรูปภาพ)
4. แลวกดปุม
การปรับขนาดของรูปภาพ มี 2 วิธี
วิธีแรก
1. คลิกที่รูปภาพจะปรากฏจุดสี่เหลี่ยมเล็ก ๆ ตามขอบรูปภาพ
2. ใชเมาสคลิกคางไวแลวลากออกหรือเขา เพื่อปรับขนาดของรูปภาพ
วิธีที่สอง
1. คลิกที่รูปภาพ แลวกดปุม ที่ TinyMCE Editor

51. - 47 -
2. คลิก Tab Appearance แลวกําหนดขนาดของรูปในชอง Dimensions (กวาง x ยาว) มีหนวยเปน
pixels (หากไมระบุความกวาง x ยาว รูปจะแสดงตามขนาดของไฟลรป)
ู
นอกจากนี้ยังสามารถปรับขอความใหลอมรอบรูปภาพในลักษณะตาง ๆ ไดโดยเลือกที่สวนของ
Alignment เมื่อปรับคาตาง ๆ เปนที่เรียบรอยแลวใหกดปุม เพื่อบันทึก
MOSImage
การแทรกรูปภาพ
1. คลิกเมาสเพื่อเลือกตําแหนงที่จะวางรูปภาพภายในกรอบ
2. กดปุม จากนั้นปรากฏขอความ { mosimage } ภายในกรอบ

52. - 48 -
3. คลิกที่ Tab Images เพื่อเปดสวนการใชงาน MOSImage บน Panel ทางดานขวา
4. คลิกเลือกไฟลรูปภาพในกรอบ Gallery Images
5. กดปุม จากนั้นจะปรากฏชื่อไฟลที่เลือกมาในกรอบ Content Images
หากตองการยกเลิกไฟลที่เลือกมา ใหคลิกไฟลรูปภาพในกรอบ Content Images และกดปุม
6. กดปุม
mosimage จะแสดงจํานวนรูปภาพตามจํานวนที่แทรกรูปดวยคําสั่ง รูปภาพที่ถูก
แสดงจะถูกนํามาจาก Content Images
หากตองการเปลี่ยนลําดับภายใน content image สามารถทําไดโดยการกดปุม
และ

53. - 49 -
การปรับคาตาง ๆ ของรูปภาพ
1. คลิกชื่อไฟลที่ตองการปรับคาในกรอบ content images
2. กําหนดคาตาง ๆ ไดแก
Image Align การจัดวางรูปภาพ (ชิดซาย, ชิดขวา, กึ่งกลาง)
Alt Text ขอความที่จะปรากฏเมื่อนําเมาสมาวางบนรูปภาพ
border ขนาดของกรอบรูปภาพ
3. กดปุม

54. - 50 -
2. HTMLArea3 XTD
HTMLArea3 XTD เปน editor ตัวหนึ่งที่ความนิยมและมีความงายในการใชงาน ซึ่ง
ความสามารถมาก และใชงานไดอยางสะดวกสบาย
การติดตั้ง HTMLArea3 XTD จะเหมือนกับ การตัดตั้ง editor ทั่วไป คือ การ install mambots
สมาถทําไดโดย ไปที่ menubar (Installers--> mambots)
จะปรากฏหนานี้
ใหคลิกที่ Browse จะปรากฏหนาจอ ดังนี้

55. - 51 -
เมื่อทําการคลิก Browse จะขึ้นหนาตางใหเราไปที่ Folder ที่เก็บ File
HTMLArea3XTDv11RC1.zip แลวใหคลิกที่ file กด Open
Click ที่ Upload File & Install เพื่อติดตั้ง HTMLArea3XTD หากการติดตั้งไมมีขอผิดพลาดใดๆ
จะปรากฏหนานี้

56. - 52 -
Click ที่ปุม Continue เพื่อเปนการสิ้นสุดการติดตั้ง
หลังจากนัน เพื่อการใชงาน HTMLArea3XTD เปน editor ของ Joomla จะตองมีการตั้งคา โดยทํา
้
ไดดังนี้ โดยไปที่ menuber (site--> Global Configuration) แลวเลือกไปที่ site
เมื่อไปยังหนาการตั้งคา site แลว ใหคลิกที่ Default WYSIWYG Editor: ใหเลือก HTMLArea3
XTD แลวกด Save ที่ toolber

57. - 53 -
เมื่อมีการจัดการเนื้อหา ก็จะปรากฏ editor : HTMLArea3 XTD ใหใช

58. - 54 -
WORKSHOP 7
การนํารูปภาพเก็บลงเว็บไซต (Media Manager)
1. กดปุม
2. จะปรากฏสวนใหเลือกไฟลภายในเครื่อง ในกดปุม Browse
3. กดปุม Upload
จากนั้นชื่อไฟลรูปภาพจะปรากฏใน Gallery Images ของ Tab Images
Media Manager เปนสวนที่ดูแลและจัดการไฟลที่ Upload เขามาเก็บไวที่เว็บไซต สําหรับ
ไฟล ที่ อ นุ ญ าตให ส ามารถ Upload ได จ ะมี ด ว ยกั น 9 ประเภทประกอบด ว ย
doc, xls, ppt, bmp, gif, jpg, png, swf, pdf
Folder ที่จัดเก็บไฟล โปรแกรม Joomla ไดกําหนด folder สําหรับการใชงานมาใหสอง
folder ประกอบดวย
1. banners เปน folder สําหรับจัดเก็บไฟลรูปภาพที่จะถูกนําไปใชเปน Banner
2. stories เปน folder รูปภาพที่ถูกใชกับ MOSImage ซึ่งจะถูกแสดงออกมาในสวน Tab
Images เมื่อมีการแกไข Content Item
• การเขาสู Media Manager
• การยายไปยัง Folder อื่น
• การ Upload ไฟล
• การสราง Folder
• การลบไฟล

59. - 55 -
การเขาสู Media Manager สามารถทําได 2 วิธีดังนี้
วิธีที่ 1
1. คลิก Menubar แลวเลือกคําสั่ง Site => Media Manager
- Media Manager -

60. - 56 -
วิธีที่ 2
1. คลิก menubar แลวเลือกคําสั่ง Home เพื่อไปที่หนาแรก (สวนของ Control Panel)
2. คลิกปุม Media Manager
การยายไปยัง Folder อื่น
1. เขาสู Media Manager
2. คลิก เพื่อเลือก Folder ที่ตองการไป
หากตองการยายไปยัง Folder กอนหนาใหกดปุม
การ Upload ไฟล
1. เขาสู media manager
2. ยายไปยัง Folder ที่ตองการเก็บไฟล
3. กดปุม เพื่อเลือกไฟล
4.กดปุม
การสราง Folder
1. เขาสู media manager
2. ยายไปยัง folder ที่ตองการเก็บ Folder ใหม
3. พิมพชื่อ Folder ที่ตองการสรางในชอง create directory
4. กดปุม
การลบไฟล
1. เขาสู media manager
2. ยายไปยัง folder ที่เก็บไฟลที่ตองการลบ
3. กดปุม ตรงไฟลที่ตองการลบ

61. - 57 -
WORKSHOP 8
การจัดการ Frontpage Manager
การเขาสูสวน Frontpage Manager เพื่อจัดการ Content Item ที่ถูกเลือกมาไวในหนาแรก
ของเว็บไซต สามารถทําได 2 วิธีดังนี้
วิธีแรก
1. คลิก Menubar แลวเลือกคําสั่ง Content => Frontpage Manager
- Frontpage Manager –

62. - 58 -
วิธีที่ 2
1. คลิก menubar แลวเลือกคําสั่ง Home เพื่อไปที่หนาแรก (สวนของ Control Panel)
2. คลิกปุม Front page Manager
การเปดและซอน Content Item ในหนาแรก
1. เขาสูสวน frontpage manager
2. หากตองการให Content Items ปรากฏใหหนาแรกใหคลิกสวน Published ใหเปนรูปสัญลักษณ
และหากไมตองใหปรากฏใหคลิกเปลี่ยนเปนรูปสัญลักษณ

การสลับลําดับของ Content Items ที่แสดงในหนาแรก
1. เขาสูสวน Frontpage Manager
2. ใหคลิกรูปสัญลักษณ หรือ ที่แถว Reorder เพื่อเปลี่ยนลําดับ

63. - 59 -
WORKSHOP 9
การจัดการเมนู (Menu Manager)
Menu เปนสวนที่นําขอมูลของ Content Item ออกมาแสดงบนเว็บไซต เมนูจะมีทั้งหมด 4
รูปแบบ ตาง ๆ ดังนี้
Main Menu (เมนูหลัก ปกติจะปรากฏทางดานซาย)
top menu (เมนูดานบน)
user menu (เมนูสําหรับสมาชิก จะปรากฏเมื่อสมาชิก Login)
Other Menu (เมนูอื่น ๆ)
การจัดการปุมเมนู
• การเขาสูสวนการจัดการเมนู (Menu Manager)
• การสรางปุมเพิ่มบนเมนู
• การลบปุม
• การสลับลําดับปุม
• การเปดและซอนปุม
การเขาสูสวนการจัดการเมนู (Menu Manager)
(ในทีนี้จะเปนการสรางปุมบน main menu)
่
1. คลิก menubar แลวเลือกคําสั่ง menu => mainmenu
เมื่อเขาสูสวนการจัดการ menu จะปรากฏสวนแสดงรายละเอียดภายใน menu manager ดังรูป

64. - 60 -
- สวนการจัดการ menu (Menu Manager) -
การสรางปุมเพิ่มบนเมนู สามารถทําไดดังนี้
1. เขาสูสวนการจัดการเมนู (menu manager)
2. กดปุม
3. เลือกประเภทของปุม (Menu Item)

65. - 61 -
- ประเภทตาง ๆ ของ Menu Item –
4. กดปุม
การลบปุม สามารถทําไดดังนี้
1. เขาสูสวนการจัดการเมนู (Menu Manager)
2. เช็คเครื่องหมาย √ ของ menu ที่ตองการลบ
3. กดปุม (การลบ menu item นั้นภายในตองไมมี menu item ใด ๆ อยู)
การสลับลําดับปุม สามารถทําไดดังนี้
1. เขาสูสวนการจัดการเมนู (menu manager)
2. ใหคลิกรูปสัญลักษณ หรือ ที่แถว reorder เพื่อเปลี่ยนลําดับ

66. - 62 -
การเปดและซอนปุม สามารถทําไดดังนี้
1. เขาสูสวนการจัดการเมนู (Menu Manager)
2. หากตองการใหปุมใด ๆ ปรากฏอยูภายในเมนู สามารถทําไดโดยคลิกรูปสัญลักษณ ใน
คอลัมนของ published และหากไมตองการใหปรากฏบนเมนูใหคลิกเปลี่ยนเปนรูปสัญลักษณ
ความหมายของปุม (Menu Item) ประเภทตาง ๆ
ทําความเขาใจกับชื่อของปุม (Menu Item)
หากสังเกตุชื่อชนิดของปุม (Menu Item) เชน Blog - Content Category
จะสามารถเขาใจไดวารูปแบบของชื่อปุม (Menu Item) จะประกอบดวย [รูปแบบการแสดงขอมูล] -
[ชนิดของกลุมเนื้อหา]
ดังนั้น Blog - Content Category สามารถเขาใจไดวาปุมนี้เมื่อคลิกแลวจะ [แสดงขอมูล
รูปแบบแบบ Blog] - [เนื้อหานํามาจาก Category]
รูปแบบการแสดงขอมูล ไดแก
1. Blog แสดงเนื้อหาเฉพาะในสวน Intro Text เปนบทนําและมี Link เพือใหผูสนใจคลิกอาน
่
เนื้อหาของ Content Item ตอทั้งหมด
2. Table แสดงเฉพาะหัวขอขาวออกมาในรูปแบบตาราง
3. Link แสดงเนื้อหาทั้งหมด
ชนิดของกลุมเนื้อหา ไดแก Section, Category, Content Item, Static Content Item, Url, Component
ตาง ๆ และอื่น ๆ
ปุมบนเมนูจะถูกแบงออกตามกลุมตาง ๆ ดังนี้
• Content
• Components
• Links
• Miscellaneous

67. - 63 -
กลุม Content
Blog - Content Category
ปุมสําหรับ Link ไปยังหนาที่แสดงรายชื่อรวมของ Content Item ภายใน Category ที่เลือก
Blog - Content Category Archive
ปุมสําหรับ Link ไปยังระดับหมวดหมูยอยของเนื้อหา Category ซึ่งจะทําการแสดงลักษณะของ
ขอมูลเหมือนหนาแรก โดยที่ขอมูลดังกลาวถูกกําหนดใหเปน Archive
Blog - Content Section
ปุมสําหรับ Link ไปยังหนาที่แสดงรายละเอียดของ Content Item ภายใน Category ที่เลือกใน
รูปแบบรายละเอียดยอย
Blog - Content Section Archive
ปุมสําหรับ Link ไปยังระดับหมวดหมูหลักของเนื้อหา Section ซึ่งจะทําการแสดงลักษณะของ
ขอมูลเหมือนหนาแรก โดยที่ขอมูลดังกลาวถูกกําหนดใหเปน Archive
Link - Content Item
ปุมสําหรับ Link ไปยัง Content Item
Link - Static Content
ปุมสําหรับ Link ไปยัง Static Content Item
Table - Content Category
ปุมสําหรับ Link ไปยังหนาที่แสดงรายชื่อรวมของ Content Item ภายใน Category ที่เลือกใน
รูปแบบ List
Table - Content Section
ปุมสําหรับ Link ไปยังหนาที่แสดงรายชื่อรวมของ Content Item ภายใน Section ที่เลือกในรูปแบบ
List
กลุม Components
Component
ปุมสําหรับ Components ที่ติดตั้งบนเว็บไซต ซึ่งรวม Components ที่ติดมากับการติดตั้ง Joomla ใน
ครั้งแรก รวมทั้ง Component ของผูพัฒนารายอื่นที่ไดตดตั้งใชงานบนเว็บไซต
ิ
Link - Component Item
ปุมสําหรับ Link ไปยังรายการยอยของ Component
Link - Contact Item
ปุมสําหรับ Link ไปยัง Contact Us

68. - 64 -
Link - Newsfeed
ปุมสําหรับ Link ไปยังเว็บไซตที่ใหบริการดึงขาวมาแสดงบนเว็บไซตของเรา
Table – Contact Category
ปุมสําหรับ Link ไปยัง Contact Us ในลักษณะ List
Table – Newsfeed Category
ปุมสําหรับ Link ไปยังเว็บไซตที่ใหบริการดึงขาวมาแสดงบนหนาเว็บไซตเราในรูปแบบ List หัวขอ
Table – Weblink Category
ปุมสําหรับ Link ไปยัง Weblink Component
กลุม Links
Link - Component Item
ปุมสําหรับ Link ไปยังเนื้อหาของ Component
Link - Contact Item
ปุมสําหรับ Link ไปยังรายการที่อยูสําหรับติดตอ
Link - Content Item
ปุมสําหรับ Link ไปยัง Content Item
Link - Newsfeed
ปุมสําหรับ Link ไปยังรายการเว็บไซตที่ใหบริการดึงขาวมาแสดงบนเว็บไซตของเรา
Link - Static Content
ปุมสําหรับ Link ไปยัง Static Item
Link - Url
ปุมสําหรับ Link URL ตาง ๆ เชน เว็บไซตมหาวิทยาลัยกรุงเทพ
กลุม Miscellaneous
Separator / Placeholder
ปุมสําหรับคั่น Menu ตาง ๆ โดยที่ Menu ประเภทนี้จะไมมีการกําหนด Link ปลายทาง
Wrapper
ปุมสําหรับ Link Wrapper

69. - 65 -
WORKSHOP 10
การติดตั้งและเปลี่ยน Template
เว็บไซตที่ดแลโดยโปรแกรม joomla นั้น สามารถเปลี่ยนรูปแบบเว็บไซต (Template) ได
ู
อยางงายและรวดเรว สําหรับขั้นตอนการจัดการตาง ๆ มีดังนี้
• การเปลี่ยน template
• การติดตั้ง template
• การลบ template ออกจากเว็บไซต
การเปลี่ยน template สามารถทําไดดังนี้
1. คลิก menubar แลวเลือกคําสั่ง Site => Template Manager => Site Templates
เมื่อเขาสูสวน template manager จะปรากฏสวนแสดงรายละเอียดดังรูป
(สามารถทราบไดวาเราเลือกใช template อะไรอยูโดยใหสังเกตุสัญลักษณ ในคอลัมนของ
default)

70. - 66 -
- template manager -
2. คลิกวงกลมเลือก template ที่ตองการเปลี่ยน
3. กดปุม
การติดตั้ง template สามารถทําไดดังนี้
1. คลิก menubar แลวเลือกคําสั่ง Installers => Templates – Site
เมื่อเขาสูสวนการติดตั้ง template จะปรากฏสวนแสดงรายละเอียดดังรูป

71. - 67 -
- สวนการติดตั้ง template -
3. กดปุม เพื่อเลือกไฟล template
4. กดปุม
การลบ template ออกจากเว็บไซต สามารถทําไดดังนี้
1. คลิก menubar แลวเลือกคําสั่ง Site => Template Manager => Site Templates
เมื่อเขาสูสวน template manager จะปรากฏสวนแสดงรายละเอียดดังรูป

72. - 68 -
- template manager –
2. คลิกวงกลมเลือก template ที่ตองการลบออกจากเว็บไซต
3. กดปุม (จะไมสามารถลบ template ออกได หาก template นั้นถูกเลือกใชอยู)
การเรียกดู (Preview) เว็บไซตหลังการแกไข
เมื่อมีการเปลี่ยนแปลงใด ๆ ที่ไดทําขึ้นในสวน administrator สามารถที่จะเปดดูการ
เปลี่ยนแปลงบนเว็บไซต (Frontend) ไดโดย
1. คลิก menubar แลวเลือกคําสั่ง Preview => In New Window
จากนั้นโปรแกรม Joomla จะ popup โปรแกรม Internet Explorer (Web Browser) ขึ้นมาพรอมกับ
เปดเว็บไซต

73. - 69 -
WORKSHOP 11
การสราง Static Content
Static content คือ สวนที่เราจะพิมพขอความหรือ เนื้อหาที่เราตองการที่จะปรากฏในเว็ป
ไซต
เริ่มจาก Menu content คลิกที่ Static Content Manager
จะปรากฏหนานี้
ใหคลิกที่ New ตรง Menu bar

74. - 70 -
ในสวนของ Item Details
Title = ชื่อหลัก (แสดงใหเห็นในเวปไซต)
Title = ชื่อรอง จะตั้งหรือไมตั้งก็ได
Text = เปนสวนทีจะพิมพขอความที่ตองการใหแสดงในเวปไซตในหนาตางๆ
่
ในสวนของ Publishing
ทําการ Set คา Publishing ไดตามตองการ
Status = เปน Public สามารถใหคนทั่วไปดูหนานี้ได
Chang Creator = แสดงใหคนวาใครเปนคนแกไขบทความ
Override Created Date = แกไขบทความเมื่อไร
Start Publishing = วันที่เริ่มประกาศใหคนทัวไปดูขวความของเราได
่ 
Finish Publishing = วันที่ปดไมใหคนทัวไปดูขอความในเวปไซต
่

75. - 71 -
เมื่อทําการเขียนขอความเรียบรอยแลวใหทําการ Save

76. - 72 -
WORKSHOP 12
การติดตั้ง Components
การติดตั้ง Components เพื่อการใชงานใน Joomla นั้น จะสังเกตไดวา Components ที่ดาวน
โหลดมานั้นจะมีชื่อไฟล นําหนา com_ เชน com_akobook342.zip , com_simpleboard-1.0.4-
beta1.zip เปนตน
การติดตั้งทําไดโดย ไปที่ menubar (Installers--> Components)
แลวคลิก Component จะพบหนาถัดไป
จะเปนหนาที่ Install และ Uninstall

77. - 73 -
ตรง Upload Package File ใหคลิกที่ Browse
ใหไปที่เก็บไฟล เลือกไฟลที่ตองการ แลวคลิกปุม Open
เสร็จแลวใหคลิกที่ ปุม Upload File & Install เมื่อคลิกโปรแกรมก็จะถูก Install ถาไมมีปญหาใน
การ Upload จะขึ้นคําวา Success
ใหกดปุม Continue เปนการเสร็จสิ้นการ Install Components

78. - 74 -
การลบ Components ที่ไมตองการ

ไปที่ เมนูการติดตั้ง เหมือนเดิมโดย ไปที่ menubar (Installers--> Components)
จะปรากฏ Install ถาเลื่อนดูขางลางจะพบกับ Installed Components คือ Components ที่มีอยูใน
Joomla นั้นเอง
คลิกที่ Currently Installed ตรง Components ที่ตองการลบ

79. - 75 -
เสร็จแลวใหไปที่ Menubar คลิกที่ Uninstall
โปรแกรมจะถามยืนยันวาตองการลบจริงหรือไม ใหคลิก OK
เมื่อคลิก OK ก็เสร็จการลบ Components

80. - 76 -
WORKSHOP 13
การติดตั้ง Modules
การติดตั้ง Modules เพื่อการใชงานใน Joomla นั้น จะสังเกตไดวา Modules ที่ดาวนโหลด
มานั้นจะมีชื่อไฟล นําหนา mod_ เชน mod_anaclock2.zip , mod_partner.zipเปนตน
การติดตั้งทําไดโดย ไปที่ menubar (Installers--> Modules)
แลวคลิก Modules จะพบหนาถัดไป

81. - 77 -
ใหคลิกที่ Browse ไปที่เก็บไฟล
คลิกที่ Upload File & Install
เสร็จแลวใหกดปุม Continue เปนอันเสร็จการ Install
การลบ MoDules
การลบใหทําในลักษณะเดียวกับ การลบ Components

82. - 78 -
WORKSHOP 14
การติดตั้ง Mombots
การติดตั้ง Mombots เพื่อการใชงานใน Joomla นั้น การติดตั้งทําไดโดย ไปที่ menubar
(Installers--> Mombots)
ใหทําการคลิกที่ ปุม Browse

83. - 79 -
ใหไปยังที่เก็บไฟล แลวทําการคลิกที่ปุม Upload File & install
แลวการ Upload ไมมีปญหา จะขึ้น Success
เสร็จแลวใหกดปุม Continue เปนอันเสร็จการ Install
การลบ MoDules
การลบใหทําในลักษณะเดียวกับ การลบ Components

84. - 80 -
WORKSHOP 15
การจัดการ Contact Us
Component Contact Us คือ Components ที่ใชในการติดตอสื่อสาร ระหวางผูใชบริการ
Website และผูที่เกี่ยวของ
การจัดการ Contact us มีขั้นตอนดังนี้
เลือกที่ Components --> Contacts --> Manage Contacts
คลิกเลือกที่ชองสี่เหลี่ยม
แลวเลือกที่ Edit ตรง Menubar
จะปรากฏหนาเพื่อใหทําการแกไข

85. - 81 -
เมื่อทําการแกไขเสร็จเรียบรอยแลวใหทําการกดปุม Save เพื่อบันทึกขอมูล
ผลการทํางานที่เรียบรอยแลว

86. - 82 -
WORKSHOP 16
การจัดการ Web link
วิธีการสราง Web link Categories มีขั้นตอน ดังนี้
เลือก Components --> Web link --> Web link Categories เพื่อสราง Web link Categories ซึ่งจะ
นําไปใชในสวนของ Web link Item ตอไป
จะปรากฏหนาจอ
- Category Title คือ หัวขอของ Category
- Category Name คือ ชื่อของ Category
- Image Position คือ ตําแหนงของรูปภาพทีจะแสดง
่
- Access Level คือ ระดับการเขาถึงของผูใช
- Published คือ ตองการแสดง Web link Categories นี้หรือไม
- Description คือ สวนของการอธิบายรายละเอียดหัวขอ Category ที่เราสรางขึ้น
- คลิก Save เมื่อเสร็จเรียบรอยแลว

87. - 83 -
เมื่อมีการสราง หัวขอ Category หรือกลุมของ Link แลว ใหไปที่ Menubar
Components--> Web links --> Web Link Items
จะปรากฏหนาถัดไป
ใหกดปุม New เพื่อสราง Link
จะปรากฏหนาเพื่อใหกรอกขอมูล

88. - 84 -
- Name: ชื่อของ Link
- Category: กลุมของ Link ที่สรางไว
- URL: ใหใส URL ที่จะ Link ไป
- Description: รายละเอียดของ Link
- Published: ใหคลิกเพื่อ แสดงหรือไมแสดง Link
แลวใหกดปุม save ก็เปนอันเสร็จ

89. - 85 -
WORKSHOP 17
การแกไขภาษาใน Joomla
ใน Joomla จะใชภาษาไทยไมได ดังนันจะตองทําการ Install ภาษาไทยเขาไป โดยไปที่ Menubar
้
Site --> Language --> Site Languages
จะปรากฏหนาตอไป
แลวไปที่ New ที่ Menubar
จะปรากฏหนาจอให Install

90. - 86 -
ใหคลิกที่ปุม Browse
แลวคลิกที่ Upload File & Install
โปรแกรมจะถูก Install เสร็จแลวจะพบหนา Success ใหกดปุม Continue

91. - 87 -
เสร็จแลวใหจะตองตั้งคาเพือใชภาษาไทย
่
แลวคลิก Publish ที่ Menubar
เครื่องหมายถูกก็จะยายไปทีภาษาไทยแสดงวาสามารถใชภาษาไทยไดแลว
่
การลบภาษาทีไมตองการ
่
กอนทําการ Delete จะตอง Publish ตัวอื่นกอน

92. - 88 -
แลวใหคลิกที่ Delete
จะปรากฏยืนยันการลบ ใหกดปุม OK
ก็เปนอันเสร็จการลบภาษาทีไมตองการออก
่

93.
คูมอ
 ื
โปรแกรมการจัดการ
Website สําเร็จรูป
Joomla
จัดทําโดย
นายวริศ คุมพงษ 48051752
นายรุงโรจน พงษโสพณ 48051660
นางสาวสิตา กังวานพณิชย 48052186