1. TRUNG TAÂM TIN HOÏC - ÑAÏI HOÏC KHOA HOÏC TÖÏ NHIEÂN TP. HCM
227 Nguyeãn Vaên Cöø – Quaän 5 – Tp. Hoà Chí Minh
Tel: 8351056 – Fax 8324466 – Email: ttth@hcmuns.edu.vn
BÀI TẬP
CHUYÊN ĐỀ
LẬP TRÌNH WEB NÂNG
CAO VỚI JOOMLA
Maõ taøi lieäu: DT_NCM_CD_BT_LTWCSJ
Phieân baûn 1.0 – Thaùng 03/2010

2. Bài tập
BÀI 1: TỔNG QUAN VỀ JOOMLA
1. Tạo các trang web đơn
- Tạo các trang web đơn cho website. Ví dụ: trang chủ, giới thiệu công ty, liên hệ, thông tin
tuyển dụng, …
- Tạo menu link tới các trang web trên
2. Tạo các mục tin tức (Section)
Thế giới
Thể thao
Kinh doanh
Khoa học
- Tạo menu để hiển thị các Section trên (Loại Menu Item là Section Blog Layout)
3. Tạo các loại tin tức (Category)
- Tạo các category cho các Section của bài 1.2:
Section Category
Thế giới Thế giới muôn màu
Chiều thứ 7
Thể thao Bóng đá
Tennis
Kinh doanh Chứng khoán
Bất động sản
Khoa học Môi trường
Thiên nhiên
- Tạo menu để hiển thị các Category trên (Loại Menu Item là Category Blog Layout)
4. Tạo nội dung cho các bài viết
+ Vào trang http://tuoitre.vn hoặc http://vnexpress.net để lấy nội dung cho các bài viết.
+ Sửa lại link các hình ảnh trong bài viết để chúng thuộc về website của chúng ta.
+ Cấu hình các Section, Category để hiển thị nội dung bài viết như sau:
o 1 bài viết mới nhất sẽ nằm trên cùng và chiếm hết chiều ngang (leading)
o Các bài viết dạng giới thiệu sẽ chia làm 2 cột hiển thị (columns)
o Số bài viết dạng giới thiệu là 8 (intro)
o Số bài viết dạng link là 5 (links)
+ Cấu hình cho phép người dùng click vào tiêu đề bài viết để xem chi tiết thông tin bài viết và ẩn
đi link Read More.
Lập trình Web chuyên sâu với Joomla Trang 1/15

3. Bài tập
BÀI 2: TEMPLATES
1. Bổ sung position cho template
Thêm 2 position user5 và user6 ở đầu template beez. Đặt các module Latest News và Popular
vào 2 position này.
v Hướng dẫn:
• Vào thư mục chứa source của template beez (joomlatemplatesbeez).
• Mở file templateDetails.xml và định nghĩa thêm 2 position user5 và user6.
• Mở file index.php và dùng thẻ <jdoc:include type=”modules”> để định nghĩa 2 position user5
và user6.
2. Tạo template cho website quản lý bán sách.
Template có layout và các postions như sau:
header
top
User1
right
left
component
Lập trình Web chuyên sâu với Joomla Trang 2/15

4. Bài tập
BÀI 3: COMPONENT Ở FRONT END
1. Tạo component hiển thị danh sách Sách dạng table (com_dssach)
2. Tạo component hiển thị danh sách Sách dạng list (com_sach).
3. Tạo link cho tên sách và xử lý hiển thị thong tin chi tiết sách khi người dùng click vào tên sách
Lập trình Web chuyên sâu với Joomla Trang 3/15

5. Bài tập
Khi click vào tên sách thì hiển thị thông tin chi tiết sách
Lập trình Web chuyên sâu với Joomla Trang 4/15

6. Bài tập
BÀI 4: MODULE
1. Tạo module danh sách chủ đề
2. Tạo module liệt kê các sách mới
(Lưu ý: lấy các sách có 5 ngày cập nhật gần nhất)
3. Bổ sung phần cấu hình tham số cho module liệt kê các sách mới và đóng gói module này.
4. Tạo link cho module chủ đề sách để khi click vào link thì hiển thị danh sách sách theo chủ đề
(hiệu chỉnh component danh sách sách)
Tạo link cho các chủ đề để khi click chọn chủ đề thì hiển thị danh sách sách ứng với chủ đề (Vd:
link chủ đề Tiếng Việt: index.php?option=com_sach&mcd=3)
Lập trình Web chuyên sâu với Joomla Trang 5/15

7. Bài tập
Lập trình Web chuyên sâu với Joomla Trang 6/15

8. Bài tập
BÀI 5: CÁC LỚP TIỆN ÍCH
1. Bổ sung ngày cập nhật cho module sách mới và định dạng ngày/tháng/năm
2. Tạo các combobox cho phép người dùng chọn chủ đề và nhà xuất bản.
- Xử lý giữ giá trị chọn khi người dùng click vào nút Submit
3. Tạo pathway cho com_sach
- Khi click vào chủ đề sách thì pathway là:
- Khi click vào tên sách ở màn hình danh sách sách thì pathway là:
4. Thiết kế màn hình cập nhật dữ liệu cho bảng Sách
- Màn hình này có 3 nút Save, Apply và Cancel
- Khi click vào nút Save thì di chuyển sang trang: ?option=com_sach và xuất câu thông báo lưu
trữ thành công.
- Khi click vào nút Apply thì vẫn ở trang cập nhật và xuất câu thông báo lưu trữ thành công.
- Khi click vào nút Canel thì chuyển sang trang ?option=com_sach (không xuất thông báo).
Lập trình Web chuyên sâu với Joomla Trang 7/15

9. Bài tập
Lập trình Web chuyên sâu với Joomla Trang 8/15

10. Bài tập
BÀI 6: COMPONENT Ở BACK END
1. Tạo com_khach_hang hiển thị danh sách khách hàng
2. Tạo com_sach có chức năng hiển thị dữ liệu sách bảng dưới dạng lưới.
3. Bổ sung xử lý phân trang cho com_khach_hang và com_sach.
Thanh phân trang
4. Bổ sung Toolbar cho com_khach_hang và com_sach
5. Bổ sung chức năng thêm, xóa, sửa thông tin khách hàng cho com_khach_hang
Lập trình Web chuyên sâu với Joomla Trang 9/15

11. Bài tập
v Màn hình liệt kê khách hàng dạng bảng:
v khi click vào họ tên thì chuyển sang màn hình Edit thông tin khách hàng
6. Bổ sung chức năng quản lý thông tin sách (thêm, xóa, sửa) cho com_sach
v Liệt kê sách dạng bảng
Lập trình Web chuyên sâu với Joomla Trang 10/15

12. Bài tập
v Khi click vào tên sách thì chuyển sang màn hình cập nhật thông tin sách
v Giao diện màn hình thêm mới thông tin sách tương tự giao diện màn hình cập nhật thông tin
sách.
7. Đóng gói component.
Tạo file sach.xml để cấu hình cài đặt com_sach và đóng gói com_sach.
Lập trình Web chuyên sâu với Joomla Trang 11/15

13. Bài tập
BÀI 7: XỬ LÝ ĐA NGÔN NGỮ
1. Cài đặt thành phần mở rộng JoomFish và cấu hình để website hỗ trợ 2 thứ tiếng: Anh và
Việt.
2. Bổ sung tính năng đa ngôn ngữ (tiếng Anh và tiếng Việt) cho các tiêu đề của
com_khach_hang
Tiếng anh:
Tiếng Việt:
3. Tạo file content element cho bảng sách để JoomFish có thể xử lý đa ngôn ngữ cho nội
dung của bảng Sách. Các cột cần xử lý là: Tên sách, Mô tả.
Lập trình Web chuyên sâu với Joomla Trang 12/15

14. Bài tập
BÀI 8: COMPONENT THEO MÔ HÌNH MVC
1. Tạo com_khach_hang theo mô hình MVC, có chức năng liệt kê danh sách khách hàng.
2. Tạo component com_sach ở Front End theo mô hình MVC, gồm các chức năng:
• Liệt kê danh sách sách.
• Hiển thị chi tiết sách
• Chọn mua sách
o Khi click vào nút chọn mua ở màn hình danh sách Sách hoặc chi tiết sách thì cập nhật
thông tin giỏ hàng chứa trong module giỏ hàng:
o Tạo Module giỏ hàng: hiển thị tổng số tiền mà khách hàng đã chọn mua sách (hiển thị
tổng tiền từ session).
Khi click vào link xem giỏ hàng thì di chuyển đến trang hiển thị danh sách giỏ hàng
• Hiển thị giỏ hàng
o Hiển thị danh sách giỏ hàng được lưu trong session.
o Xử lý xóa cho giỏ hàng khi click vào link Xóa.
o Khi cập nhật số lượng thì tính lại thành tiền và tổng tiền
Lập trình Web chuyên sâu với Joomla Trang 13/15

15. Bài tập
BÀI 9: PLUGIN
1. Tạo plugin loại Seach để bổ sung tính năng tìm kiếm sách cho chức năng Seach của
Joomla
Hướng dẫn: Tạo plugin plgSearchSach và xử lý biến cố onSearch
Lập trình Web chuyên sâu với Joomla Trang 14/15

16. Bài tập
Phụ lục
1. Lược đồ cơ sở dữ liệu
Lập trình Web chuyên sâu với Joomla Trang 15/15