Báo cáo nghiên cứu và xây dưng website bằng WORDPRESS full

BỘ GIÁO DỤC VÀ ĐÀO TẠO

TRƯỜNG ĐẠI HỌC CNTT GIA ĐỊNH
KHOA CÔNG NGHỆ THÔNG TIN

BÁO CÁO
THỰC TẬP TỐT NGHIỆP

TÊN ĐỀ TÀI
NGHIÊN CỨU VÀ XÂY DỰNG WEB
BẰNG WORDPRESS

Người hướng dẫn: Võ Đỗ Thắng
Giảng viên hướng dẫn: Lê Mạnh Hải
Sinh viên thực hiện: Nguyễn Minh Trí
MSSV: 0240075

Lớp: 03DHPM

Khóa: 03

Thành phố Hồ Chí Minh, tháng 04 năm 2014


Nội dung của báo cáo này đã được up lên:
- Youtube:
/>37EPoargd3dxzg
- Slideshare: />
Trang web được triển khai trên VPS có địa chỉ là:
-

ĐÁNH GIÁ CỦA ĐƠN VỊ THỰC TẬP
................................................................................................................
................................................................................................................
................................................................................................................
................................................................................................................
................................................................................................................
................................................................................................................
................................................................................................................
................................................................................................................
................................................................................................................
................................................................................................................
................................................................................................................
................................................................................................................
................................................................................................................
................................................................................................................
................................................................................................................
................................................................................................................
................................................................................................................
................................................................................................................
................................................................................................................

………………, ngày ……… tháng ……… năm …………
TM. Đơn vị thực tập
(Ký tên, đóng dấu)


ĐÁNH GIÁ CỦA GIẢNG VIÊN HƯỚNG DẪN
1. Thái độ tác phong trong thời gian thực tập:
...............................................................................................................

................................................................................................................ ..
................................................................................................................
2. Kiến thức chuyên môn:
................................................................................................................
................................................................................................................ ..
................................................................................................................
3. Nhận thức thực tế:
................................................................................................................
................................................................................................................ ..
................................................................................................................
4. Đánh giá khác:
................................................................................................................
................................................................................................................ ..
................................................................................................................
5. Đánh giá chung kết quả thực tập:
................................................................................................................
................................................................................................................
................................................................................................................

………………, ngày ……… tháng ……… năm …………
Giảng viên hướng dẫn
(Ký tên, ghi rõ họ tên)


PHỤ LỤC

PHỤ LỤC ------------------------------------------------------------------------------- 1
MỞ ĐẦU -------------------------------------------------------------------------------- 3
Chương 1: Giới thiệu về đơn vị thực tập----------------------------------------- 4
1.1.

Lĩnh vực hoạt động chính ------------------------------------------------- 4
1.2.
Cơ sở vật chất --------------------------------------------------------------- 5
Chương 2: Giới thiệu về wordpress ----------------------------------------------- 4
2.1.
Wordpress là gì? ------------------------------------------------------------ 4
2.2.
Ưu và nhược điểm của WordPress --------------------------------------- 5
2.2.1.
2.2.2.

Ưu điểm ------------------------------------------------------------------------------ 5
Nhược điểm -------------------------------------------------------------------------- 6

Chương 3: Cài đặt wordpress trên localhost với XAMPP ------------------- 7
3.1.
Download và cài đặt XAMPP -------------------------------------------- 7
3.1.1.
3.1.2.

3.2.
3.3.
3.3.1.
3.3.2.

Download XAMPP ----------------------------------------------------------------- 7
Cài đặt XAMPP --------------------------------------------------------------------- 8

Tạo Database MySQL cho Wordpress với PhpMyAdmin ----------- 9
Download và cài đặt Wordpress------------------------------------------ 9

Download Wordpress --------------------------------------------------------------- 9
Cài đặt Wordpress----------------------------------------------------------------- 10

Chương 4: Phân tích thông tin danh mục web Athena ---------------------- 16
4.1.
Giao diện trang chủ-------------------------------------------------------- 16
4.1.1.
4.1.2.
4.1.3.
4.1.4.
4.1.5.
4.1.6.

