hệ quản trị nội dụng mã nguồn mở JOOMLA ppt

Là một hệ quản trị nội dung mã nguồn mở được viết trên ngôn ngữ PHP kết nối với cơ sở dữ liệu MySQL do đó để một website Joomla có thể chạy được chúng ta cần có một server được cài đặt

Author: Luong Khiem

11/9/2010

See how easy it is!

II) Administrator Overview

1 Tổng quan trang quản trị

2 Cấu hình chung

3 Quản lý ngôn ngữ

4 Quản lý giao diện

5 Quản trị nội dung

6 Quản lý menu

7 Quản lý Module, Component

III) Advance Joomla

I) What is Joomla?

1 Giới thiệu Joomla

- Joomla được phát âm theo tiếng Swahili như là 'jumla' nghĩa là "đồng

tâm hiệp lực"

- Joomla! là một hệ quản trị nội dung mã nguồn mở (tiếng Anh: Open

Source Content Management Systems) Joomla! được viết bằng ngôn

ngữ PHP và kết nối tới cơ sở dữ liệu MySQL , cho phép người sử

dụng có thể dễ dàng xuất bản các nội dung của họ lên Internet hoặc

Intranet

- Joomla có các đặc tính cơ bản là: bộ đệm trang (page caching) để

tăng tốc độ hiển thị, lập chỉ mục, đọc tin RSS (RSS feeds), trang dùng

để in, bản tin nhanh, blog, diễn đàn, bình chọn, lịch biểu, tìm kiếm

trong Site và hỗ trợ đa ngôn ngữ

- Joomla! được sử dụng ở khắp mọi nơi trên thế giới, từ những website

cá nhân cho tới những hệ thống website doanh nghiệp có tính phức tạp cao, cung cấp nhiều dịch vụ và ứng dụng Joomla có thể dễ dàng cài

đặt, dễ dàng quản lý và có độ tin cậy cao

- Joomla có mã nguồn mở do đó việc sử dụng Joomla là hoàn toàn miễn phí cho tất cả mọi người trên thế giới

2 Ứng dụng Joomla

- Các cổng thông tin điện tử hoặc các website doanh nghiệp:

- Thương mại điện tử trực tuyến

- Báo điện tử, tạp chí điện tử

- Website của các doanh nghiệp vừa và nhỏ

- Website của các cơ quan, tổ chức phi chính phủ

- Website các trường học

- Website của gia đình hay cá nhân

-

3 Cài đặt Joomla

3.1 Cài đặt Home Server

- Joomla! Là một hệ quản trị nội dung mã nguồn mở được viết trên

ngôn ngữ PHP kết nối với cơ sở dữ liệu MySQL do đó để một website Joomla có thể chạy được chúng ta cần có một server được cài đặt PHP và MySQL và một số module khác

- Thông thường thì chúng ta sẽ thuê Hosting từ các nhà cung cấp dịch vụ Domain Hosting Để phục vụ cho việc học tập và nghiên cứu chúng ta cũng có thể tự minh xây dựng một Home Server để chạy website Joomla ngay tại máy mình

- Để xây dựng Home Server ta có thể sử dụng nhiều ứng dụng khác nhau như: Apache, XAMPP, Uniform Server, Với ưu điểm nổi bật

về các plugin cũng như sự tiện dụng dễ sử dụng thì Uniform Server

là một lựa chọn

- Cài đặt Uniform Server:

http://sourceforge.net/projects/miniserver/files/

 Sau khi download ta chạy để giải nén Uniform Server:

 Start Server:

 Như vậy bạn đã cài đặt xong Home Server

3.2 Cài đặt Joomla

Bước 1:Tạo cơ sở dữ liệu (CSDL)

- Truy cập phpMyadmin để tạo CSDL cho website theo link:

http://localhost/apanel/phpmyadmin

- Tạo CSDL cho website, ở đây ta đặt tên CSDL là joomla

Bước 2: Cài đặt Joomla

 Dowload source Joomla tại:

http://www.joomla.org/download.html

 Giải nén source joomla vào thư mục WWW của server

 Để tiến hành cài đặt website ta chạy đường dẫn:

http://localhost/joomla/installation/index.php

 Bấm next để qua bước 2: Pre-installation Check Bước này để kiểm tra cấu hình Server

 Bấm Next để qua bước 3: Licence Bước này để giới thiệu về bản

quyền Joomla, nhưng Joomla là mã nguồn mở nên chúng ta có thể

không cần quan tâm bước này và nhấn Next để qua bước 4

 Ở bước tiếp theo này chúng ta khai báo thông tin CSDL cho

website joomla

Note:Chúng ta cần đổi tên Prefix mặc định của joomla là

