Đồ án tốt nghiệp Công nghệ thông tin: Xây dựng Website bán hàng Condom Bằng WordPress

Đề Tài “Xây dựng Website bán hàng Condom Bằng WordPress” cũng phát triển từ thực tế hiện nay nhằm tạo ra nền tảng bán hàng uy tín và vì khách hàng. Mời các bạn cùng tham khảo!

người đã tận tình hướng dẫn, chỉ bảo em trong suốt quá trình làm khoá luận

Em cũng xin chân thành cảm ơn các thầy cô giáo trong trường Trường Đại Học Công Nghệ Thông Tin Và Truyền Thông Việt-Hàn nói chung, các thầy cô trong Bộ môn Khoa Học Máy Tính nói riêng đã dạy dỗ cho em kiến thức về các môn đại cương cũng như các môn chuyên ngành, giúp em có được cơ sở lý thuyết vững vàng và tạo điều kiện giúp đỡ

em trong suốt quá trình học tập

Với điều kiện thời gian cũng như kinh nghiệm còn hạn chế của một học viên, bài báo cáo này không thể tránh được những thiếu sót Em rất mong nhận được sự chỉ bảo, đóng góp

ý kiến của các quý thầy cô để tôi có điều kiện bổ sung, nâng cao ý thức của mình, phục

vụ tốt hơn công tác thực tế sau này

Em xin chân thành cảm ơn!

Mở Đầu

1 Tính cấp thiết của đề tài

Ngày nay xã hội phát triển dẫn đến nhiều hệ lụy một trong những hệ lụy lớn nhất là tới tâm sinh lý giới trẻ nói riêng và mọi người nói chung Theo thống kê của Tổng cục Dân số - Kế hoạch hóa gia đình, tỷ lệ phá thai ở lứa tuổi vị thành niên trong cả nước đang ở mức báo động với 250.000 - 300.000 ca mỗi năm Các chuyên gia cũng cảnh báo về những hậu quả khôn lường khi nạo phá thai ở độ tuổi này Với sự phát triển tâm sinh lý và việc còn chưa ý thức được mối nguy hại này,

mà số lượng ngày càng tăng Một phần các bạn ý thức được nhưng sự e ngại, ngại ngùng khi nhắc đến phòng tránh thai như bao cao su, thuốc ngừa thai an toàn,…dẫn đến hệ lụy này Với mục tiêu giảm thiểu sự e ngại của mọi người để không dẫn đến sự việc nêu trên Em xin xây dựng Website Condom với tiêu chí :

an toàn, chất lượng, giảm sự ngại ngùng đến việc tình dục,tiện lợi Sử dụng các từ nói tránh nói giảm, hình ảnh tính chất 2D vui nhộn, hài hước để tăng mọi người đến với sản phẩm một cách tự tin

2 Mục tiêu nguyên cứu

 Nguyên cứu về WordPress

 Tìm hiểu về Seo đưa Website đến với người dùng

3 Đối tượng và phạm vi nguyên cứu

4 Phương pháp nguyên cứu

 Khảo sát tình trạng tình dục của giới trẻ

 Tâm sinh lý của giới trẻ về tình dục

 Các tệ nạn về tình dục hiện nay

5 Ý nghĩa thực tiễn và khoa học

 Khoa hoc:

o Hiểu biết thêm về công cụ WordPress

o Hiểu thêm về cách thực tạo ra một trang Website hoàn chỉnh

 Thực tiển :

o Đưa đến người dùng một cách tiện lợi nhất về bao cao su

o Giảm thiểu được tình trạng phức tạp hiện nay về tình dục

o Giúp được một phần về tình trạng e dè/ ngại ngùng về Bao cao su

Chương 1 Giới thiệu WordPress và một số công cụ

liên quan

1.1 Giới thiệu WordPress