4.2.
4.3.
4.4.
4.4.1.
4.4.2.
4.4.3.

Header -----------------------------------------------------------------------------Menu-------------------------------------------------------------------------------Slider ------------------------------------------------------------------------------Last news --------------------------------------------------------------------------Widgets ----------------------------------------------------------------------------Footer -------------------------------------------------------------------------------

16
16
17
17
18
19

Giao diện danh sách bài viết cùng đề tài ------------------------------- 19

Giao diện hiển thị nội dung bài viết ------------------------------------ 20
Sơ đồ Mockup giao diện web Athena ---------------------------------- 21
Trang chủ -------------------------------------------------------------------------- 21
Trang danh sách bài viết cùng chuyên mục ------------------------------------ 22
Trang nội dung bài viết ----------------------------------------------------------- 23

Chương 5: Cài đặt và cấu hình Theme ------------------------------------------ 24
5.1.
Cài đặt theme tribune ----------------------------------------------------- 24
5.2.
Cấu hình Theme Tribune ------------------------------------------------- 25
5.2.1.
5.2.2.
5.2.3.
5.2.4.

Header -----------------------------------------------------------------------------Menu-------------------------------------------------------------------------------Last news --------------------------------------------------------------------------Footer -------------------------------------------------------------------------------

25
25
28
30


Chương 6: Cấu hình Widgets ----------------------------------------------------- 32
6.1.
Cài đặt Widget banner quảng cáo --------------------------------------- 32
6.2.
Cài đặt Widget Hỗ trợ online -------------------------------------------- 33
6.3.

Cài Widget Facebook Like ----------------------------------------------- 35
6.3.1.
6.3.2.
6.3.3.

Đăng ký làm Facebook Developer ---------------------------------------------- 35
Tạo ứng dụng mới----------------------------------------------------------------- 37
Lấy Embed code của Facebook Like để nhúng vào Widget ----------------- 41

Chương 7: Đăng ký và tích hợp dịch vụ Google Analytics ----------------- 44
7.1.
Đăng ký dịch vụ Google Analytics ------------------------------------- 44
7.2.
Lấy Embed code để nhúng vào website -------------------------------- 47
Chương 8: Cài đặt và cấu hình plug-ins ---------------------------------------- 49
8.1.
Cách tìm kiếm và cài đặt plug-ins--------------------------------------- 49
8.2.
Cài đặt plug-in "Count Per Day” ---------------------------------------- 50
8.3.
Cài đặt plugin “Weptile Image Slider Widget” ----------------------- 52
8.4.
Cài đặt plugin ”Facebook” ----------------------------------------------- 54
8.5.
Cài đặt plugin “Related Post”-------------------------------------------- 56
8.6.
Cài đặt plugin ”WordPress SEO” --------------------------------------- 57
Chương 9: Viết plugin nhập và xem điểm -------------------------------------- 59
9.1.
Cấu trúc cơ bản của 1 plugin wordpress ------------------------------- 59

9.2.
Cấu trúc plugins nhập và xem điểm ------------------------------------ 60
9.2.1.
9.2.2.
9.2.3.
9.2.4.

Phần thông tin về plugin xem điểm --------------------------------------------Hàm khởi tạo Database lúc vừa active -----------------------------------------Hàm kiểm tra phân quyền -------------------------------------------------------Hàm nhập và xem điểm ----------------------------------------------------------

60
60
61
62

Chương 10: Triển khai trang web lên VPS------------------------------------- 67
10.1. Đăng ký tên miền .tk ------------------------------------------------------ 67
10.2. Cài đặt và cấu hình DNS cho VPS -------------------------------------- 68
10.2.1.
10.2.2.

10.3.

Cài đặt và cấu hình XAMPP --------------------------------------------- 76

10.3.1.
10.3.2.
10.3.3.

10.4.

Cài đặt dịch vụ DNS ----------------------------------------------------------- 68
Cấu hình dịch vụ DNS --------------------------------------------------------- 69
Cài đặt XAMPP ---------------------------------------------------------------- 76
Cấu hình XAMPP -------------------------------------------------------------- 76
Cấu hình bảo mật đơn giản cho XAMPP ------------------------------------ 77

Chuyển Wordpress từ localhost lên VPS ------------------------------ 78

10.4.1.
10.4.2.

Sau lưu phục hồi file cài đặt wordpress -------------------------------------- 78
Sao lưu và phục hồi Wordpress Database ----------------------------------- 80

Chương 11: Tối ưu hóa tìm kiếm (SEO) cho trang web --------------------- 83
11.1. Cài đặt plugin để tạo sitemap cho trang web -------------------------- 83
11.2. Đăng ký và gửi sitemap cho google webmaster ---------------------- 83
11.3. Tối ưu hóa bài viết với plugin “Google SEO” ------------------------ 84
Chương 12: Kết luận và hướng phát triển ------------------------------------- 85
12.1. Kết luận --------------------------------------------------------------------- 85
12.2. Hướng phát triển ----------------------------------------------------------- 85
Tài liệu tham khảo ------------------------------------------------------------------- 86


MỞ ĐẦU

Trong thời đại phát triển bùng nổ của công nghệ thông tin ngày nay,
chúng ta có thể làm rất nhiều thứ thông qua môi trường mạng Internet, từ học
tập, làm việc, vui chơi cho đến hội hợp trực tuyến.
Chỉ xét riêng về mặt học tập qua mạng, ta có thể thấy vô vàng công

cụ, dịch vụ hỗ trợ như google, yahoo, bing cùng hàng tỉ kết quả tìm kiếm có
thể được tìm thấy của ba trang web tìm kiếm này. Và cũng vì vậy nên mọi
người khi online thường rất dễ bị chi phối bởi các trang web giải trí đơn
thuần mà bỏ quên việc học. Điều này thật sự rất lãng phí.
Với mục tiêu giúp những ai muốn học tập qua mạng có thể tránh sự
dẫn dụ từ thế giới mạng và tập trung hơn vào mục tiêu nên em đã thử nghiên
cứu và xây dựng web bằng wordpress giới thiệu về trung tâp đào tạo
Athena. Nơi có các khóa học về Công Nghệ Thông Tin với mục tiêu được ghi
ra rõ ràng chi tiết cùng thời hạn cụ thể. Bên cạnh đó, trang web còn giúp
những người tham gia có thể kết bạn, tăng cường kỹ năng làm việc nhóm và
mọi người trong nhóm có thể học tập lẫn nhau để tự phát triển bản thân.

3


Chương 1: Giới thiệu về đơn vị thực tập

Chương 1: Giới thiệu về đơn vị thực tập
Trung Tâm Đào Tạo Quản Trị Mạng & An Ninh Mạng Quốc Tế ATHENA
được thành lập từ năm 2004, là một tổ chức qui tụ nhiều trí thức trẻ Việt Nam
đầy năng động, nhiệt huyết và kinh nghiệm trong lãnh vực CNTT, với tâm
huyết góp phần vào công cuộc thúc đẩy tiến trình đưa công nghệ thông tin là
ngành kinh tế mũi nhọn, góp phần phát triển nước nhà.

1.1. Lĩnh vực hoạt động chính
 Trung tâm ATHENA đã và đang tập trung chủ yếu vào đào tạo
chuyên sâu quản trị mạng, an ninh mạng, thương mại điện tử theo
các tiêu chuẩn quốc tế của các hãng nổi tiếng như Microsoft, Cisco,
Oracle, Linux LPI , CEH,... Song song đó, trung tâm ATHENA còn
có những chương trình đào tạo cao cấp dành riêng theo đơn đặt

hàng của các đơn vị như Bộ Quốc Phòng, Bộ Công An , ngân hàng,
doanh nghiệp, các cơ quan chính phủ, tổ chức tài chính…
 Sau gần 10 năm hoạt động,nhiều học viên tốt nghiệp trung tâm
ATHENA đã là chuyên gia đảm nhận công tác quản lý hệ thống
mạng, an ninh mạng cho nhiều bộ ngành như Cục Công Nghệ
Thông Tin - Bộ Quốc Phòng , Bộ Công An, Sở Thông Tin Truyền
Thông các tỉnh, bưu điện các tỉnh,...
 Ngoài chương trình đào tạo, Trung tâm ATHENA còn có nhiều
