หน่วยที่ 9...

20
หหหหหหหห 9 หหหหหหหหหหหหหหหหหหหหหหหหหหห หหหหหหหหหหหหหหหหหหหหหห (Feature) กกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกก ก Joomla กกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกก กกกกกกกกกกกกกกกกกกกกกกกกกกกกกก Joomla กกกก กกกก กกกก Joomla กกกกกกกกกกกกกกกกกกกกกกกกกก กกกกกกกกกกกกกกก 2 กกกกกกกกกกกกกกกกกก กกกกกกกกกกกกกก(Category) กกกกกกกกกกกกกกกกก (Article) กกกกกกกกกกกกกกกกกกกกกกกกกกกกกกก Joomla กกกกกกกกกกกกกกกกกกกกกกกกกกก กกกกกกกกกกก Uncategorized กกกกกกกกกก กกกกกกกกกกกกกก

Upload: nakharin-inphiban

Post on 14-Aug-2015

41 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

หน่�วยที่�� 9 จัดการหน่�าแรกให�กบเว�บไซต์�การจัดการบที่ความหน่�าแรก (Feature)

ก่�อนจะจ�ดก่ารเน� อหาหร�อบทความเว�บไซต์�ของ Joomla ผู้��เข�ยนอยาก่ให�ผู้��อ�านท"าความเข�าใจถึ$งโครงสร�างเน� อหาเว�บไซต์�ของ Joomla เส�ยก่�อน ซ$'ง Joomla ได�แบ�งโครงสร�างเน� อหาของเว�บไซต์�ออก่เป็*น 2 ระด�บด�วยก่�นด�งน� หมวดหม��บทความ(Category)เน� อหาหร�อบทความ (Article) เน� อหาหร�อบทความท�'สร�างข$ นในJoomla โดยเร+'มแรก่จะอย��ในหมวดหม��ท�'เร�ยก่ว�า Uncategorized หร�อแบบท�'ไม�จ�ดหมวดหม��

Page 2: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

• ข้�อด�ข้�อเด�น่ข้อง Joomla!• ใช้�งานฟร� Joomla! เป็*นสคร+ป็ต์�แบบโอเพ่�นซอร�ส (Open Source) สามารถึใช้�

งานได�ท�นท�แม�ไม�ม�ความร� �เร�'องเข�ยนโป็รแก่รม• อ�พ่เดต์สม"'าเสมอ ม�ก่ารอ�พ่เดต์เวอร�ช้� 'นใหม�ๆ อย�างต์�อเน�'องจาก่ผู้��พ่�ฒนา โดย

ป็ร�บป็ร1ง เพ่+'ทป็ระส+ทธิ+ภาพ่เพ่+'มฟ4งก่�ช้� 'นในส�วนต์�างๆ• เป็ลี่�'ยนหน�าต์าเว�บไซต์�ได�ด�วยเทมเพ่ลี่ต์ (Tenplate) ท"าให�สอดคลี่�องก่�น• รองร�บภาษาไทยท� งในส�วนหน�าเว�บไซต์� (Front-end) แลี่ะส�วนผู้��ด�แลี่เว�บไซต์�

(Back-end)• ง�ายต์�อก่ารสร�างแลี่ะจ�ดก่ารเอหา ก่ารก่"าหนดร�ป็แบบต์�างๆ ของเน� อหา แลี่ะก่าร

แทรก่ส�วนป็ระก่อบต์�างๆ เช้�น ร�ป็ภาพ่ หร�อลี่+งค�ลี่งไป็ในเน� อหา สามารถึท"าได�ง�าด�วยเคร�'องม�อเอด+เต์อร� (Editor) ท�'ม�ลี่�ก่ษณะหนาต์าคลี่�าก่�บโป็รแก่รม Word Processing อย�าง Microsoft Word หร�อ Open Office Writer

• รองร�บก่ารท"างานหลี่ายๆ คนพ่ร�อมก่�น โดยผู้��ใช้�งานออก่เป็*นหลี่ายก่ลี่1�ม เช้�น ผู้��ด�แลี่เว�บไซต์� (Administrator), ผู้��จ�ดก่ารเว�บไซต์� (Manager), บรรณาธิ+ก่าร (Editor), สมาช้+ก่ผู้��ลี่งทะเบ�ยน (Registerred) เป็*นต์�น โดยม�ก่ารก่"าหนดระด�บก่ารเข�าถึ$งข�อม�ลี่ของผู้��ใช้�งานแต์�ลี่ะคน

• เพ่+'มความสามารถึให�ก่�บเว�บไซต์�ด�วยโป็รแก่รมเสร+ม (Extension) ซ$'งม�ให�เลี่�อก่ใช้�มาก่มาย เช้�น ระบบ ร�านค�าออนไลี่น� เว�บบอร�ด เว�บบลี่�อก่ ป็ฏิ+ท+น เป็*นต์�น

• สน�บสสน1นก่ารป็ร�บแต์�ง SEO เพ่�อให�เว�บไซต์�ท�'สร�างข$ นต์+ดอ�นด�บต์�นๆ ในหน�าผู้ลี่ก่ารค�นหา

Page 3: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

หลักการสร�างเว�บไซต์�ด�วย Joomla! ใน่เคร!�องคอมพิ#วเต์อร�ข้องเรา

ก่ารสร�างเว�บไซต์�ในเคร�'องคอมพ่+วเต์อร�ของเราน� นเสม�อนจ"าลี่องเคร�'องคอมพ่+วเต์อร�ของเราเป็*นเซ+ร�ฟเวอร�จ"าลี่อง (Localhost) ข$ นมา เพ่�'อท"าก่ารสร�างแลี่ะทดสอบเว�บไซต์�จนส"าเร�จก่�อนอ�พ่โหลี่ดเว�บไซต์�น� ไป็ย�งเซ+ร�ฟเวอร�โดม�หลี่�ก่ก่ารง�ายๆ ด�งน� • จ"าลี่องเคร�'องคอมพ่+วเต์อร�ของเราเป็*นเซ+ร�ฟเวอร�• สร�างฐานข�อม�ลี่ส"าหร�บเก่�บข�อม�ลี่เว�บไซต์� Joomla!• ต์+ดต์� งโป็รแก่รม Joomla! ผู้�านเซ+ร�ฟเวอร�จ"าลี่อง• สร�างเว�บไซต์� แลี่ะต์+ดต์� งโป็รแก่รมเสร+มลี่งใน Joomla!• อ�พ่โหลี่ดเว�บไซต์�ท�'สร�างเสร�จไป็ย�งเซ+ร�ฟเวอร�จร+ง

Page 4: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

จั$าลัองเคร!�องคอมพิ#วเต์อร�ข้องเราเป็&น่เซ#ร�ฟเวอร�

ก่ารจ"าลี่องเคร�'องคอมพ่+วเต์อร�ของเราเป็*นเซ+ร�ฟเวอร�เพ่�'อทดลี่องสร�างเว�บไซต์� joomla น� น จะต์�องใช้�โป็รแก่รมจ"าลี่องเซ+ร�ฟเวอร� ซ$'งม�ให�เลี่�อก่ใช้�หลี่ายต์�ว เช้�น AppServ, WAMP, EasyPHP เป็*นต์�น ในท�'น� จะใช้�โป็รแก่รม AppServ ซ$'งจะป็ระก่อบด�วยโป็รแก่รม ด�งน� • โป็รแกรมเว�บเซ#ร�ฟเวอร� Apache ส"าหร�บจ"าลี่องเคร�'องคอมพ่+วเต์อร�

ให�เป็*นเซ+ร�ฟเวอร�• โป็รแกรม PHP ส"าหร�บสร�างเว�บไซต์�ภาษา PHP• โป็รแกรม MySQL ส"าหร�บสร�างฐานข�อม�ลี่

ส"าหร�บโป็รแก่รม AppServ สามารถึดาวโหลี่ดได�จาก่ www.appservnetwork.com ซ$'งเวอร�ช้�'นลี่�าส1ดขณะน� ค�อ AppServ 2.6.0 แต์�ในหน�งส�อเลี่�มน� ผู้��เข�ยนใช้�เว�อร�ช้�'น AppServ 2.5.10 เน�'องจาก่เวอร�ช้�'นลี่�าส1ดบางโป็รแก่รมย�งเป็*นโป็รแก่รมทดลี่องใช้� (beta)

Page 5: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

ข้)น่ต์อน่การต์#ดต์)งโป็รแกรม AppServ1. ด�บเบ+ลี่คลี่+ก่ไฟลี่� appserv-win32-

2.5.10.exe ท�'ดาวโหลี่ดมา2. จาก่น� นก่�เร+'มเข�าส��ก่ารต์+ดต์� ง โดยแสดง

หน�าต์�างต์�อนร�บ ให�คลี่+ก่ป็1:ม Next

Page 6: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

3. หน�าต์�าง License Agreement ให�คลี่+ก่ป็1:ม I Agree เพ่�'อยอมร�บข�อต์ก่ลี่ง

4. ท�'หน�าต์�าง Choose Install Location จะเป็*นก่ารเลี่�อก่ต์"าแหน�งท�'ต์+ดต์� งโป็รแก่รม AppServ ให�คลี่+ก่ป็1:ม Next

Page 7: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

5. ท�'หน�าต์�าง Select Componnen จะแสดงโป็รแก่รมท�'ต์�องก่ารต์+ดต์� ง ซ$'งในท�'น� เราจะต์�องต์+ดต์� งท1ก่โป็รแก่รม ให�คลี่+ก่ป็1:ม Next

6. ท�'หน�าต์�าง Apache HTTP Server Information ให�ก่"าหนดรายลี่ะเอ�ยดในก่ารสร�างเซ+ร�ฟเวอร�จ"าลี่อง ด�งน� - Server Name : ช้�'อของเว�บเซ+ร�ฟเวอร�(ค�าป็ก่ต์+ค�อ Localhost)- Adminnistator’s Email Address : อ�เมลี่�แอดเดรดของผู้��ด�แลี่ระบบ(ไม�จ"าเป็*นต์�องเป็*นอ�เมลี่�จร+งก่�ได�)- Apache HTTP Port : หมายเลี่ขพ่อร�ต์ในก่ารเช้�'อมต์�อโป็รโต์คอลี่ (ค�าป็ก่ต์+ค�อ 80)- จาก่น� นให�คลี่+ก่ป็1:ม Next

Page 8: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

7. ท�'หน�าต์�าง MySQL Server Configuration จะเป็*นก่ารก่"าหนดค�าก่ารใช้�งานให�ก่�บฐานข�อม�ลี่ MySQL ด�งน� • Enter root password แลี่ะ Re-enter root

password ก่รอก่รห�สผู้�านส"าหร�บใช้�งานฐานข�อม�ลี่ท�'ต์�องก่ารลี่งไป็ในช้�องท� งสองให�เหม�อนก่�น

• เลี่�อก่ UTF-8 Unicode ในรายก่าร Character Sets Collations เพ่�'อเลี่�อก่รห�สต์�วอ�ก่ษรส"าหร�บใช้�งานฐานข�อม�ลี่

• จาก่น� นให�คลี่+ก่ป็1:ม Install

Page 9: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

8. ให�รอจนก่ว�าจะต์+ดต์� งโป็รแก่รมเสร�จ

9. จาก่น� นจะแสดงหน�าต์�างแจ�งก่ารต์+ดต์� งเสร�จสมบ�รณ� พ่ร�อมก่�บม�ต์�วเลี่�อก่ว�า จะเป็;ดใช้�งาน Apache แลี่ะ MySQL หร�อไม� ให�คลี่+ก่ป็1:ม Finish

เพ่�ยงเท�าน� คอมพ่+วเต์อร�ของเราก่�พ่ร�อมใช้�งานเป็*นเซ+ร�ฟเวอร�จ"าลี่องแลี่�วโดยไม�ต์�องม�ก่ารร�สต์าร�ทเคร�'องคอมพ่+วเต์อร�ใหม�

Page 10: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

ที่ดลัองเร�ยกใช้�งาน่หลี่�งจาก่ต์+ดต์� งโป็รแก่รม AppServ เสร�จแลี่�ว เราสามารถึทดลี่องเร�ยก่ใช้�งานได� โดยเป็;ดโป็รแก่รมเว�บบราวเซอร�ข$ นมา โดยพ่+มพ่� http://localhost หร�อ http://127.0.0.1 ลี่งในช้�อง Address bar ก่�จะป็ราก่ฏิหน�าเว�บเพ่จด�งภาพ่

Page 11: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

สร�างฐาน่ข้�อม,ลัให�กบเว�บไซต์� Joomla!ข� นต์อนต์�อไป็ค�อ ก่ารสร�างฐานข�อม�ลี่เพ่�'อเก่�บข�อม�ลี่

ต์�าง ๆ ของเว�ยไซต์�ซ$'งม�ข� นต์อนด�งน� 1. เป็;ดโป็รแก่รมเว�บบราวเซอร�ข$ นมา แลี่�วพ่+ม http://localhost หร�อ http://127.0.0.12. คลี่+ก่ท�'ลี่+งค� phpMyAdmin เพ่�'อสร�างฐานข�อม�ลี่

Page 12: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

3. จะป็ราก่ฏิไดอลี่�อก่บลี่�อก่ซ�ข$ นมา ให�ใส�ช้�'อผู้��ใช้� (Username) แลี่ะรห�สผู้�าน (Password) ส"าหร�บใช้�งานฐานข�อม�ลี่ท�'ก่รอก่ต์อนต์+ดต์ต์� งโป็รแก่รม Apserv4. คลี่+ก่ป็1:ม เข�าส��ระบบ (OK)5. จาก่น� นจะเป็;ดหน�าเว�บเพ่ phpMyAdmin ข$ นมา ให�ใส�ช้�'อฐานข�อม�ลี่ท�'จะสร�างในช้�อง สร�างฐานข�อม�ลี่ใหม� ในท�'น� ค�อ JoomlaDB6. เลี่�อก่ว+ธิ�แป็ลี่งรห�สของฐานข�อม�ลี่ แบบ utf8_unocode_ci7. คลี่+ก่ป็1:ม สร�าง

Page 13: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

จาก่น� นจะแสดงข�อความว�าสร�างฐานข�อม�ลี่ส"าเร�จแลี่�ว

Page 14: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

ดาวโหลัดแลัะต์#ดต์)ง Joomla!เม�'อสร�างฐานข�อม�ลี่ส"าเร�จเร�ยบร�อยแลี่�ว ข� น

ต์อนต์�อไป็ค�อก่ารดาวน�ไหลี่ดแลี่ะต์+ดต์� ง Joomla! เพ่�'อสร�างเว�บไซต์�ก่�น โดหน�งส�อเลี่�มน� จะใช้� Joomla! เวอร�ช้� 'น 2.5 เป็*นหลี่�ก่

ก่�อนจะสร�างเว�บไซต์�ด�ว Joomla! ได�น� น จะต์�องต์+ดต์� ง Joomla! บนเซ+ร�ฟเวอร"าลี่องเส�ก่�อน โดยดาวน�โหลี่ด Joomla! ได�ท�'เว�บไซต์�www.joomla.org/download.html แลี่�วเลี่�อก่เวอร�ช้� 'นท�'ต์�องก่ารดาวน�โหลี่ด

Page 15: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

ต์#ดต์)ง Joomla! บน่เซ#ร�ฟเวอร�จั$าลัองเม�'อดาวโหลี่ดไฟลี่�เสร�จให�แต์ก่ไฟลี่�ไว�ท�'โฟรเดอร�

C:\AppServ\www\โดยสร�างโฟรเดอร�ข$ นมาใหม�ช้�'อ Joomla เม�'อเข�าไป็ด�ในโฟรเดอร� C:\AppServ\www\joomla หลี่�งจาก่แต์ก่ไฟลี่�เร�ยบร�อยแลี่�วจะได�ไฟลี่�ต์�าง ๆ ด�งภาพ่

Page 16: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

หลี่�งจาก่น� นให�ท"าก่าต์+ดต์� ง Joomla! ด�งน� เป็;ดโป็รแก่รมเว�บบราวเซอร�ข$ นมา แลี่�วพ่+มพ่�

http://127.0.0.1/joomla จาก่น� นจะเข�าส��หน�าเว�บเพ่จก่ารต์+ดต์ต์� ง Joomla! ข� นต์อนท�' 1 เลี่�อก่ภาษา ให�คลี่+ก่ ไทย (ภาษาไทย) เพ่�'อเลี่�อก่ภาษาท�'ใช้�

คลี่+ก่ป็1:ม ต์�อไป็ (Next)

Page 17: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

- จาก่น� นจะเข�าส��เว�บบเพ่จ ข� นต์อนท�' 2 ให�คลี่+ก่ป็1:ม ต์�อไป็- เข�าส�เว�บเพ่จข� นต์อนท�' 3 ลี่+ขส+ทธิ+< ให�คลี่+ก่ป็1:ม ต์�อไป็

Page 18: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

เข�าเว�บเพ่จข� นต์อนท�' 4 ก่ารต์� งค�าฐานข�อม�ลี่ โดจะต์�องก่"าหนดค�าข�อม�ลี่เก่�ยวก่�บฐานข�อม�ลี่ต์�างๆ ด�งน� • ช้น+ดฐานข�อม�ลี่ ให�เลี่�อก่ช้น+ดฐานข�อม�ลี่เป็*น

mysql• ช้�'อโฮสต์� ให�ใส�เป็*น Localhost• ช้�'อผู้��ใช้�ฐานข�อม�ลี่ หมายถึ$งช้�'อผู้��ใช้�งาน

(username) ส"าหร�บเข�าใช้�งานฐานข�อม�ลี่ ในท�'น� ค�อ root ซ$'งเป็*นค�าป็ก่ต์+

• รห�สผู้�าน ให�ใส�รห�สผู้�านส"าหร�บเข�าใช้�งานฐานข�อม�ลี่ต์ามท�'ก่"าหนดในข� นต์อนต์+ดต์� ง ApServ (ถึ�าไม�ได�ก่"าหดให�ว�นเว�นว�างไว�)

• ช้�'อฐานข�อม�ลี่ ให�ใส�ช้�'อฐานข�อม�ลี่ท�'ได�สร�างไว�คลี่+ก่ป็1:ม ต์�อไป็

Page 19: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

เข�าส��เว�บเพ่จข� นต์อนท�' 5 ต์� งค�า FTP เพ่�'อก่"าหนดค1ณสมบ�ต์+ท�'ใช้�ในก่ารอ�พ่โหลี่ดไฟลี่�ต์�างๆ ไป็ย�งเซ+ร�ฟเวอร�จร+งซ$'งเราไม�จ"าเป็*นต์�องก่"าหนดในต์อนน� ให�คลี่+ก่ป็1:ม ต์�อไป็

Page 20: หน่วยที่ 9 จัดการหน้าแรกให้กับเว็บไซต์

เข�าส��เว�บเพ่จข� นต์อนท�' 6 ต์� งค�าหลี่�ก่ของเว�บ โดก่"าหนดค�าข�อม�ลี่ท�'จ"าเป็*นด�งน� • ช้�'อเว�บ ให�ใส�ช้�'อเว�บไซต์�ท�'ต์�องก่ารลี่งไป็ สามารถึก่"าหนดเป็*นภาษา

ไมยหร�อภาษาอ�งก่ฤษก่�ได� (สามารถึเป็ลี่�'ยนแป็ลี่งได�ภายหลี่�ง)• อ�เมลี่ของค1ณ ใส�อ�เมลี่�ของผู้��ด�แลี่เว�บไซต์�• ช้�'อเข�าระบบของผู้��ด�แลี่ ค�าป็ก่ต์+ค�อ admin• รห�สผู้�านผู้��ด�แลี่ แลี่ะ ย�นย�นรห�สผู้�านผู้��ด�แลี่ ใส�รห�สผู้�านส"าหร�บผู้��

ด�แลี่เว�บไซต์� ให�เหม�อนก่�นท� ง 2 ช้�อง คลี่+ก่ป็1:ม ต์�อไป็