“jos_” thành một tên khác ví dụ như: “lk_” để bảo mật cho website, điều này sẽ được nói rõ hơn trong phần “Bảo Mật Joomla”

 Ở bước tiếp theo FTP Configurationchúng ta có thể cấu hình tài

khoản FTP cho site ngay tại đây, thông thường chúng ta không cấu hình FTP nên chọn Next

 Bước Main Configuration để cấu hình thông tin website:

 Site name: Đặt tên cho website

 Your Email: cấu hình email của administrator

 Admin password: cấu hình password cho user: admin

 Install Sample Data: cài đặt dữ liệu mẫu cho website để

bạn dễ dàng làm việc với một website mới bắt đầu xây dựng

 Ở bước cuối cùng hoàn tất việc cài đặt bạn cần phải xóa thư

mục “Installation” trong source cài đặt của bạn

Như vậy bạn đã hoàn tất việc cài đặt một website joomla Bạn có thể xem website vừa cài đặt: http://localhost/joomla/

II) Administrator Overview

- Trang quản trị administrator của Joomla để điều hành toàn bộ website Joomla Với giao diện được thiết kế tao nhã dễ sử dụng người dùng có thể xây dựng cấu trúc website, biên tập và xuất bản nội dung trang web

- Cấu trúc một trang quản trị Administrator của Joomla thường gồm 4 vùng:

Menubar – thanh menu, Toolbar – thanh công cụ, Infobar – thanh thông tin, Workspace – vùng làm việc

- Để đăng nhập vào trang quản trị ta đăng nhập với đường dẫn

“/administrator” Ở đây ta đăng nhập với đường dẫn sau: http://localhost/joomla/administrator

- Tài khoản đăng nhập ta đăng nhập với:

o Tên đăng nhập: admin

o Mật khẩu: ****** (là mật khẩu mà bạn tạo trong quá trình cài đặt

joomla)

1 Tổng quan trang quản trị

Trang quản trị được bố thanh những các vùng giúp người dùng dễ dàn quản trị trang web của mình

 Vùng 1: Thanh menu chứa menu tất cả các chức năng, ứng dụng,

quản trị nội dung của website

 Vùng 2:Thanh thông tin, giúp người quản trị (admin) có thể biết về

tình trạng website như: Phiên bản joomla đang xài ( Phiên bản 1.5.20) Nút “Xem trước”, email, user đang đăng nhập, Nút

“Thoát”

 Vùng 3:Vùng làm việc, giúp admin có thể dễ dàng di chuyển đến

các mục cần làm một cách dễ dàng và nhanh chóng như: Viết bài mới, quản lý chủ đề, quản lý ngôn ngữ, quản lý thành viên,…

 Thêm bài viết mới: biên soạn thêm một bài viết mới

 Quản lý bài viết: quản lý tất cả các bài viết

 Quản lý nhóm tin:quản lý, chỉnh sửa các nhóm tin

 Quản lý chủ đề:quản lý, chỉnh sửa chủ đề của các nhóm tin

 Quản lý đa phương tiện: Cho phép quản lý các hình ảnh,

flash, tài liệu,… của website

 Quản lý menu: Chỉnh sửa, thêm xóa các menu

 Quản lý ngôn ngữ:cho phép chọn ngôn ngữ mặc định cho

website cũng như trang quản trị

 Quản lý thành viên: quản trị các thành viên của website

 Cấu hình chung:cho phép cấu hình hệ thống cho server, hệ

thống cũng như tổng thể trang web

 Vùng 4:Các Công cụ ( Module) hiển thị trong trang quản trị giúp

admin dễ dàng thống kê tình trạng website như: số lượng user đang đăng nhập, bài viết mới nhất, bài viết đọc nhiều nhất,…

2 Cấu hình chung

Là trung tâm cấu hình chính của một website Joomla, tất cả cấu hình

quan trọng đều được cấu hình ở đây, tất cả những chỉnh sửa trong “Cấu hình chung” đều được lưu xuống file “configuration.php”

2.1 Trang Web

 Cấu hình Site:

 Cho phép admin tùy chọn cho website ngừng hoạt động hay không

 Cấu hình tên website

 Chọn trình soạn thảo nội dung bài viết

 Email website

 Cấu hình máy tìm kiếm:Nơi để Google hiểu tổng thể về website

của bạn thông qua các từ khoa “Meta” và mô tả về website của bạn (Keyword descriptions)

 Thiết lập SEO: Admin có thể chỉnh đường dẫn thân thiện với

Google (Google friendly) Phần này chúng ta sẽ đi chi tiết trong phần SEO

2.2 Hệ thống

Là trung tâm cấu hình toàn bộ hệ thống website từ thiết lập hệ thống, cấu hình thành viên, cache cũng như quản lý đa phương tiện

2.3 Máy chủ

 Cấu hình máy chủ: admin cấu hình thư mục chứa file tạm