chương trình hợp tác và trao đổi công nghệ với nhiều đại học lớn
như Đại học Bách Khoa Thành Phố Hồ Chí Minh, Học Viện An
Ninh Nhân Dân( Thủ Đức), Học Viện Bưu Chính Viễn Thông,
Hiệp hội an toàn thông tin (VNISA), Viện Kỹ Thuật Quân Sự,...
 Đội ngũ giảng viên :
 Tất cả các giảng viên trung tâm ATHENA có đều tốt nghiệp từ các
trường đại học hàng đầu trong nước .... Tất cả giảng viên
ATHENA đều phải có các chứng chỉ quốc tế như MCSA, MCSE,
CCNA, CCNP, Security+, CEH,có bằng sư phạm Quốc tế
(Microsoft Certified Trainer).Đây là các chứng chỉ chuyên môn bắt
buộc để đủ điều kiện tham gia giảng dạy tại trung tâm ATHENA.
4


Chương 1: Giới thiệu về đơn vị thực tập
 Bên cạnh đó,các giảng viên ATHENA thường đi tu nghiệp và cập
nhật kiến thức công nghệ mới từ các nước tiên tiến như Mỹ , Pháp,
Hà Lan, Singapore,... và truyền đạt các công nghệ mới này trong
các chương trình đào tạo tại trung tâm ATHENA.

1.2. Cơ sở vật chất
 Thiết bị đầy đủ và hiện đại.

 Chương trình cập nhật liên tục, bảo đảm học viên luôn tiếp cận với
những công nghệ mới nhất.
 Phòng máy rộng rãi, thoáng mát.
 Dịch vụ hỗ trợ:
 Đảm bảo việc làm cho học viên tốt nghiệp khoá dài hạn.
 Giới thiệu việc làm cho mọi học viên.
 Thực tập có lương cho học viên khá giỏi.
 Ngoài giờ học chính thức, học viên được thực hành thêm miễn phí,
không giới hạn thời gian.
 Hỗ trợ kỹ thuật không thời hạn trong tất cả các lĩnh vực liên quan
đến máy tính, mạng máy tính, bảo mật mạng.
 Hỗ trợ thi Chứng chỉ Quốc tế.
Qua thời gian thực tập tại Trung Tâm Đào Tạo Quản Trị Mạng & An Ninh
Mạng Quốc Tế ATHENA, cá nhân em được tiếp xúc với một môi trường
năng động và sáng tạo. Sinh viên được rèn luyện kiến thức, học hỏi thêm các
kinh nghiệm thực tế. Nhờ đó, biết được năng lực của cá nhân và yêu cầu của
xã hội để cố gắng và phấn đấu nhiều hơn nữa.

5


Chương 2: Giới thiệu về wordpress

Chương 2: Giới thiệu về wordpress
2.1. Wordpress là gì?
WordPress là một mã nguồn web mở để quản trị nội dung (CMS –
Content Management System ) và cũng là một nền tảng blog (Blog Platform)
được viết trên ngôn ngữ PHP sử dụng hệ quản trị cơ sở dữ liệu MySQL được
phát hành đầu tiên vào ngày 27/5/2003 bởi Matt Mullenweg và Mike Little.
Thực ra WordPress lúc đầu mới công bố ra nó không được xem như là

