Joomla + Virtuemart

1. Joomla + Virtuemart Lab1 ติดตั้ง Joomlaและ Virtuemart

2. ทำความรู้จัก Joomla

3. ทำความรู้จัก Joomla • Componet - เป็นโปรแกรมเสริมไว้คอยช่วยเหลือการทำงานเฉพาะทางที่ต้องการ เช่น การแสดงผลแกลอรี่โชว์ เว็บบอร์ด เป็นต้น • Module - เป็นฟังก์ชั่นการทำงานบางส่วนจากคอมโพเน้น ซึ่งสามารถกำหนดตำแหน่งแสดงผลในหน้าเว็บไซต์ได้ • Plug in - เป็นส่วนเพิ่มเติมความสามารถให้กับคอมโพเน้นท์ หรือโปรแกรมหลัก ให้สามารถแบ่งออกเป็นประเภทและหมวดหมู่ได้ตามต้องการ • Template เป็นรูปแบบหรือหน้าตาของเว็บไซต์ที่แสดงให้เห็นถึงเอกลักษณ์และความเป็นตัวตนของเว็บไซต์นั้นๆ

4. การทำงานของ Joomla • มี 2 ส่วน : หน้าเว็บไซต์และหน้าผู้ดูแลระบบ • หน้าเว็บไซต์ - แสดงเนื้อหา รูปภาพ หรือดีไซน์ที่บ่งบอกถึงเอกลักษณ์ และตัวตนของเว็บไซต์นั้นๆ ซึ่งผู้เข้าชมสามารถเห็นข้อมูลเหล่านี้ได้ผ่านบราวเซอร์ • หน้าผู้ดูแลระบบ - ส่วนของการจัดการข้อมูลทั้งหมดบนเว็บไซต์ โดยเข้าผ่านทางที่อยู่ของเว็บไซต์ตามด้วย Administrator

5. ทำไมต้อง Joomla • ใช้เวลาในการพัฒนาเว็บไซต์น้อยลง • ความสะดวกและง่ายในการใช้งาน • ไม่ยุ่งยากหรือปวดหัวจากการเขียนโปรแกรม • ประหยัดค่าใช้จ่าย • มีสังคมออนไลน์ที่คอยช่วยเหลือ

6. ขั้นตอนที่ 1 จำลอง Server • เราสามารถจำลองเครื่องคอมพิวเตอร์ให้ทำหน้าที่เป็นเว็บเซริฟเวอร์ โดยใช้โปรแกรมAppServeหรือ XAMPP • สามารถดาวโหลดได้ที่ http://sourceforge.net/projects/appserv/files/AppServ%20Open%20Project/2.5.10/

7. ขั้นตอนที่ 2ติดตั้ง Joomla 2.5 • ดาวโหลด joomla package file ได้ที่ http://www.joomla.org/download.html • จะได้เป็น Zip ไฟล์ ทำการแยกไฟล์และไปวางที่โฟลเดอร์ • C:\Appserve\www << กรณีใช้ Appserve • C:\XAMPP\htdocs << กรณีใช้ XAMPP

8. ขั้นตอนที่ 2ติดตั้ง Joomla 2.5

9. เปิด web browser กรอก URL เป็น http://localhost/joomlaหรือตามด้วยชื่อไฟลเดอร์ที่ตั้งขึ้น

10. จะแสดงหน้าจอสำหรับติดตั้ง Joomlaให้เลือกภาษาไทย แล้วคลิก ต่อไป

11. จะแสดงหน้าจอตรวจสอบระบบก่อนการติดตั้ง ให้คลิกปุ่ม ต่อไป

12. จะแสดงหน้ารายละเอียดลิขสิทธิ์ ให้คลิกปุ่ม ต่อไป

13. จะแสดงหน้าจอตั้งค่าการเชื่อมต่อฐานข้อมูล ให้กรอกรายข้อมูลดังนี้ ชนิดของฐานข้อมูล เลือก Mysql / ชื่อโฮส กรอกค่าเป็นlocalhost / ชื่อผู้ใช้ฐานข้อมูลกรอกเป็น root รหัสผ่าน หากไม่ได้กำหนดค่าให้ปล่อยว่าง / ชื่อฐานข้อมูล กรอกค่าเป็น joomla_database คำนำหน้าตาราง หากไม่ต้องการเปลี่ยนสามารถกำหนดเป็นค่าตามที่ระบบตั้งมาให้ได้ หากเคยติดตั้งjoomlaแล้ว คลิกเลือเป็น สำรองฐานข้อมูล เมื่อกรอกเสร็จแล้วให้คลิก ต่อไป