(Temp) “Nén trang dạng GZIP”: cho phép nén website ở dạng

gzip để tối ưu tốc độ website

 Cấu hình múi giờ:Cài đặt múi giờ cho website

 Cấu hình FTP:Bước này giúp cấu hình, chỉnh sửa FTP trong quá

trình cài đặt chúng ta bỏ qua Thông thường admin không cấu hình

FTP ở đây để đảm bảo về vấn đề bảo mật

 Cấu hình CSDL:cấu hình chỉnh sửa thông tin về CSDL của website

 Cấu hình mail:Cấu hình email cho website

3 Quản lý ngôn ngữ

Admin quản lý ngôn ngữ website thông qua trang này, admin có thể cài đặt các gói ngôn ngữ cho website Để cài đặt gói ngôn ngữ chúng ta làm như sau:

joomla

http://extensions.joomla.org/extensions/languages/translations-for- Sau khi download về máy bạn tiến hành cài đặt : Phần mở rộng 

Cài đặt/Tháo gỡ Chọn tệp tin  Tải lên & Cài đặt

Một website có thể nhiều ngôn ngữ bạn có thể chọn ngôn ngữ mặc định cho website như sau:

 Trên thanh menu bạn chọn: Phần mở rộng  Quản lý ngôn ngữ

 Chọn ngôn ngữ mặc định cho website

Tương tự như vậy chúng ta cũng có thể cài đặt và chọn ngôn ngữ mặc định cho trang Admin

4 Quản lý giao diện

o Trang “Quản lý giao diện” giúp admin chọn template mặc định cho site

cũng như là có thể chỉnh sửa hoặc xem trước template đó

o Chọn: “Phần mở rộng  Quản lý giao diện” để vào trang quản trị

 Để chọn giao diện mặc định cho website bạn chỉ cần chọn

“Template” sau đó chọn “Mặc định”

 Muốn sửa template nào bạn chỉ cần chọn template đó và chọn

“Sửa”

5 Quản trị nội dung

Nội dung của một trang Joomla được quản lý thông qua cấu trúc 3 tầng:

 Để quản lý “Nhóm tin” trên thanh menu chọn: Nội dung  Quản

Trong trang “Quản lý bài viết” admin có thể quản lý toàn bộ các bài viết

của website Admin có thể chỉnh sửa một bài viết, thêm mới một bài viết hay

cũng có thể di chuyển bài viết từ “Chủ đề con” này sang “Chủ đề con” khác,

Thêm một bài viết mới: Để thêm một bài viết mới thì trong trang “Quản

lý bài viết” ta chọn “Thêm mới”

6 Quản lý menu

Quản lý các menu của website Admin có thể thêm, xóa, sửa các menu

Chúng ta sẽ tạo ra các “Danh mục menu”, admin có thể cho “Danh mục menu” hiện ra trang chủ ở các vị trí tùy ý theo Layout của website

7 Quản lý Module, Component

7.1 Quản lý Module

 Module Joomla thường được cài đặt để biểu diễn nội dung trang web hoặc là các media lên trang chủ website hoặc các trang trong của website

 Để vào “Quản lý Module” trên thanh menu admistrator ta chọn:

Phần mở rộng  Quản lý Module

 Admin có thể dễ dàng thêm, xóa, sửa các module, cấu hình

hiển thị vị trí của module ra ngoài website

7.2 Quản lý Component

Cho phép admin cấu hình, tinh chỉnh các chức năng của các Component được cài đặt vào website

 Bảng quảng cáo: Component “Bảng quảng cáo” để tạo ra các

banner quảng cáo đăng trên site, hỗ trợ khi người dùng click vào banner sẽ trỏ đến một url nào đó Ngoài ra component này còn hỗ trợ đếm số lượt click vào banner quảng cáo giúp admin quản lý

được độ hiệu quả của banner

 Liên hệ: Component “Liên Hệ” cho phép bạn tạo thông tin liên hệ của website, bạn có thể thêm tên, địa chỉ, số điện thoại, fax,…

 News Feed: Cho phép bạn thêm những feed lấy từ website khác về trên website của bạn

 Thăm dò: Cho phép bạn tạo những bản thăm dò cho người dùng website bình chọn

 Tìm kiếm: Chức năng tìm kiếm cho website của bạn

 Liên kết web: Cho phép bạn thêm những link của các website khác lên trang của bạn

III) Advance Joomla

1 HTML, CSS, Javascript

1.1 HTML

Trong thực tế trang Web thường có 2 loại là web tĩnh và web động Trang web tĩnh là trang HTML không kết nối cơ sở dữ liệu(csdl) , ngược lại trang web động là trang có kết nối csdl như trang PHP, ASP, JSP,… Nhưng mà nó chung 1 trang web