một CMS bởi vì sức mạnh của nó cũng còn giới hạn ít nhiều nên lúc đó cộng
đồng xem WordPress chỉ là một mã nguồn được lựa chọn để phát triển blog
cá nhân bình thường với các tính năng rất cơ bản là hỗ trợ tạo trang tĩnh, tạo
bài viết có nhúng tính năng bình luận bài viết để thành viên có thể tương tác.
Tuy vậy, so với công nghệ lúc bấy gì thì WordPress cũng đã có những
bước tiến vượt bật so với những đối thủ khác mà cái quan trọng nhất là tính
tương tác hoàn toàn đơn giản để có thể gần gũi với người sử dụng không
chuyên. Vì vậy lúc đó WordPress đã bắt đầu trở thành một mã nguồn mở
được nhiều người chú ý đến và nhận donation (quyên góp) từ những người
ủng hộ để có thể phát triển được tốt hơn.
Và đúng như nguyện vọng của nhiều người, WordPress đã có một sự
phát triển vượt bậc ngay sau đó mà đầu tiên là sự nâng cấp về backend để
quản lý tốt hơn, nhiều tính năng mới được ra đời (trong đó có tính năng
Custom Field thần thánh mà mãi tận bây giờ nó vẫn nằm trong top các tính
năng thú vị nhất), kèm theo đó là một thư viện theme chính thức được công
bố với hàng trăm giao diện khác nhau cho WordPress mà người dùng có thể
tải về.
Tiếp tục vài năm sau đó, các bản WordPress mới hơn lần lượt ra đời và
kèm theo đó là thư viện plugin khổng lồ được ra mắt, đánh dấu thời kỳ hoàng
kim của WordPress. Đặc biệt là khi WordPress ra mắt phiên bản 2.8, có
nhiều thay đổi và tính năng nâng cao được cập nhật làm cho WordPress càng
trở nên mạnh mẽ hơn, và nó trở thành một CMS chính hiệu lúc nào không
hay.

4


Chương 2: Giới thiệu về wordpress
Hiện tại tính ở thời điểm này, WordPress đã có những con số rất ấn tượng
như sau:

 Khoảng 72,000,000 website đang sử dụng mã nguồn mở WordPress.
 Mỗi ngày có khoảng 145,000 lượt download mã nguồn WordPress từ
trang chủ.
 WordPress chiếm khoảng 19% thị phần cho tổng số website có mặt
trên thế giới. Trong khi đó Joomla chỉ có 3%. Và website không sử
dụng CMS chiếm 69%.
 Tổng số lượt download hiện tại của WordPress là khoảng 500,000,000
lần.
Chưa hết và các website lớn trên thế giới đều đang tin dùng WordPress như:
 Mashable
 TechCrunch
 CNN
 Forbes
 Time
 Wired
 Reuters

2.2. Ưu và nhược điểm của WordPress
2.2.1.










Ưu điểm

Nhiều plugin hỗ trợ, hầu như mọi ý tưởng đều đã có plugin hỗ trợ.
Nhiều theme có sẵn, hầu như là nhiều nhất trong các CMS hiện nay.
Bao gồm các theme miễn phí và theme trả phí rất chuyên nghiệp.
Dễ tùy biến, nếu bạn là người đã có kiến thức sẵn về PHP, CSS,
HTML thì điều này rất dễ dàng.
Nhiều cộng đồng hỗ trợ và hướng dẫn, đơn cử là như
ThachPham.Com của mình đây.
Có thể làm được nhiều thể loại website, từ blog cá nhân đến các
trang thương mại điện tử.
Dễ cài đặt.
Nhẹ và hao tốn ít tài nguyên máy chủ.
Các Theme Framework hiện có sẽ giúp bạn tự thiết kế giao diện
WordPress dễ dàng.
Dễ sử dụng và quản lý.
5


Chương 2: Giới thiệu về wordpress

2.2.2.





Nhược điểm
Nhiều khái niệm khó hiểu nếu bạn mới bắt đầu.
Muốn tùy biến WordPress, bạn phải có kiến thức lập trình web căn
bản nhất.
Các theme đẹp đa phần là phải trả phí. Và plugin cũng vậy.

Nếu bạn là Developer, bạn sẽ hơi mệt mỏi với các hàm có sẵn của
WordPress vì nó quá nhiều.

6


Chương 3: Cài đặt wordpress trên localhost với XAMPP

Chương 3: Cài đặt wordpress trên localhost với
XAMPP
Các file, công cụ cần chuẩn bị:
Mã nguồn Wordpress.
File cài đặt XAMPP (bản 7z).
Trình duyệt web.

3.1. Download và cài đặt XAMPP
3.1.1.

Download XAMPP
- Download tại trang web:
 />- Hoặc download trực tiếp tại:
 />
0Windows/1.7.4/xampp-win32-1.7.4VC6.7z/download

Hình 3.1

7


Chương 3: Cài đặt wordpress trên localhost với XAMPP

3.1.2.

Cài đặt XAMPP

- Giải nén file “xampp-win32-1.7.4-VC6.7z” vào ổ đĩa C, sau đó vào
trong thư mục chạy file ”xampp-control” (hình 3.2).
- Chạy Module ”Apache” và ”MySql” (hình 3.3).

Hình 3.2

Hình 3.3

8


Chương 3: Cài đặt wordpress trên localhost với XAMPP

3.2. Tạo Database MySQL cho Wordpress với PhpMyAdmin
- Mở trình duyệt, truy cập vào đường dẫn:
 http://localhost/phpmyadmin/
- Ở mục «Create new database», gõ vào tên CSDL cho Wordpress sử
dụng (Hình 3.4)

Hình 3.4

3.3. Download và cài đặt Wordpress
3.3.1.

Download Wordpress

- Truy cập vào trang web:
 />- Hoặc download trực tiếp tại:
 />
9


Chương 3: Cài đặt wordpress trên localhost với XAMPP

Hình 3.5
3.3.2.
Cài đặt Wordpress
- Mở thư mục cài đặt XAMPP ra, tiến hành giải nén Wordpress vào
”htdocs\athena” (hình 3.6).

Hình 3.6
10


Chương 3: Cài đặt wordpress trên localhost với XAMPP
- Mở trình duyệt, truy cập vào trang ”http://localhost/athena” và tiến
hành cài đặt wordpress như hướng dẫn ở hình bên dưới.
- Ở hình 3.9, ta điền thông tin để wordpress kết nối với Database mà
ta đã tạo trên MySQL.
- Ở hình 3.11, ta điền tiêu đề trang web và thông tin tài khoản quản
trị.
- Hình 3.14 là giao diện trang quản trị của wordpress.
- Hình 3.15 là giao diện trang web lúc vừa cài đặt xong.

Hình 3.7

Hình 3.8
11


Chương 3: Cài đặt wordpress trên localhost với XAMPP

Hình 3.9

Hình 3.10

12


Chương 3: Cài đặt wordpress trên localhost với XAMPP

Hình 3.11

Hình 3.12

13


Chương 3: Cài đặt wordpress trên localhost với XAMPP

Hình 3.13

Hình 3.14

14

Chương 3: Cài đặt wordpress trên localhost với XAMPP

Hình 3.15

15


Chương 4: Phân tích thông tin danh mục web Athena

Chương 4: Phân tích thông tin danh mục web
Athena
4.1. Giao diện trang chủ
4.1.1. Header
- Phần Header gồm Logo Athena ở góc trái và banner quảng cáo ở
góc phải (hình 4.1).

Hình 4.1
4.1.2. Menu
- Phần Menu màu đỏ nằm dưới Header, chứa các chuyên mục của
web (hình 4.2).

Hình 4.2

16


Chương 4: Phân tích thông tin danh mục web Athena
4.1.3. Slider
- Phần Slider là silde show tạo bằng jquery, chứa các banner quảng

cáo (hình 4.3).

Hình 4.3
4.1.4. Last news
- Phần Last news chứa các tin tức mới cập nhật và các logo quảng
cáo nằm xen kẽ (hình 4.4, hình 4.5).

Hình 4.4

17


Chương 4: Phân tích thông tin danh mục web Athena

Hình 4.5
4.1.5. Widgets
- Phần Widgets gồm các box Quảng cáo, hỗ trợ trực tuyến, Facebook
Like, Đếm lượt truy cập.

Hình 4.6

18


Chương 4: Phân tích thông tin danh mục web Athena
4.1.6. Footer
- Phần Footer chứa thông tin liên lạc về trung tâm Athena (hình 4.7).

Hình 4.7

4.2. Giao diện danh sách bài viết cùng đề tài
- Gồm danh sách các bài viết cùng chuyên mục và phần danh sách
link của các bài viết khác (hình 4.8).

Hình 4.8
19