WordPress là một hệ thống xuất bản blog viết bằng ngôn ngữ lập trình PHP và sử dụng MySQL database (cơ sở dữ liệu MySQL) WordPress là hậu duệ chính thức của b2/cafelog, được phát triển bởi Michel Valdrighi Cái tên WordPress được đề xuất bởi Christine Selleck, một người bạn của nhà phát triển chính Matt Mullenweg Phiên bản mới nhất của WordPress là phiên bản 5.5, phát hành ngày 11 tháng 08 năm

2020 Nó được phát hành dưới Giấy phép Tài liệu Tự do GNU

1.1.1 Tổng quan

WordPress được biết đến như một CMS miễn phí nhưng tốt, dễ sử dụng và phổ biến nhất trên thế giới Các so sánh đều cho thấy người dùng sử dụng CMS này cho việc lập các trang web cá nhân đến các trang báo điện tử đồ sộ nhất như CNN, Dow Jones, Wall Street Journal sử dụng WordPress

Thống kê năm 2019 cho thấy có đến xấp xỉ 33.8% các trang web nằm trong top 10 triệu trang web hàng đầu thế giới đang sử dụng WordPress

1.1.2 Lịch sử

b2/cafelog, thường được biết đến với cái tên đơn giản hơn là b2 hay cafelog là tiền thân của WordPress b2/cafelog theo ước lượng đã được sử dụng ở khoảng 2000 blog trong tháng 5 năm 2003 Nó cũng được viết bằng ngôn ngữ lập trình PHP để dùng với MySQL bởi Michel Valdrighi, người đã trở thành nhà phát triển chính của WordPress hiện nay Mặc dù WordPress là hậu duệ chính thức nhưng một dự án khác, b2evolution, cũng đang được song song phát triển

Vào năm 2004, thời hạn cấp phép của gói sản phẩm cạnh tranh Movable Type bị thay đổi bởi Six Apart, và rất nhiều người dùng của nó chuyển sang sử dụng WordPress, tạo nên một bước ngoặt lớn trong sự phát triển và phổ biến của WordPress

Năm 2007, WordPress giành giải thưởng Packt Open Source CMS Năm 2009 WordPress dẫn đầu về mã nguồn CMS tốt nhất

Vào ngày 06 tháng 12 năm 2018, WordPress ra mắt phiên bản 5.0 với cải tiến lớn, giới thiệu Trình soạn thảo block mang tên Gutenberg giúp tùy chỉnh bố cục bài viết phong phú và phức tạp hơn Có nhiều cuộc tranh cãi về sự ra mắt của Gutenberg, bao gồm cả phong trào tách riêng đến từ nhiều lập trình viên không muốn sử dụng tính năng này

 Có hệ thống Theme đồ sộ, nhiều theme chuyên nghiệp có khả năng SEO tốt

 Việc quản lý blog, quản lý các bài viết rất thuận tiện giống như các phần mềm thiết kế website chuyên nghiệp

 Thể hiện các tệp PDF, DOC, Powerpoint ngay trên nội dung bài viết Đặc biệt tích hợp sẵn Latex - công cụ soạn thảo công thức toán học, giúp người sử dụng

có thể viết công thức toán học ngay trên blog

 WordPress có 23 Widget (ứng dụng tạo thêm) như Thống kê số truy nhập blog, Các bài mới nhất, Các bài viết nổi bật nhất, Các comment mới nhất, Liệt kê các chuyên mục, Liệt kê các Trang, Danh sách các liên kết, Liệt kê số bài viết trong từng tháng Có 79 theme để người dùng lựa chọn

 Ngoài việc được áp dụng để xây dựng các Website dạng trang tin tức và Blog, WordPress còn được sử dụng để xây dựng nên các Website thương mại điện tử với mục đích chính là bán hàng Online (Plugin Woocommerce) Tuy nhiên nếu

 Ngoài thống kê số truy nhập của từng ngày cho blog, Wordpress còn thống kê số truy nhập của từng ngày đối với mỗi bài viết của blog Trên cơ sở đó chủ blog sẽ

có định hướng nên viết vấn đề gì tiếp theo

 Các comment có thể duyệt rồi mới cho đăng, comment nào có nội dung không phù hợp có thể xóa, nếu cho là spam thì sau này IP đó không có thể gửi comment vào blog được nữa

 Admin (chủ blog) có thể cho 35 cộng tác viên gửi bài vào blog, có thể phân quyền cho các cộng tác viên theo các cấp độ khác nhau Lưu giữ danh sách thành viên đã ghé thăm trang blog Admin cũng có thể cho bất kỳ ai đăng bài qua email vào blog miễn là admin cho họ một địa chỉ email bí mật của blog (địa chỉ này có thể thay đổi bất kỳ lúc nào)

 Sao lưu dữ liệu nhằm khôi phục nội dung blog một cách dễ dàng nếu chẳng may blog bị hack, và cung cấp công cụ chuyển nhà từ các blog khác sang blog WordPress

 WordPress hỗ trợ 3 GB để lưu trữ các tệp hình ảnh và văn bản

 Hàng ngày WordPress có thống kê 100 bài trên các blog tiếng Việt của WordPress được nhiều người đọc nhất trong vòng 48 tiếng Nhờ đó bạn biết được các thông tin quan trọng nhất đang diễn ra

1.1.4 Đối tượng sử dụng

Có hai đối tượng chính sử dụng WordPress:

 Những người hiểu biết cơ bản về sử dụng, bao gồm cài đặt WordPress, sử dụng giao diện và plugin có sẵn để tùy biến phục vụ mục đích của mình, xuất bản web Thường là những người làm blog, marketing,…

 Những người có kiến thức về lập trình, có khả năng can thiệp và bổ sung/mở rộng tính năng của WordPress Sử dụng tốt và thuần thục hơn các khả năng mở rộng của WordPress Họ có thể là các công ty thiết kế website WordPress hoặc các lập trình viên

1.1.5 Cấu trúc của một trang WordPress

 Bộ quản trị wordpress gồm các phần sau:

 Dashboard: Tổng quan về quản trị wordpress, bao gồm thông tin tóm tắt về website wordpress, viết blog nhanh, một số bình luận mới nhất, bài từ wordpress.org blog, plugin mới và phổ biến nhất, và link đến website của bạn

o Updates: Hiển thị tất cả các theme và plugin có bản mới vào phép nâng cấp trực tiếp

 Posts: Quản lý bài viết, tag và danh mục (category)

o All posts: Quản lý tất cả các bài viết

o Add new: Đăng bài viết mới

o Categories: Quản lý tất cả các danh mục

o Tags:Quản lý tất cả các Post Tag

 Appearance: Quản lý giao diện

o Themes: Thêm mới và quản lý giao diện

o Customize: Tùy chỉnh giao diện

o Widgets: Thêm tiện ích

o Menu: Quản lý menu

 Plugins: Quản lý các thành phần mở rộng

o Installed Plugins: Những thành phần mở rộng đã cài đặt

o Add new: cài đặt mới

 Tools: Các công cụ nhập/xuất nội dung

 Settings: Thiết lập các tùy chọn

o Genetal: Cài đặt chung

o Writing Settings: Cài đặt bài viết

o Reading Settings: Cài đặt đọc

o Discussion Settings: Cài đặt bình luận

o Media Settings: Cài đặt media như ảnh video

o Permalink Settings: Cài đặt đường dẫn tĩnh

1.2 Cài đặt WordpPress trên Localohost với Xampp

1.1.1 Localhost Là gì

Localhost có nghĩa là một máy chủ hoạt động trên chính máy tính của bạn Với việc cài đặt nhiều ứng dụng hỗ trợ khác nhau, giúp bạn tạo ra một môi trường giống như hosting có thể chạy source code của WordPress trên máy tính của bạn Giống như Hosting, bạn cần những ứng dụng và phần mêm sau:

 Web server, Apache

 PHP

 MySQL

 PHPMyAdmin

1.1.3 Hướng dẫn cách cài đặt Lovalhost

Đầu tiền cần download và cài đặt phần mềm XAMPP

XAMPP là phần mềm rất phổ biến, miễn phí và luôn có các bản cập nhật liên tục, hỗ trợ hầu hết các hệ điều hành Windows, Linux, Mact