dù tĩnh hay động nếu bạn muốn biểu diễn dữ liệu thì bạn cần phải dùng đến các thẻ HTLM trong đó Như vậy các thẻ HTML rất quan trọng trong một trang web của bạn

 Cấu trúc một trang HTML cơ bản Như đã nói trên HTML để biểu diễn dữ liệu trang web và được trình bày trên các Web Browser, và một trang HTML được lưu với phần mở rộng là htm hay html

Cấu trúc trang web HTML được bắt đầu bởi thẻ mở <html> và kết thúc bằng thẻ đóng </html> Bạn muốn làm chủ được HTML thì bạn cần phải nắm vững được các thẻ của HTML , các thẻ trong HTML thường có 2 loại thẻ là :

- Loại thẻ mở có kèm theo thẻ đóng Ex: <a> </a>,

<body>…</body>,…

- Loại thẻ mở mà không có thẻ đóng Ex: <img>,<br>,<hr>,… Nói chung là HTML rất dễ dàng để các bạn tiếp cận với nó , mình sẽ đưa ra cho các bạn một cấu trúc của 1 trang HTML cơ bản

//cấu trúc một trang HTML cơ bản

<html>

<head>

<title>Wellcome to Website </title> //title của một trang web cơ bản

<meta Diễn đàn Mạng Máy Tính, Network,groupw3> //thẻ này dung để đưa thông tin trang web dzo bộ máy tịm kiếm

</head>

2) Thẻ <title>….</title>

Title cho phép bạn trình bày chuỗi thông tin của trang web lên trên thanh tiêu đề của trang web mỗi khi web chạy Ex: <title>Wellcome to website </title>

3) Thẻ <body>…</body>

Trong HTML thì tất cả các thông tin trong thanh <body> đều được biểu thị lên trên trang web để người sử dụng nhìn thấy Trong thẻ <body> này bạn cần kết hợp thật nhuần

nhuyễn các thẻ với nhau để tạ nên một trang web hoàn thiện

4) Các thẻ định dạng

Trong phần nà thì mình chỉ giới thiệu đến các bạn các thẻ thông dụng dùng để hỗ trợ trong việc định dạng văn bản trên web HTML Một số thẻ đặc biệt các bạn nghiên cứu thêm nha

4.1 Thẻ <div> </div>

Cho phép bạn định dạng một đoạn văn bản bằng các thuộc tính của nó Ví dụ như bạn muốn canh giữa một đoạn văn bản thì bạn dùng thuộc tính algin=”center”:

Ngoài ra ta có thể sử dụng thẻ <br> dùng để xuống hàng

<br> là thẻ không có thẻ đóng và khi xuống hàng nó sẽ không cách 1 đoạn giống như thẻ <p> mà nó sẽ hiển thị ở hàng tiếp theo

<UL >… </UL>: Un order List (danh sách - Bullet )

<OL >… </OL>:Order List (danh sách - Numbering)

<HR> : Horizontal Rules (chèn đường kẻ ngang)

<BR> : line breaks ( ngắt dòng)

< U >…</ U> : underline (gạch chân văn bản)

< I >…</I> : Italic (Văn bản Nghiêng)

< B >…</ B> :Bold (gạch chân in đậm)

• Khoảng trống (trong trường hợp muốn có nhiều hơn 1

ký tự trống): &nbsp;

• Dấu nhỏ hơn (<) và lớn hơn (>): &lt; &gt;

• Dấu ngoặc kép (“): &quot;

• Ký hiệu : &copy;

• …

5) Thẻ định dạng bảng <table>…</table>

Khi bạn muốn trình bày một bảng dữ liệu lên web chẳng hạn như trình bày bảng điểm của sinh viên hay là danh sách các sinh viên thì bạn cần phải dùng đến thẻ này Sau khi khai bào thẻ <table> thì bạn cần quan tâm đến các thẻ hàng <tr> </tr>

– ROWSPAN, COLSPAN: trộn các dòng hoặc cột – <TR>: dòng, <TD> cột, <TH>: heading

– <CAPTION>: tiêu đề mô tả bảng

– bgcolor=“màu”: màu nền của bảng – background=“địa_chỉ_ảnh”: Địa chỉ của file ảnh làm nền cho

bảng Nên sử dụng đường dẫn tương đối nếu có thể Note: Khi thiết kế table các bạn chỉ cần quan tâm đến chiều rộng chứ không cần quan tâm đến chiều cao của <table> vì chiều cao của nó phụ thuộc vào độ dài sữ liệu của ta Tương tự thì thẻ hàng <tr> thì ta chỉ quan tâm đến chiều cao ,còn thẻ cột thì ta chỉ quan tâm đến thẻ rộng

Ex: Để các bạn hình dung rõ hơn về table ta đưa ra một ví dụ

để các bạn làm thì các bạn sẽ hiểu được table Các bạn hãy xây dựng trang web giống như hình dưới: