20121102 joomla2-5

28
คูมือการติดตั้งและใชงาน Joomla 2.5 เบื้องตน ผูจัดทํา นางสาวพัทนีย อาบุญงาม รหัส 523080870-7 นักศึกษาชั้นปที่ 4 สาขาสารสนเทศศาสตร คณะมนุษยศาสตรและสังคมศาสตร มหาวิทยาลัยขอนแกน เสนอ นายบุญเกียรติ เจตจํานงนุช รายงานเลมนี้เปนสวนหนึ่งของการฝกงาน ฝายบริการความรู ทางวิทยาศาสตรและเทคโนโลยี สํานักงานพัฒนาวิทยาศาสตรและเทคโนโลยีแหงชาติ

description

คู่มือติดตั้งและใช้งาน Joomla-2.5 เบื้องต้น

Transcript of 20121102 joomla2-5

Page 1: 20121102 joomla2-5

คูมือการติดต้ังและใชงาน Joomla 2.5 เบ้ืองตน

ผูจัดทํา

นางสาวพัทนยี อาบุญงาม รหัส 523080870-7

นักศึกษาชั้นปที่ 4 สาขาสารสนเทศศาสตร

คณะมนุษยศาสตรและสังคมศาสตร มหาวิทยาลัยขอนแกน

เสนอ

นายบุญเกียรติ เจตจํานงนุช

รายงานเลมนี้เปนสวนหนึ่งของการฝกงาน

ฝายบริการความรูทางวทิยาศาสตรและเทคโนโลย ี

สาํนกังานพัฒนาวทิยาศาสตรและเทคโนโลยแีหงชาติ

Page 2: 20121102 joomla2-5

สารบัญ

บทที่ 1 การติดต้ัง Joomla บนพีซีจําลอง ..................................................................................................................... 1

1. การติดต้ัง Appserv ............................................................................................................................................ 1

2. การติดต้ัง Joomla ............................................................................................................................................. 5

บทที่ 2 เมนูและเครื่องมือเบื้องตนของ Joomla ........................................................................................................... 9

1.เมนูการใชงานหนาจอหลักผูดูแลระบบ Administrator ...................................................................................... 9

2.ปุมเครื่องมือหลัก ............................................................................................................................................... 10

2.1 เครื่องมือทั่วไป ......................................................................................................................................... 10

บทที่ 3 การต้ังคาเว็บและการกําหนดสิทธ์ิ .................................................................................................................. 11

1.การต้ังคาเว็บและใสขอมูลเว็บเบื้องตน ............................................................................................................... 11

2.การต้ังคาผูใชงานและกําหนดสิทธ์ิการใชงาน ..................................................................................................... 12

บทที่ 4 การสรางเว็บดวย Joomla เบื้องตน ............................................................................................................... 14

1.กาสรางหมวดหมู (Category) ............................................................................................................................ 14

2.การสรางบทความ (Article) ............................................................................................................................... 15

3.การต้ังคาและติดต้ัง Template ......................................................................................................................... 19

4.การสรางเมนูใหมใหหนาเว็บ .............................................................................................................................. 21

Page 3: 20121102 joomla2-5

~ 1 ~

บทท่ี 1 การติดตั้ง Joomla บนพีซีจําลอง

1. การติดต้ัง Appserv

Appserv เปนแมขายเว็บแบบจําลอง หรือ Web Server, Database Sever จําลอง โดยรวบรวม Open

source Software หลายๆอยางมารวมไว ไมวาจะเปน Apache โปรแกรมจําลองแมขายเว็บ, PHP โปรแกรม

แปลภาษา, MySQL โปรแกรมจัดการฐานขอมลู, phpMyAdmin เมื่อติดต้ังแลวเครือ่งพซีีธรรมดากลายเปนเครื่องแม

ขายเว็บจําลองได

1.1 ดาวนโหลด Appserv ไดที่ http://apservnetwork.com โดยเลอืกดาวนโหลด Version 2.5.10

1.2 เมื่อดาวนโหลดมาแลวเปดโฟลเดอรที่บันทึกไวจะไดไฟล appserv-win32-2.5.10 ดับเบิ้ลคลิกไฟล

1.3 เมื่อคลิกแลวจะเห็นหนาจอเริ่มการติดต้ัง ดังรูป คลิก Next

Page 4: 20121102 joomla2-5

~ 2 ~

1.4 ยอมรับขอตกลง คลิก I Agree

1.5 Browse เลอืกโฟลเดอรที่ตองการจะเก็บ Appserv เมื่อเสร็จคลิก Next

1.6 เลือกโปรแกรมยอยทีต่องการใช

Page 5: 20121102 joomla2-5

~ 3 ~

1.7 ใสขอมูลเกี่ยวกับ Sever

1) Sever Name (ช่ือเซิฟเวอร): localhost

2) Administrator’s Email Address (อีเมลผูดูแลระบบ): ใสอีเมลของเรา

3) Apache HTTP Port (การระบหุมายเลขชองทางติดตอ): มักจะระบุเปนเลข 80

เมื่อเสร็จสิ้น คลิก Next

1.8 ต้ังคารหัสผานในการเขาถึงฐานขอมูล MySQL โดย Username ของฐานขอมูล คือ Root

1) ใส Password ใน Enter root password และใสซ้าํใน Re-enter root password

2) เลือกรหัสภาษา (character Sets and Collations) ถาใชภาษาไทยใหถูกตองตามคากาํหนดของ

เครื่องแมขาย กรณีน้ีควรระบุเปน UTF-8 Unicode หรือ TIS-620

เมื่อเสร็จสิ้น คลิก Install เพื่อเริ่มการติดต้ังโปรแกรม

Page 6: 20121102 joomla2-5

~ 4 ~

1.9 รอการติดต้ัง เมื่อติดต้ังเสร็จจะปรากฏหนาจอ ดังรปู

1.10 คลกิ Start Apache และ Start MySQL เพื่อใหโปรแกรมทั้งสองทํางาน คลกิ Finish การติดต้ังก็จะ

เสร็จสิ้น ทดสอบการติดต้ังโดยเขาไปที ่http://localhost หรือ http://127.0.0.1 ปรากฏหนาจอ ดังรูป

11.1การใชงาน Appserv ใหมีประสิทธิภาพ ควรปรับแตงคา Config ของ AppServ ใหเหมาะสม โดยเลือก

คําสั่ง Start > Program > AppServ > Configuration Server > PHP Edit the php.ini Configuration File เพื่อ

เปดไฟล php.ini ดวยโปรแกรม NotePad จากน้ันคนหารายการเพื่อปรับแกไข ดังน้ี

• max_execution_time ควรมากกวา 120

• max_input_time ควรมากกวา 120

• memory_limit ควรมากกวา 64M

• post_max_size ควรมากกวา 20M

• upload_max_filesize ควรมากกวา 20M

ทั้งน้ีการปรับแกไขจะตองระมัดระวังเปนพิเศษ จากน้ันบันทึกไฟล ปดไฟลแลวสั่ง Restart Server

ดวยคําสั่ง Start, Program, AppServ, Control Server by Service, Apache Restart

Page 7: 20121102 joomla2-5

~ 5 ~

2. การติดต้ัง Joomla

Joomla คือระบบที่ชวยในการจัดการเน้ือหา (Content Management System: CMS) บนเว็บไซตเพื่อชวย

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

ในดานการเขียนโปรแกรม หรือออกแบบเว็บไซต กส็ามารถจดัทาํเว็บไซตดวยตัวเองได

2.1 ดาวนโหลด Joomla ไดที่ http://www.joomla.org/download.html เลอืกดาวนโหลด Joomla 2.5

2.2 เมือ่ดาวนโหลดมาแลวเปดโฟลเดอรที่บันทึกไวจะไดไฟล Joomla_2.5.7-Stable-Full_Package.zip

หลังจากน้ันคลิกขวา เลือก Extract file… เลือกโฟลเดอร C:\Appserv\www หรือไดรฟที่ติดต้ัง Appserv ไว

ถาตองการสรางเว็บไซตของตนเอง สามารถเปลี่ยนช่ือโฟลเดอร เปนช่ือเว็บ หนวยงาน หรือช่ือทีต่องการได

Page 8: 20121102 joomla2-5

~ 6 ~

2.3 ติดต้ัง Joomla โดยเขาไปที่ http://localhost/ช่ือโฟลเดอร หรือ http://127.0.0.1/ช่ือโฟลเดอร

ตัวอยาง http://localhost/sleep

ขั้นตอนท่ี 1 เลอืกภาษาในขณะติดต้ัง เลอืกภาษาไทย คลกิ ตอไป

ขั้นตอนท่ี 2 ตรวจสอบสิทธ์ิการติดต้ัง คลิก ตอไป

ขั้นตอนท่ี 3 หนาลิขสิทธ์ิ คลิก ตอไป

Page 9: 20121102 joomla2-5

~ 7 ~

ขั้นตอนท่ี 4 ต้ังคาฐานขอมูล โดยระบสุวนตางๆ ต้ังรหัสผานและช่ือฐานขอมูลดวยตัวเอง ดังรูป

เมื่อเสร็จสิ้น คลิก ตอไป

ขั้นตอนท่ี 5 การต้ังคา FTP ไมตองระบุคา คลกิ ตอไป

ขั้นตอนท่ี 6 ต้ังคาหลักของเว็บ โดยระบุสวนตางๆ ดังน้ี

1) ช่ือเว็บ: เชน Sleeping Club: คลบัของคนรกัการนอน

2) อีเมล: ระบอุีเมลของผูดูแลระบบ

3) ช่ือเขาระบบของผูดูแล: เชน Kifkif00

4) รหัสผานและยืนยันรหัสผานผูดูแลระบบ: เปนรหัสที่ต้ังข้ึนเอง

5) ขอมูลตัวอยาง: สามารถเลือกขอมูลตัวอยางหรือไมเอาขอมูลตัวอยางก็ได

เมื่อเสร็จสิ้นทั้งหมดแลวคลกิ ตอไป

Page 10: 20121102 joomla2-5

~ 8 ~

ขั้นตอนท่ี 7 เสร็จสิ้นการติดต้ัง เพื่อใหกระบวนการเสร็จสิ้นอยางสมบูรณ ตองลบโฟลเดอร

Installation ออกดวย เปนอันเสร็จสิ้นการติดต้ัง สามารถ

คลิก ดูหนาเว็บ เพื่อดูหนาแรกของเว็บ หรือ

คลิก ผูดูแลระบบ เพื่อสรางเว็บไซต ตอไป

Page 11: 20121102 joomla2-5

~ 9 ~

บทท่ี 2 เมนแูละเคร่ืองมือเบื้องตนของ Joomla

1.เมนูการใชงานหนาจอหลกัผูดูแลระบบ Administrator

1. เปนเมนูในการควบคุมและปรับแต Joomla ไมวาจะเปนการต้ังคาระบบ การจดัการผูใชงานระบบ การ

สรางเมนู การเขียนบทความ รวมไปถึงการติดต้ังสวนเสริมตาง ๆ

2. แผงควบคุมหลักผูดูแลระบบ (Administrator Control Panel) หรือ เมนูที่ใชกันบอยๆ มีดังน้ี

1.Add New Article

เมนูการสรางบทความใหม

2.Article Manager

การบรหิารบทความ

3.Category

เมนูการบริหารหมวดหมูบทความ

4.Media Manager

เมนูการบริหารรูปภาพ ส่ือตางๆ

5.Menu Manager

การบริหารเมนูระบบ

6.User Manager

การบรหิารงานผูใชงานระบบ

7.Module Manager

การบริหารโมดูลกรอบเน้ือหาเล็กๆ ทีว่างกระจาย

ในหนาเว็บ แสดงเน้ือหาทีห่ลากหลาย

8.Extension Manager

การบริหารสวนเสริมของระบบ

9.Language Manager

เมนูการจัดการภาษา

10.Gobal Configuration

การบริหารระบบหลักเซิฟเวอร

11.Template Manager

การจัดการรูปแบบของเว็บ

1.2 Edit Profile

การปรับแตงโปรไฟล

3.เปนการแสดงจํานวน admin, visitors, ผูเขาชมเว็บ และจาํนวนจดหมายที่สงถึงเรา

4. การ log in ของ User 5 ครั้งสุดทาย บทความที่ไดรับความนิยม การเพิ่มบทความใหม

1

2

3

4

1 2

6

11

7

12

3

8

4

9

5

10

Page 12: 20121102 joomla2-5

~ 10 ~

2.ปุมเครื่องมือหลัก

เปนปุมเครื่องมือที่ใชในการจัดการเว็บที่ใชบอยๆ หรือเปนเครื่องมือหลักในหารจัดการงานตางๆ ดังน้ี

2.1 เครื่องมือทั่วไป

1. New สรางใหม หรือการเพิ่มสวนตางๆใหม

2. Edit แกไข

3. Publish เผยแพร

4. Unpublished ไมเผยแพร

5. Featured ต้ังเปนบทความใหม

6. Archive ต้ังเปนบทความเกา

7. Trash or Delete ลบสวนตางๆ

8. Option การปรบัแตง ต้ังคาการใชงานตาง ๆ

9. Help การชวยเหลือ

2.2 เครื่องมือการจัดการผูใช

1. Activate การนําไปใชงาน

2. Block ยกเลกิหรือกีดกัน

3. Unblock เลิกการบล็อก

Page 13: 20121102 joomla2-5

~ 11 ~

บทท่ี 3 การตั้งคาเว็บและการกําหนดสิทธิ์

1.การต้ังคาเว็บและใสขอมูลเว็บเบ้ืองตน

1) เขาไปที่ Global Configuration จะปรากฏหนาจอดังรูป

2) การต้ังคาเว็บไซต (Site Setting)

สวนอื่นๆที่อาจตองการแกไข

1. Default Editor: เปนการเลือกตัวสรางบทความของเราเพ่ือใหบทความของเรามีความสวยงามและตกแตงไดอยางมีระเบียบ

2. Default Captcha: เปนตัวเลือกการของการปองกันแสปม

3. Default Access Level: เปนการปรับระดับของการการเขียนขอความ เมนู ในการแสดงหลังจากสราง

4. Default List Limit: กําหนดรายการของการแสดงผล

5. Default Feed Limit: กําหนดรายการของ Feed

6. Feed Mail: เปนการกําหนด Feed ของ Mail

สวนที่ 1 ตั้งคาเว็บไซต

สวนที่ 2 กําหนด Metadata

1.ใสชื่อเว็บ

2.การปดเวบ็เพ่ือใหหยดุแสดงผลหรือออฟไลน

3.ใสขอความเพ่ือให

แสดงผลตอนออฟไลน

4.เลือกรูปออฟไลน

Page 14: 20121102 joomla2-5

~ 12 ~

3) การกาํหนด Metadata Setting

4) เมื่อเสร็จแลว กด Save เพื่อบันทึก Save and Close เพื่อบันทึกและปดหนาจอเพื่อทํางานในสวนอื่น ๆ

Cancel ตองทําทุกครั้งหลังจากทาํกระบวนการตางๆเสร็จสิ้น

2.การต้ังคาผูใชงานและกําหนดสิทธิ์การใชงาน

1) เขาไปที่ User Manager เสร็จแลวกดเครื่องมือ จะปรากฏหนาจอดังรูป

2) การกาํหนดรายละเอยีดผูใชงาน (Account Details)

1.ใสขอความแนะนําเว็บไซต

เพ่ือใหปรากฎเมื่อมีการคนหาเว็บ

2. ใส Keyword ของเวบ็เพ่ือให

Search Engine คนหาเว็บพบ

3.ขอความลิขสิทธิ์ เชน c2012 by

Pattanee เปนตน

สวนที่ 1 รายละเอียดผูใชงาน สวนที่ 3 การกํา หนดการใช

สวนที่ 2 การกําหนดสิทธิ์ผูใชงาน

1. Name: ชื่อ

2. Login Name: ชื่อที่ใชในการเขาสูระบบ

3. Password: รหัสผาน

4. Confirm Password: ยืนยันรหัสผา น

5. E-Mail : อีเมลของผูใชงา น

Page 15: 20121102 joomla2-5

~ 13 ~

3) การกําหนดสิทธ์ิกลุมการใชงาน (Assigned User Group)

1. กลุมผูใชงานท่ั วไป : เขาชมและอานเนื้อหาบนเว็บ

2. ผูดูแลระดับแรก : จัดการบทความ เมนู สื่อมีเดีย ท่ีไดสรางไวแลว

3. ผูดูแลระดับสูงขึ้นมา : จัดการเมนูไดท้ังหมด ติดต้ังสวนขยาย ปลั๊กอิน เปนตน

4. ผูลงทะเบียนกับเว็บ : สามารถจัดการขอมูลสวนตัว อานบทความเฉพาะสมาชิก

8. ผูดูแลระบบระดับสูงสุด : สามารถเขาจัดการเว็บไดทุกสวน

7. ผูอนุญาตเผยแพร : อนญุาตเผย แพร บทความ หรอืบลอ็กบทความ

6. บรรณาธิการ : ผูตรวจสอบบทความและเขียน แกไขบทความไดดวย

5. นักเขียนบทความ : เปนสมาชกิามารถแตง แกไข บทความได

Page 16: 20121102 joomla2-5

~ 14 ~

บทท่ี 4 การสรางเว็บดวย Joomla เบื้องตน

1.กาสรางหมวดหมู (Category)

เปนการสรางหมวดหมูใหกับบทความ เพื่อใหเกิดความเปนระบบและสามารถสืบคนบทความตามหมวดหมูท่ี

ตองการได รวมถึงถาเว็บเปนแบบ Dynamic Website ซึ่งขอมูลอาจมีการเปลี่ยนแปลงตลอดเวลา หมวดหมูจะชวย

จัดเก็บขอมูลใหมที่เพิ่มข้ึนเรื่อย ทๆี่เหมือนกันไวดวยกันได

1) เขาไปที่ Category สรางหมวดหมูใหม กด จะปรากฏหนาจอดังกลาว

2) การระบุรายละเอียดของหมวดหมู (Details)

สวนที่ 1 รายละเอียด

สวนที่ 2 การตั้งคาหมวดหมู

สวนหลักที่ตองระบุรายละเอียด

1. Title: ชื่อ หมวดหมู

2. Alias: จะตองเปนภาษาอังกฤษตวัพิมพเล็กหาม

เวนวรรค ใชไดเฉพาะ - และส่ือความหมายของ

บทความไดชดัเจชัดเจน

3. Parent: หมวดหมูหลักของหมวดหมูนี้

4. Status: สถานะ Published เผยแพร

สามารถใสคําอธิบายหมวดหมูได

Page 17: 20121102 joomla2-5

~ 15 ~

3) การต้ังคาตางๆของหมวดหมู

2.การสรางบทความ (Article)

1) เขาไปที่ Article Manager สรางหมวดหมูใหม กด จะปรากฏหนาจอดังกลาว

2) การใสรายละเอยีดของบทความ

สามารถเลือกผูสรางหมวดหมูนี้

ไดคลิก Select User และเลือก

สามารถเลือกรูปภาพแสดงแทน

หมวดหมู และคําอธิบายได

สามารถใส Keyword และ

Description เก่ียวกับหมวดหมูได

สวนที่ 1 รายละเอียด

สวนที่ 2 เนื้อหาบทควา ม

สวนที่ 3 ตั้งคาสวนอ่ืนๆของ บทความ

1.ใสชื่อบทความ

2. ใสหมวดหมู Categoryบทความที่สรางไว

Page 18: 20121102 joomla2-5

~ 16 ~

3) การใสเน้ือหาของบทความ

4) การใสรปูภาพในบทความ

4.1) เขาไปทีแ่ถบ Image ดังรูป

4.2) เมื่อคลิกเลือกเสร็จแลวจะปรากฏหนาจอ Upload รปูภาพเขาไวใน Joomla ดังรูป

สามารถใสเนือ้หาของบทความ

ไดใน ชองนี้ โดยสามารถพิมพ

หรอื Copy แลววางได

การลิงคไป

บทความ

อ่ืนท่ีมีใน

การใส

รปูภาพใน

บทความ

การสราสารบัญ

เนื้อหาบทความ

กรณทีีเ่นือ้หาในบทความมคีวามยาวมากๆ การนําเสนอท้ังหมดผาน

เว็บไซตอาจจะไมนาสนใจเทาท่ีควร Joomla มีคําสั่งแบงตอนและแสดง

ลิง ค Read more…

คลิกปุม เลือก

เลือกไฟลรูปที่

ตองการนํามาใส

บทความ คลิก Start Upload

1

2

3

Page 19: 20121102 joomla2-5

~ 17 ~

4.3) นํารูปไปใสในบทความ คลิกเลือกรูปภาพที่ Upload ข้ึน แลวกดคําวา Insert

4.4) ก็จะปรากฏเห็นรูปภาพเขาไปอยูในบทความที่เราเขียน

5) การเช่ือมโยงบทความที่เขียนไปยังบทความอื่น

5.1) เขาไปที่ Article ตัวอยาง บทความที่เราเขียนเปนบทความเกี่ยวกับ การนอนไมหลับ แลว

ตองการเช่ือมไปยัง สุขอนามัยการนอนที่ดี

5.2) เมื่อคลิกแลวจะปรากฏหนาจอดังรูป เลือกบทความที่ตองการเช่ือมไปหา

คลิกนํารูปใสในบทความ

เลือกไฟลรูปท่ี

ตองการนาํมาใส

บทความ

Page 20: 20121102 joomla2-5

~ 18 ~

5.3) ลิงคการเช่ือมโยงไปยังบทความอื่น จะปรากฏ ดังรูป

6) การต้ังคาสวนอื่นๆของบทความ สวนที่จําเปนตองระบุ มี 2 สวนคือ

6.1) การต้ังคาการเผยแพร (Publishing option)

6.2) การใส Metadata บทความ

เปนการใส Keyword, Description และ Author เพื่อใหสามารถทาํใหเว็บไซตสามารถคนหา

บทความน้ีเจอได

1.ใสชื่อ ผูสรางบทความ นี้

2.ใสวันที่สรางบทความ

3.สามารถระบุวันที่

ตองการเผยแพร และ

วันส้ินสุดของการ

1.คําอธิบาย Metadata บทความ

2. ใส Keyword ของบทความ

3.ใสชื่อผูแตงบทความ

เจาของลิขสิทธิ ์

4.ใสลิขสิทธิ์ของบทความ

Page 21: 20121102 joomla2-5

~ 19 ~

3.การต้ังคาและติดต้ัง Template

1) เพิ่ม หรือ Upload Template เขาไปที่ เมนู Extension Manager จะปรากฏหนาจอดังรูป

2) อัพโหลด Template ที่ดาวนโหลดมาเปนไฟล .Zip เขาไปที่ เลือกไฟล แลวเลือกไฟลที่ตองการ และคลิก

Upload&Install

และเมื่อ Upload เสร็จจะปรากฏหนาจอดังรูป

3) ตอมาเขาไปที่เมนู Template Manager เพื่อจัดการและใชงานกับ Template ที่อัพโหลเขามา

เมื่อเขาไปจะเห็น Template ที่เรานําเขามา คลิกเลือก

สวนของการ Upload หรือ

เพ่ิม Plug- in หรือ Template

1 2

Page 22: 20121102 joomla2-5

~ 20 ~

4) เมื่อเขาไปจะปรากฏหนาจอ การต้ังคาเกี่ยวกับ Template น้ี สามารถใส Logo และแกไขรูปแบบตางๆได

5) ต้ังคาเมนูใหปรากฏใน Template น้ี คลิกเลือกเมนูที่ตองการ ดังรูป คือใหหนาเว็บแรกปรากฏเปน

Template น้ี

6) การใส Logo เขาไปใน Template

สวนบอกรายละเอียด

Template

สวนการต้ังคา Menu ท่ีจะปรากฏใน Template นี้

สวนการจัดการรูปแบบของ

Template

สามารถอัพโหลดรูป Logo หรือรูปสวนหัวใสได

สามารถใส Slogan ได

สามารถใสรายละเอียดลิขสิทธิ์ลงในทายเว็บได

Page 23: 20121102 joomla2-5

~ 21 ~

5) ตัวอยางหนาเว็บเมื่อติดต้ังเสร็จสิ้น

4.การสรางเมนูใหมใหหนาเว็บ

1) เขาไปที่ Menu Manager คลกิ เพือ่สรางสวนของแถบเมนู คลกิ ปรากฏดังรปู

เมื่อสรางเสร็จแลวก็จะปรากฏแถบเมนูที่สรางข้ึน ดังรูป

2) จากน้ันคลกิเขาไปแถบเมนูทีส่รางข้ึน คลกิ เพื่อสรางเมนูที่จะอยูในแถบเมนูน้ัน ปรากฏดังรูป

ตัวอยางการสราง คือ จะสรางเมนู หนาแรก

Logo ที่ใสเขาไป

หนาที่ใช Template นี้

ลิขสิทธิ์เว็บที่ใสเขา ไป

ในท่ีนี้เราจะสรางแถบเมนูสวนหัว ใชชื่อวา Top Menu

T it le : ชื่อแถบเมนู

Menu type : ประเภทแถบเมนู

Descr ipt ion: คําอธิบายแถบเมนูนี้

เมื่อสรางเสร็จแลวคลิก Save & c lose

จะบอกรายละเอียดในหัวขอตอไป

สวนที่จําเปนตองระบุ

1. Menu Item Type: เมนูที่สรางขึ้น

ตองการใหออกมาในรูปแบบใด

2. Menu t itle: ชื่อของเมนู

3. Menu Location: แถบเมนูที่ตองการนํา

เมนูไปใสไว

Page 24: 20121102 joomla2-5

~ 22 ~

3) การเลือก Menu Item type กับหนาเว็บแบบตาง ๆ

เลือก Menu Item Type คลกิ Select แลวจะปรากฏหนาจอ ที่ใชบอยๆ มี 3 สวน ดังรูป

3.1 ) การสรางหนาแนะนําเว็บไซต ดวย Single Article กอนอื่นเราตองสรางบทความแนะนําเว็บไซต

กอนที่ Article New (สรางบทความใหม ไปที่ หัวขอ การสรางบทความใหม Article Manager) เมื่อคลิก

เลือก Single Article จะปรากฏแถบการต้ังคาดานขาง คลกิ Select / Change จะพบหนาจอ ดังรูป

การสรางการ Search

การสรางการตดิตอ

การสราง หนาบทความ

1. Archive Art icle: หนาบทความเกา

2. S ingle Art icle: หนาบทความๆเดียว

3. L ist All Category: รายชื่อหมวดหมู

4. Category blog: หนาบทความใน

หมวดหมูนั้น

5. Feature Art icle: หนาที่ตั้งเปน

บทความใหม

เลือกบทความ แนะนําเว็บไซต ที่เราสรางขึ้น

คลิ ก เพ่ือเลือก

1

2

Page 25: 20121102 joomla2-5

~ 23 ~

หนาแรกของเราที่ตองการ แนะนําเว็บไซต จะแสดงผล ดังน้ี

(ตองทําใหเสร็จสิ้นกระบวนการการสรางแถบเมนูทั้งหมดกอนจึงจะปรากฏ)