14. จะแสดงหน้าจอการตั้งค่า FTPซึ่งสามารถข้าวขั้นตอนนี้ไปได้ให้คลิกปุ่ม ต่อไป

15. จะแสดงหน้าจอสำหรับกรอกรายละเอียดการตั้งค่าของเว็บไซต์ ชื่อเว็บ - กรอกชื่อเว็บไซต์ อีเมล- กรอกอีเมล ชื่อเข้าระบบของผู้ดูแล - กรอก username รหัสผ่าน - กำหนดรหัสผ่านสำหรับผู้ดูแลระบบ ยืนยันรหัสผ่าน - กรอกรหัสผ่านเพื่อยืนยันว่าตรงกัน เลือกข้อมูลตัวอย่าง - เลือกข้อมูลตัวอย่างจากทีมงาน ปุ่มติดตั้งข้อมูลตัวอย่าง - คลิกที่ปุ่ม ‘ติดตั้งข้อมูลตัวอย่าง’ หรือสามารถข้ามไปได้หากไม่ต้องการติดตั้ง เสร็จแล้วคลิป ต่อไป

16. จะแสดงหน้าจอแสดงการติดตั้งเสร็จสมบูรณ์ ให้ลบโฟลเดอร์ installation ออก ที่โฟลเดอร์ joomla

17. ถ้าคลิกแสดงหน้าเว็บ จะได้หน้าเว็บไซต์ดังรูป

18. ถ้าต้องการเข้าระบบผู้ดูแล สามารถพิมพ์ administrator ต่อจาก urlของหน้าเว็บไซต์

19. จะแสดงหน้าจอเข้าทำงานของผู้ดูแลระบบใส่ username และ password ที่เคยกำหนดไว้ตอนติดตั้ง

20. หน้าจอควบคุมการทำงานของผู้ดูแล

21. ขั้นตอนที่ 3 ติดตั้งภาษาไทยให้ Joomla • download แพ็กเกจไฟล์ภาษา ได้ที่ http://joomlacode.org/gf/project/thai/frs/ • เลือกไฟล์แพ็กเก็จ languagefileforJoomla 2.5 • ดาวโหลดเสร็จจะได้เป็น zip ไฟล์

23. เมื่อได้ไฟล์แล้ว ไปที่หน้าจอแอดมิน ไปที่ extension และคลิก extension manager

24. คลิก เรียกดู browse เลือกไฟล์ภาษาไทยที่ดาวโหลดมา แล้วให้คลิก upload and install

25. ระบบจะแจ้งว่าการ install เสร้จเรียบร้อย

26. 3 1 2 เมื่อต้องการติดตั้งภาษาไทยในการทำงานหน้าผู้ดูแล ให้คลิก install language จากนั้นเลือกภาษาไทย แล้วคลืกที่ install

27. เลือก installed –Site ก่อน และให้คลิกที่ภาษาไทย แล้ว คลิกที่ default รูปดาว ทำแบบเดียวกันที่กับ installed – Administrator

28. Control panelก็จะเปลี่ยนเป็นภาษาไทย

29. ขั้นตอนที่ 3 ติดตั้ง virtuemart • download virtuemart ที่เว็บไซต์ http://virtuemart.net/downloads

30. ไฟล์ที่ดาวโหลดมาจะอยู่ในรูปแบบ zip ไฟล์ เมื่อแยกไฟล์แล้วจะแสดงไฟล์ย่อย สองไฟล์ ในการติดตั้ง component virtuemart ไปที่ extension manager

31. เลือกไฟล์ com_virtuemart.2.0.24.tar.gz ก่อน คลิกปุ่ม upload & install

32. จะแสดงผลดังรูปเมื่อ installed เรียบร้อย ให้คลิกที่ install sample data เพื่อเพิ่มข้อมูลตัวอย่าง

33. ไปที่ extension manager อีกครั้งเพื่อทำการintall ไฟล aioซึ่งเป็นคอมโพเน้นระบบ shopping cart ทำตามกระบวนการเดิม แต่เลือกไฟล์aio

34. เมื่อ install ตัว aioสำเร็จจะแสดงผลดังรูป

35. ในเมนู component ของ joomlaจะแสดงรายการของ VirtueMartแสดงว่ามีการติดตั้งเรียบร้อย