Vậy mình khuyên các bạn sử dụng XAMPP

Các bạn bấm vào link này để

Bấm Next để tiến hành cài đặt:

Giữ nguyên và bấm Next

Tiếp theo chọn đường dẫn để cài đặt Bạn cứ giữ nguyên là tốt nhân

Bỏ tích ô “Learn more about Bitnami for XAMPP”

Đợi phần mềm tiến hành cài đặt là xong Và bấm Finish là đã cài đặt thành công XAMPP

Lựa chọn ngôn ngữ, và bảng điều khiển XAMPP sẽ tự khởi động

Mở trình duyệt web gõ vào thanh địa chỉ http://localhost hoặc http://127.0.0.1 Một trang giới thiệu sẽ xuất hiện

Ở đây bạn có thể thấy trên thanh menu FAQs ( Câu hỏi thường gặp), HOW-TO Guides ( Hướng dẫn cách làm), phpMyAdmin

Bạn có thể tạ o cơ sở dữ liệu tại phpMyAdmin

Bạn cần hiểu rõ cách thức hoạt động của localhost như một hosting thông thường vậy Hosting là một nơi để lưu trữ website của bạn, thì localhost cũng vậy nó lưu trữ blog hay website của bạn vào một thư mục trên máy tinh của bạn

Ví dụ: ở đây mình tạo một thư mục motnoi với đường

dẫn C:xampp/htdocs/motnoi Đây chính là thư mục chứ website của bạn ( hay

còn gọi là thư mục gốc)

Để kiểm tra hãy thử copy-paste bất kì một file nào vào thư

mục C:xampp/htdocs/motnoi

Hình localhost đã hoạt động tốt.

1.1.4 Tạo cơ sở dữ liệu Mysql

Bạn có thể làm luôn tại bước này, hoặc sau này khi cài đặt WordPress Mình sẽ hướng dẫn tạo MySQL ở bước này luôn

Một cơ sở dữ liệu luôn bao gồm:

 Tên của database:

 Tên user database:

 Mật khẩu user database:

 Database host:

Truy cập đường dẫn: http://localhost/phpmyadmin/ Để tiến hành tạo cơ sở dữ

liệu

Chọn cơ sở dữ liệu ở góc trái

Với localhost không cần tạo user cho database Điền những thông tin sau là được:

 Tên user database: root

Tạo thành công bên trái sẽ xuất hiện tên cơ sở dữ liệu

Như vậy là bạn đã cài đặt xong Localhost với XAMPP thành công

1.1.5 Cài đặt WordPress

1.1.5.1 Bước 1: Tải file mã nguồn mở từ WordPress.org

Giống như cài đặt WordPress trên hosting, bước đầu tiên đó là download source

code của WordPress trên trang: wordpress.org

Download WordPress trên trang: wordpress.org

Tải file zip đó về giải nén vào thư mục C:xampp/htdocs/motnoi( file bạn vừa

đặt tên ở trên) Sẽ thấy một file tên là: wordpress

Trong file này chứa tất cả mã nguồn mở của wordpress: wp-admin, wp-content,

wp-includes, wp-config-sample.php…

1.1.5.2 Bước 2: Copy tất cả các file mã nguồn WordPress về local

Bây giờ để cài đặt wordpress với đường dẫn: http://localhost/motnoi

Thì bạn cần copy tất cả file trong thư mục wordpress về thư mục motnoi ( đường

dẫn C:xampp/htdocs/motnoi)

1.1.5.3 Bước 3: Tạo cơ sở dữ liệu( Database) trên Localhost

Để cài đặt wordpress trên localhost Bạn cần tạo một cơ sở dữ liệu

để MySQL có thể chạy, bước này mình đã hướng dẫn ở bước trên Nếu quên thì kéo lên trên nhé

1.1.5.4 Bước 4: Cài đặt WordPress

Tiếp theo truy cập http:/localhost/motnoi/ để tiến hành cài đặt wordpres ( nhớ luôn khởi động Apache và MySQL)

Sẽ xuất hiện một màn hình giao diện sau, bạn chỉ cần chọn ngôn ngữ cài đặt và

bấm continue Ở đây mình chọn English

Cài đặt WordPress

Tiếp sẽ có một thông báo nếu bạn chưa đổi tên config-sample.php thành

wp-config.php Bấm Let’s go để tiến hành điền thông tin database:

Điền đầy đủ thông tin rồi bấm Sumbmit Tiếp tục bấm Run the install để cài đặt tiếp

 Database Name: tên cơ sở dữ liệu tạo ở trên

 Username: root

 Database Host: localhost

 Table Prefix: wp_ ( bạn có thể đỗi tiền tố này thành gì tùy ý bạn)

Điền nốt thông tin như: Site Title, Username, Password, Email và bấm Install

WordPress

Đây là kết quả thành công sau khi bạn cài đặt WordPress trên localhost

Đường dẫn truy cập vào trang quản trị là: http://localhost/motnoi/wp-admin

Chương 2: Phân tích và thiết kế hệ thống

2.1 Đặc tả yêu cầu

Trang Web hỗ trợ người dùng mua bán sản phẩm condom Nhưng với mục tiêu an toàn, bí mật, giảm thiểu độ nhạy cảm Người dùng xem, mua, thanh toán sản phẩm Người dùng sẽ được Đăng Nhập/Đăng xuất để mua sản phẩm, xem thông tin cá nhân của mình Sẽ được hổ trợ một cách trực tiếp với giao diện tiện lợi

Các Admin quản lý được sản phẩm, số lượng, đơn hàng… Cập nhập thông tin sản phẩm thông tin khách hàng một cách nhanh nhất, tiện lợi

2.1.1 Yêu cầu chức năng

2.1.2 Yêu cầu phi chức năng

 Giao diện Website đẹp mắt, thân thiện với người dụng

2.2.2 Xác định các Use Case:

- Khách hàng :

o Xem danh sách sản phẩm

o Xem chi tiết sản phẩm

o Xem sản phẩm theo từng danh mục

o Xem thông tin tài khoản

o Thay đổi thông tin tài khoản

- Admin :

o Quản lý danh sách sản phẩm

o Quản lý danh mục sản phẩm, xuất xứ sản phẩm

o Tìm kiếm sản phẩm theo từ khóa

2.3 Biểu đồ USES- CASE

2.3.1 Xây dựng biểu đồ Usecase:

Hình 2.3.1 Biểu đồ usecase tổng quát

2.3.2 Mô tả Usecase:

 Khách hàng:

Hình 2.3.2 Biểu đồ Usecase khách hàng

Hình 2.3.3 Quản lý giỏ hàng

 Admin:

Hình 2.3.4 Biểu đồ Usecase Admin

Hình 2.3.5 Biểu đồ quản lý sản phẩm

Hình 2.3.6 Biểu đồ quản lý danh mục sản phẩm

Hình 2.3.7 Biểu đồ quản lý từ khóa sản phẩm

2.3.3 Mô tả Cơ sở dữ liệu

 Một số cơ sở dữ liệu của Mysql

Một số cơ sở dữ liệu của Mysql

 Từ điển dữ liệu

User_nickname Varchar(50) Tên tài khoản User_email Varchar(100) Tên email User_registered Datetime

Display_name Varchar(50) Hiển thị tên

_lookup

Thuộc tính Kiểu dữ liệu Diễn giải

Wp_Wc_oder_stats Thuộc tính Kiểu dữ liệu Diễn giải

Date_created datetime

Chương 3 Xây dựng chương trình

3.1 Giao diện trang người dùng

Hình 3.1 Trang chủ hiển thị

Hình 3.1.2 chi tiết sản phẩm

Hình 3.1.3 Trang giỏ hàng

Hình 3.1.4 Trang thanh toán

Hình 3.1.4 Trang thanh toán

Hình 3.1.6 Trang tài khoản

3.2 Giao diện quản trị

Hình 3.2.1 Trang đăng nhập cho Admin

Hình 3.2.2 Trang chủ Admin