Biên soạn: Nguyễn Tấn Thành
Email:
TRƯỜNG ĐH CÔNG NGHỆ THÔNG TIN
ĐẠI HỌC QUỐC GIA THÀNH PHỐ HỒ CHÍ MINH
KHOA MẠNG MÁY TÍNH & TRUYỀN THÔNG – LỚP MMT03
–
&
—PHIÊN BẢN THỬ NGHIỆM - LƯU HÀNH NỘI BỘ
2
GIÁO TRÌNH THIẾT KẾ WEB VỚI JOOMLA
LỜI CỦA TÁC GIẢ
Xin kính chào các bạn! Tôi không phải là một người chuyên nghiệp trong lĩnh vực thiết kế web.
Tôi cũng không phải là một giáo viên dạy công nghệ thông tin. Đây là đầu tiên trong đời tôi tự
viết được một cuốn sách và chia sẽ nó cho cộng động. Tôi rất vui vì điều này, và tôi tin chắc
những bạn IT nào cũng có cảm giác đó như tôi.
Chuyên đề THIẾT KẾ WEB VỚI JOOMLA này là những ngày đêm miệt mài nghiên cứu của
tôi. Tôi rất vinh hạnh chia sẽ kiến thức của mình cho các bạn. Đặc biệt là những bạn mới làm
quen với Joomla, để các bạn không phải mệt óc với cả khối tài liệu rời rạc, vừa tiếng Anh, vừa
tiếng Việt trên mạng như hiện nay.
Với tất cả những gì có thể tôi đã biên soạn thành công tài liệu thiết kế web với Joomla này bao
gồm những nội dung cơ bản nhất giúp các bạn tự tạo, và quản trị một website đơn giãn bằng
Joomla. Bạn sẽ bắt đầu với việc tìm hiểu về những nguyên lý hoạt động của internet và

CHƯƠNG 1: CÁC VẤN ĐỀ TRƯỚC KHI SỬ DỤNG JOOMLA 7
BÀI 1: INTERNET 7
I: GIAO THỨC (PROTOCOL) 7
II: PHÂN LOẠI WEB 8
BÀI 2: DOMAIN AND HOSTING 9
I: DOMAIN 9
II: HOSTING 10
BÀI 3: NGÔN NGỮ LẬP TRÌNH VÀ CƠ SỞ DỮ LIỆU 11
I: NGÔN NGỮ LẬP TRÌNH 11
II: CƠ SỞ DỮ LIỆU (DATABASES) 12
BÀI 4: CÀI ĐẶT WEB SERVER XAMPP 12
I: GIỚI THIỆU 12
II: CÀI ĐẶT 12
III: CẤU HÌNH 16
BÀI 5: QUẢN TRỊ CƠ SỞ DỮ LIỆU BẰNG PHPMYADMIN 18
I: GIỚI THIỆU 18
II: THAY ĐỔI MẬT KHẨU TRUY CẬP DỮ LIỆU 18
III: QUẢN TRỊ CƠ SỞ DỮ LIỆU 19
BÀI 6: QUẢN TRỊ CSDL BẰNG NAVICAT 24
I: GIỚI THIỆU 24
II: QUẢN TRỊ CSDL VỚI NAVICAT 24
BÀI 7: LẬP TRÌNH PHP 27
CHƯƠNG 2: CÀI ĐẶT VÀ CẤU HÌNH JOOMLA 48
BÀI 1: GIỚI THIỆU JOOMLA 48
I: VỀ JOOMLA 48
II: CÁC THÀNH PHẦN MỞ RỘNG CỦA JOOMLA 49
III : CÁC THUẬT NGỮ 50
BÀI 2: CÀI ĐẶT JOOMLA 52
BÀI 3 : GIỚI THIỆU GIAO DIỆN LÀM VIỆC CỦA ADMIN 57
I: GIAO DIỆN LÀM VIỆC 57

HƯỚNG DẪN CÀI ĐẶT TEMPLATE 80
CẤU TRÚC GÓI CÀI ĐẶT CỦA TEMPLATE 82
TẬP HỢP CÁC TRANG CUNG CấP TEMPLATE FREE 82
BÀI 3: MODULE 83
TẠO MỚI MỘT MODULE 84
BÀI 4: PLUGIN 85
PHÂN LOẠI PLUGIN 85
BÀI 5: KHAI THÁC COMPONENT 86
I : Banner 86
II: Contacts 88
II: News Feed 88
IV: Polls 89
V: Search 90
VI: Web Links 90
BÀI 6: TẠO VÀ QUẢN LÝ MENU 91
Tạo Menu 91
MENU Đặc Biệt 92
Tạo DropDown Menu 93
BÀI 7: KHAI THÁC MODULE CÓ SẴN TRONG JOOMLA 94
I: Latest News (Tin mới nhất), Popular (Tin đọc nhiều nhất) 94
II: Who’s Online 94
III: News Flash 95

PHIÊN BẢN THỬ NGHIỆM – LƯU HÀNH NỘI BỘ

5
GIÁO TRÌNH THIẾT KẾ WEB VỚI JOOMLA
IV: Customs HTML 95
CHƯƠNG 5: TIẾNG VIỆT TRONG JOOMLA 96
BÀI 1: VIỆT HÓA JOOMLA 96

I: CÀI ĐẶT KUNENA 119
II: TẠO MỚI CÁC DANH MỤC TRONG FORUM 119
III: NHỮNG CHỨC NĂNG KHÁC 121
BÀI 7: TẠO WEB NHẠC VỚI MAIAN MUSIC 122
CÀI ĐẶT 122
SỬ DỤNG MAIANMUSIC 124
HIỂN THỊ CÁC BÀI HÁT MỚI ĐĂNG 130
VIỆT HÓA MAIAN MUSIC 131

PHIÊN BẢN THỬ NGHIỆM - LƯU HÀNH NỘI BỘ
6
GIÁO TRÌNH THIẾT KẾ WEB VỚI JOOMLA
BÀI 8: TẠO WEB ẢNH PHOCA GALLERY 132
QUẢN LÝ ALBUM 132
HIỂN THỊ ALBUM 133
THEME CHO PHOCA GALLERY 134
MODULE PHOCA GALLERY MENU 135
BÀI 9: TẠO MENU VỚI SWMENUFREE 136
BÀI 10: PLUGIN CHÈN NHẠC – VIDEO 139
CHƯƠNG 7: NHỮNG VẤN ĐỀ NÂNG CAO KHI QUẢN TRỊ WEB VỚI JOOMLA 141
BÀI 1: ĐẢM BẢO AN TOÀN CHO WEBSITE 141
I:BACKUP WEBSITE & DATABASE 141
II: THAY ĐỔI TIỀN TỐ MẶC ĐỊNH CHO DATABASE 142
III: THAY ĐỔI ĐƯỜNG DẪN MẶC ĐỊNH CHO TRANG QUẢN TRỊ 144
BÀI 2: TỐI ƯU HÓA WEBSITE 145
I: SỬ DỤNG CACHING 145
II: TỐI ƯU HÓA DATABASE 146
III: TẠO ĐƯỜNG DẪN THÂN THIỆN 147
IV: MỘT SỐ PHƯƠNG PHÁP TỐI ƯU KHÁC 148
BÀI 3: XUẤT BẢN WEBSITE LÊN INTERNET 148

2: Giao thức HTTP
Hyper Text Transfer Protocol (HTTP)
Là trái tim của web. Giao thức HTTP được triển khai trên cả hai phía Client và Server.
HTTP quy định cách thức trao đổi thông tin thông qua việc giao tiếp bằng các thông điệp
HTTP.
HTTP xác định cách thức trình duyệt yêu cầu một trang web từ web server cũng như
các thức mà server sẽ gửi trả kết quả cho web client.
Trang web (Web pages – còn gọi là một tập tin web) :
Chứa các đối tượng (Object). Đơn giãn đó chỉ là một file text, hay là một tập tin hình
ảnh, âm nhạc…Đối tượng được xác định qua URL. Trang web chứa các một file HTML
cơ sở và tham chiếu đến các đối tượng khác.
Trình duyệt (Browser – Web Client)
Chương trình giao tiếp người dùng của ứng dụng Web cho phép hiển thị trang web.
Browser cài đặt phía client của giao thức HTTP. Hiện nay có nhiều phần mềm trình
duyệt phổ biến như Internet Explorer, Firefor, Opera…
Web server

PHIÊN BẢN THỬ NGHIỆM - LƯU HÀNH NỘI BỘ
8
GIÁO TRÌNH THIẾT KẾ WEB VỚI JOOMLA
Là nơi lưu trữ website, và trả lời yêu cầu từ phía web client. Một số phần mềm phía
server phổ biến như Microsoft Internet Information Server (IIS), Appache, Nestcape
Enterprise Server (NES)…
URL (Uniform Resource Locator)
Là một tên gọi khác của địa chỉ web. URL bao giồm tên giao thức (là HTTP hay
FTP…), kế đến dấu hai chấm và hai dấu xuyệt sắc (://), ví dụ địa chỉ
dẫn đến website có địa chỉ là www.uit.edu.vn bằng giao thức
HTTP. Khi truy cập chúng ta có thể bỏ qua tiền tố http:// vì trình duyệt mặc định thêm
thành phần này vào. Một URL phải chính xác đến từng ký tự, vì chỉ cần thêm một dấu
chấm là đã dẫn đến một trang web khác.


9
GIÁO TRÌNH THIẾT KẾ WEB VỚI JOOMLA
Sau khi bấm nút Submit ở biễu mẫu, nếu dữ liệu đó có lưu trữ lại cho phiên làm việc
sau của người dùng thì đó là Web động. Web động có tương tác đến một cơ sở dữ liệu
lưu trữ trên mạng để hiển thị thông tin cho người dùng.
Lưu ý:
Bạn đừng bao giờ cho rằng một trang web có những tấm hình nhảy múa là web động.
Đó chỉ là một tập tin ảnh động mà thôi.
Web động là web có tương tác với cơ sở dữ liệu, đừng bao giờ định nghĩa web động là
web có from đăng nhập. Một trang web có from đăng nhập chưa chắc là web động, có
thể thông tin đăng nhập chỉ lưu trong một biến nào đó của ngôn ngữ lập trình.
Cũng đừng bao giờ định nghĩa web tĩnh là web lập trình bằng HTML, còn web động là
web lập trình bằng PHP hay Java…Những trang web lập trình bằng PHP chưa chắc là
web động, nếu nó chỉ dùng để hiển thị thông tin.
BÀI 2: DOMAIN AND HOSTING
I: DOMAIN
1: Cấu trúc một địa chỉ
Domain (miền)
Bạn truy cập vào địa thành phần .com phía sau được gọi là
Domain Name.
Thành phần miền được quản lý bởi của ISP khu vực, và đơn vị phụ trách quản lý tên
miền trên toàn thế giới là ICANN.
Host name
Thành phần google như ví dụ trên chính là host name. Để có thể đưa website ra cộng
đồng bạn cần mua một địa chỉ. Địa chỉ này gọi là Domain Name. Ví dụ ở đây chúng ta
cần phải mua google.com
Thỉnh thoảng bạn cũng lấy một domain có hai thành phần ví dụ như .com.vn. Nó được
cấp phát và quản lý bỡi nhà quản lý domain cấp cao, trong ví dụ này là .vn
2: Tại sao phải sử dụng domain name

Web site phức tạp đòi hỏi một gói dịch vụ toàn diện hơn, cung cấp khả năng hỗ trợ cơ sở
dữ liệu và các hệ nền phát triển ứng dụng (như PHP, Java, ASP.NET). Những tính năng
này cho phép người dùng viết hoặc cài đặt script cho các ứng dụng như diễn đàn hay
quản lý nội dung. Các Web site thương mại điện tử còn đòi hỏi mã hóa SSL.
Nhà cung cấp dịch vụ host có thể còn cung cấp một bảng điều khiển giao diện Web
(Cpanel, Helm, Plesk, ví dụ thế) để quản lý Web server và cài đặt script cũng như các
dịch vụ khác, chẳng hạn e-mail. Gần đây các bảng điều khiển hoặc giao diện Web này
gây ra nhiều cuộc tranh cãi khi Web.com tuyên bố công ty này được độc quyền về công
nghệ host với 19 phát minh của mình. Hostopia, một công ty host sỉ lớn, gần đây đã mua
quyền sử dụng công nghệ của Web.com với giá 10% lợi tức host lẻ. Web.com cũng đã
kiện công ty Godaddy vì xâm phạm các phát minh độc quyền đó.
Một số nhà cung cấp dịch vụ host tập trung vào một phần mềm hoặc dịch vụ nhất định
(ví dụ như thương mại điện tử). Những phần mềm hay dịch vụ này thường do các công
ty lớn hơn sử dụng để tận dụng kiến trúc hạ tầng mạng của công ty cung cấp dịch vụ
host.
3: Các loại dịch vụ host
Sau đây là những dịch vụ giới hạn trong phạm vi ứng dụng Web:
Dịch vụ Web host miễn phí: Miễn phí, (đôi khi) chấp nhận quảng cáo, và cực kỳ hạn
chế khi so sánh với dịch vụ host có thu phí.
Dịch vụ Web host dùng chung: Website của bạn được đặt chung server với hàng trăm
Web site khác.
Dịch vụ host dành riêng: Người sử dụng thuê trọn Web server và có toàn quyền điều
khiển nó, tuy nhiên, người sử dụng không sở hữu server.

PHIÊN BẢN THỬ NGHIỆM – LƯU HÀNH NỘI BỘ

11
GIÁO TRÌNH THIẾT KẾ WEB VỚI JOOMLA
Dịch vụ host hỗ trợ: Tương tự dịch vụ host dành riêng, nhưng người sử dụng sở hữu
server; công ty host chỉ cung cấp chỗ (không gian vật lý) để lắp đặt và bảo trì server. Đây
Ngôn ngữ này cho phép tương tác với cơ sở dữ liệu. Ngôn ngữ phổ biến được dùng
nhiều nhất là PHP.
Client

Server

Trình biên d
ị
chPHIÊN BẢN THỬ NGHIỆM - LƯU HÀNH NỘI BỘ
12
GIÁO TRÌNH THIẾT KẾ WEB VỚI JOOMLA
II: CƠ SỞ DỮ LIỆU (DATABASES)
Bạn thường vào một diễn đàn, đăng ký thông tin để tham gia vào diễn dàn. Như vậy những
thông tin mà bạn đăng ký đó gọi là dữ liệu. Toàn bộ được lưu lại trong hệ thống gọi là cơ sở dữ
liệu.
Các chương trình quản lý cơ sở dữ liệu phổ biến như SQL Server, Oracel, Access, MySQL. Để
dùng cho thiết kế bằng ngôn ngữ PHP người ta thường dùng MySQL, bỡi tính đơn giãn dể sử
dụng của nó.
BÀI 4: CÀI ĐẶT WEB SERVER
XAMPP
I: GIỚI THIỆU
Xampp là máy chủ web cho phép bạn cài đặt và quản lý website của mình tại máy tính của
mình. Khi cài đặt thành công Xampp bạn sẽ được một host ảo hay còn gọi là localhost. Với
localhost thì việc quản trị nó tương tự như quản trị trên host thật.
Xampp hổ trợ hầu hết các hệ điều hành. Nó hổ trợ việc thực thi ngôn ngữ lập trình PHP, Perl.

quan trọng nhất. Điều này có ngh
ĩa là ba dTrong đó có ba
ĩa là ba d
ịch vụ được

PHIÊN BẢN THỬ NGHIỆM - LƯU HÀNH NỘI BỘ
14
GIÁO TRÌNH THIẾT KẾ WEB VỚI JOOMLA

Bước 4: Dưới đây là quá trình cài đặt đang được tiến hành. Bạn chờ cho đến khi màn hình DOS
xuất hiện.

Bước 5: Khi những màn hình DOS xuất hiện bạn cứ để yên cho nó qua hết cho đến khi màn
hình báo đã cài đặt hoàn tất xuất hiện. PHIÊN BẢN THỬ NGHIỆM – LƯU HÀNH NỘI BỘ

15
GIÁO TRÌNH THIẾT KẾ WEB VỚI JOOMLA
Bước 6: Tiếp theo bạn ra desktop tìm icon của chương trình và khởi động nó lên.

Bấm nút Start cạnh hai dịch vụ Apache và MySql, để ý thấy trạng thái của nó là Running thì
được. Bấm nút Exit để thoát chương trình.

17
GIÁO TRÌNH THIẾT KẾ WEB VỚI JOOMLA

Bước 3: Lưu website này và truy cập vòa địa chỉ http://localhost/MyWeb. Nếu kết quả hiện ra
trang web với nội dung ở trên thì là thành công. (Lưu ý: nếu bạn đã sửa địa chỉ localhost thành
địa chỉ khác thì nhớ gõ đúng, trong sách này tôi sử dụng mặc định).

3. Thay đổi thư mục htdocs
Mặc định thì bắt buộc bạn phải lưu thư mục chứa web của mình trong thư mục htdocs Nhưng
bạn muốn thay đổi địa chỉ này qua một thư mục khác chẳng hạn. Chúng ta làm như sau:
Bước 1: Bạn tìm đến thư mục C:\xampp\apache\conf Mở tập tin httpd.conf bằng notepad.
Bước 2: Tìm đến dòng <Directory "C:/xampp/htdocs"> và thay đường dẫn trong đó bằng
đường dẫn đến thu mục chứa web mới của bạn. Ví dụ tôi tạo thư mục D:\Data thì tôi sẽ sửa lại
thành <Directory "D:/Data">

Bước 3: Tìm đến dòng DocumentRoot "C:/xampp/htdocs" và cũng sửa đường dẫn trong đó
đến thư mục chứa web. Bạn chú ý dùm tôi dấu gạch chéo trong địa chỉ.

PHIÊN BẢN THỬ NGHIỆM - LƯU HÀNH NỘI BỘ
18
GIÁO TRÌNH THIẾT KẾ WEB VỚI JOOMLA

Bước 4: Khởi động lại dịch vụ Apache bằng cách mở trình điều khiều Xampp, bấm Stop ở dịch
vụ Apache và sau đó chọn Start trở lại. Nếu trạng thái lúc này là Running thì việc cấu hình của
bạn thành công.
Bước 5: Bạn thử kiểm tra lại bằng cách tạo một file Index.html và truy cập vào website của
mình.
BÀI 5: QUẢN TRỊ CƠ SỞ DỮ LIỆU
BẰNG PHPMYADMIN
I: GIỚI THIỆU

Để tạo mới một CSDL bạn chọn tab Databases, điền tên CSDL trong trường Create new
databases. Lưu ý: chọn thêm kiểu mã hóa ký tự là utf8_general_ci trong mục chọn kế bên. Sau
cùng bấm Create.

Nhận được thông báo đã tạo thành công một CSDL mới.

3: Tạo Table (thuật ngữ gọi là quan hệ) mới cho dữ
liệu
Bây giờ chúng ta sẽ tạo mới một bảng cho dữ liệu MyData ở trên.
Ví dụ tôi sẽ tạo một bảng ThongTinSinhVien để lưu thông tin
của sinh viên. Để làm điều này bạn thực hiện như sau
Bên góc tay trái bạn chọn vào tên database của mình là
MyData.

Bạn nhận được một thông báo No table found in
database có nghĩa là bảng dữ liệu bây giờ đang trống. Để
tạo mới bạn gõ tên Table trong trường Name, trường

PHIÊN BẢN THỬ NGHIỆM – LƯU HÀNH NỘI BỘ

21
GIÁO TRÌNH THIẾT KẾ WEB VỚI JOOMLA
Number of fields yêu cầu bạn chỉ định số cột (Column) trong bảng (thuật ngữ gọi là
thực thể). Bấm nút GO để tạo table.

Chúng ta nhận được một bảng yêu cầu các Column cho Table vừa tạo:

Ví dụ này chúng ta sẽ tạo một dữ liệu như sau:

MSSV HOTEN NGAYSIN

Máy
Tính
7.62
+ Phần được in đậm trong bảng trên được gọi Field, nó là tiêu đề để nhận diện cột. Ta
điền nó trong trường Field.
+ Trường Type quy định kiểu dữ liệu (data type) cho Field.
MSSV: Varchar
HOTEN: Text
NGAYSINH: Date
KHOA:Text
DTB: Float

PHIÊN BẢN THỬ NGHIỆM - LƯU HÀNH NỘI BỘ
22
GIÁO TRÌNH THIẾT KẾ WEB VỚI JOOMLA
+ Length/Value dùng để chỉ định độ dài của dữ liệu. Phần này bỏ trống, nó tự gán giá
trị mặc định cho mỗi Field. Tuy nhiên tùy theo kiểu dữ liệu (data type) mà trường này
được phép bỏ trống hay không. Ví dụ kiểu Varchar bạn bắt buộc phải nhập giá- trị cho
nó.

Sau khi bấm nút Save nếu thông báo hiện ra như hình bên dưới thì việc tạo Table của
bạn thành công.

Kế đến bạn nhập dữ liệu cho Table: Bạn chuyển qua tab Insert, sẽ nhận được một bảng
yêu cầu điền dữ liệu như hình dưới. Điền dữ liệu vào và bấm nút Go. PHIÊN BẢN THỬ NGHIỆM – LƯU HÀNH NỘI BỘ

23

Để cài đặt Navicat bạn tìm và tải phần mềm tại địa chỉ
Sau khi tải về bạn cài đặt như bao phần mềm khác, và giao diện khi lần đầu tiên làm việc như
hình bên dưới.

2: Kết nối đến server
Chọn tác vụ Connection trong giao diện chính của chương trình. Một cửa sổ yêu cầu thông tin
kết nối hiện ra. Bạn nhập thông tin kết nối đến máy chủ. Ở đây tôi chỉ kết nối đến server local, tức là server ảo ngay trên máy tính của tôi. Trong phần
Connection Name bạn cho biết tên của của kết nối này, tùy ý thích của bạn. Trong trường Host
name/ IP Address bạn nhập địa chỉ của server. Khi đăng ký host bạn được cung cấp địa chỉ
này. Ở đây tôi nhập là localhost do tôi đang kết nối đến server local. Hai trường User name và

PHIÊN BẢN THỬ NGHIỆM – LƯU HÀNH NỘI BỘ

25
GIÁO TRÌNH THIẾT KẾ WEB VỚI JOOMLA
Password yêu cầu khai báo thông tin đăng nhập server. Nếu kết nối local bạn nhập như đăng
nhập PHPMyAdmin. Sau cùng bấm OK.
Trở lại màn hình chính bạn thấy tên kết nối đã xuất hiện bên trái. Bấm chuột phải vào đó và
chọn Open Connection

Nếu kết nối thành công bạn thấy dữ liệu của chúng ta xuất hiện.

3: Quản lý User
Navicat cho phép bạn tạo nhiều user khác đăng nhập vào hệ thống. Khi đó bạn cần có quyền
admin cao nhất, mặc định ở local thì tài khoản root là quyền cao nhất. Khi đăng ký host thật, thì
tài khoản đó cũng có quyền này, nhưng thấp hơn một tài khoản khác gọi là user system.
Để quản lý user bạn chọn tác vụ Manage Users