3.2) การสรางคลงับทความ ดวย List All Categories ที่จะแบงบทความเปนหมวดหมูตางๆ จะ

ปรากฏแถบต่ังคาดานขางเลอืก Root เพื่อใหแสดงหมวดหมูทั้งหมดที่เราสรางข้ึน หรือ เลือกแสดงบาง

หมวดหมูก็ได

หนาคลงับทความของเราทีต่องการ แสดงหมวดหมูบทความ จะแสดงผล ดังน้ี

(ตองทําใหเสร็จสิ้นกระบวนการการสรางแถบเมนูทั้งหมดกอนจึงจะปรากฏ)

3.3) การสรางหนา Search งายๆ ดวย Search From or Search Results เพียงคลิกเลือกเทาน้ัน

Page 26: 20121102 joomla2-5

~ 24 ~

หนาคนหาของเราทีต่องการ แสดงชอง Search จะแสดงผล ดังนี ้

(ตองทําใหเสร็จสิ้นกระบวนการการสรางแถบเมนูทั้งหมดกอนจึงจะปรากฏ)

4) เมื่อเราสราง แถบเมนู และ เมนูที่จะอยูในแถบเมนูเสร็จแลว เราตองสรางสวนท่ีจะนําแถบเมนูไปใส เขาไป

ที่ Module Manager ซึ่งเปนเครื่องมือที่ชวยจัดการวางเมนู หรือ Plug-in ที่ตองการ ไวในสวน

ตางๆของ Template เมื่อเขาไปเสร็จ คลกิเพื่อสวนสรางแถบเมนูใหม ปรากฏหนาจอ ดังน้ี

5) เมื่อเลือก Module Type เสร็จแลวจะปรากฏหนาจอสําคัญที่ตองใสรายละเอียด ดังรูป

เลือก Module Type เปน Menu

เพราะเราตองการสรางแถบเมนู

2.เลือกแถบเมนูที่

สรางขึ้นที่ตองการ

วางไวในสวนนี้

1.ใสชื่อ Module

หรือสวนที่ตองการ

จะอธิบายในหัวขอ

Page 27: 20121102 joomla2-5

~ 25 ~

6) การเลือกสวนหรือตําแหนงที่ตองการวางแถบเมนู Position กอนอื่นใหเขาไปดูโครงสราง Template คลกิ

เมนู Template Manager และคลิกเลือกแถบ Template จะปรากฏหนาจอดังรูป

7) เมื่อคลิกดูโครงสรางแลวจะปรากฏหนาจอดังรูป สังเกตสวนที่ตองการจะนําแถบเมนูใส ดังรูป ตองการจะนํา

แถบเมนูใสในสวนของ Header[none outline] ใสจาํ Position เพียงอักษรนอกวงเล็กเทาน้ัน คือสวน header

8) กลับไปที่หนาจอการสราง Module คลกิ Select Position ใน หวัขอ Position ปรากฏหนาจอดังรูป

คลิกเ ลือก Preview Template

ที่เราติดตั้งไว เพ่ือดูโครงสราง

1

2

Page 28: 20121102 joomla2-5

~ 26 ~

9) เมื่อเสร็จสิ้นทุกกระบวนการ คลิก Save & Close กอนทีเว็บจะปรากฏแถบเมนูที่เราตองการ จะตองเขาไป

เลือก หนาเว็บที่ตองการใหปรากฏ Template น้ีกอน เขาไปที่เมนู Template Manager คลกิเลือก Template ที่

ตองการใช (กลับไปดูวิธีการต้ังคา Template ท่ีหนา 19) เขาไปดูในสวนของการต้ังคาการแสดงผล ดังรปู

10) หนาจอแสดงผล หลังจากที่สรางเมนูและแถบเมนูเสร็จสิ้น

เลือกตําแหนง header ที่เราจํามา

จากโครงสราง Template

คลิกเลือกหนาที่ตองการใหแสดง

Template น้ี

แถบเมนูที่เราสรางไวในสวน header