Đồ án Xây dựng Website bán hàng Condom Bằng WordPress

“Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh LỜI CẢM ƠN Trong thời gian làm đồ án tốt nghiệp, em nhận nhiều giúp đỡ, đóng góp ý kiến bảo nhiệt tình thầy cơ, gia đình bạn bè Em xin gửi lời cảm ơn chân thành đến Th.s Nguyễn Thị Hạnh, giảng viên Khoa Học Máy Tính – Trường Đại Học Cơng Nghệ Thơng Tin Và Truyền Thơng Việt-Hàn người tận tình hướng dẫn, bảo em suốt q trình làm khố luận Em xin chân thành cảm ơn thầy cô giáo 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, thầy Bộ mơn Khoa Học Máy Tính nói riêng dạy dỗ cho em kiến thức môn đại cương mơn chun ngành, giúp em có sở lý thuyết vững vàng tạo điều kiện giúp đỡ em suốt trình học tập Với điều kiện thời gian kinh nghiệm hạn chế học viên, báo cáo khơng thể tránh thiếu sót Em mong nhận bảo, đóng góp ý kiến q thầy để tơi có điều kiện bổ sung, nâng cao ý thức mình, phục vụ tốt công tác thực tế sau Em xin chân thành cảm ơn! SVTH: Đổ Minh Vàng “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh Mở Đầu Tính cấp thiết đề tài Ngày xã hội phát triển dẫn đến nhiều hệ lụy hệ lụy lớn tới tâm sinh lý giới trẻ nói riêng người nói chung Theo thống kê 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 nước mức báo động với 250.000 - 300.000 ca năm Các chuyên gia cảnh báo hậu khôn lường nạo phá thai độ tuổi Với phát triển tâm sinh lý việc chưa ý thức mối nguy hại này, mà số lượng ngày tăng Một phần bạn ý thức e ngại, ngại ngùng nhắc đến phòng tránh thai bao cao su, thuốc ngừa thai an toàn,…dẫn đến hệ lụy Với mục tiêu giảm thiểu e ngại người để không dẫn đến việc nêu Em xin xây dựng Website Condom với tiêu chí : an toàn, chất lượng, giảm ngại ngùng đến việc tình dục,tiện lợi Sử dụng 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 người đến với sản phẩm cách tự tin Mục tiêu nguyên cứu  Nguyên cứu WordPress  Tìm hiểu Seo đưa Website đến với người dùng Đối tượng phạm vi nguyên cứu  Đối tượng: o WordPress o Bao cao su số sản phẩm phòng the o SEO sản phẩm  Phạm vi: o WordPress o Digital Phương pháp nguyên cứu  Khảo sát tình trạng tình dục giới trẻ  Tâm sinh lý giới trẻ tình dục  Các tệ nạn tình dục  Chất lượng bao cao su SVTH: Đổ Minh Vàng “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh Ý nghĩa thực tiễn khoa học  Khoa hoc: o Hiểu biết thêm công cụ WordPress o Hiểu thêm cách thực tạo trang Website hoàn chỉnh  Thực tiển : o Đưa đến người dùng cách tiện lợi bao cao su o Giảm thiểu tình trạng phức tạp tình dục o Giúp phần tình trạng e dè/ ngại ngùng Bao cao su Chương Giới thiệu WordPress số công cụ liên quan 1.1 Giới thiệu WordPress WordPress hệ thống xuất blog viết ngôn ngữ lập trình PHP sử dụng MySQL database (cơ sở liệu MySQL) WordPress hậu duệ thức b2/cafelog, phát triển Michel Valdrighi Cái tên WordPress đề xuất Christine Selleck, người bạn nhà phát triển Matt Mullenweg Phiên WordPress phiên 5.5, phát hành ngày 11 tháng 08 năm 2020 Nó phát hành Giấy phép Tài liệu Tự GNU 1.1.1 Tổng quan WordPress biết đến CMS miễn phí tốt, dễ sử dụng phổ biến giới Các so sánh cho thấy người dùng sử dụng CMS cho việc lập trang web cá nhân đến trang báo điện tử đồ sộ 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% trang web nằm top 10 triệu trang web hàng đầu giới sử dụng WordPress 1.1.2 Lịch sử SVTH: Đổ Minh Vàng “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh b2/cafelog, thường biết đến với tên đơn giản b2 hay cafelog tiền thân WordPress b2/cafelog theo ước lượng sử dụng khoảng 2000 blog tháng năm 2003 Nó viết ngơn ngữ lập trình PHP để dùng với MySQL Michel Valdrighi, người trở thành nhà phát triển WordPress Mặc dù WordPress hậu duệ thức dự án khác, b2evolution, song song phát triển Vào năm 2004, thời hạn cấp phép gói sản phẩm cạnh tranh Movable Type bị thay đổi Six Apart, nhiều người dùng chuyển sang sử dụng WordPress, tạo nên bước ngoặt lớn phát triển phổ biến WordPress Năm 2007, WordPress giành giải thưởng Packt Open Source CMS Năm 2009 WordPress dẫn đầu mã nguồn CMS tốt Vào ngày 06 tháng 12 năm 2018, WordPress mắt phiê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 viết phong phú phức tạp Có nhiều tranh cãi mắt Gutenberg, bao gồm 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 1.1.3 Nét bật         Hệ thống Plugin phong phú không ngừng cập nhật, ngồi người dùng viết Plugin tích hợp code vào Wordpress Được phát triển nhiều ngôn ngữ (hỗ trợ tiếng việt) Cập nhật phiên liên tục, cộng đồng hỗ trợ lớn Có hệ thống Theme đồ sộ, nhiều theme chuyên nghiệp có khả SEO tốt Việc quản lý blog, quản lý viết thuận tiện giống phần mềm thiết kế website chuyên nghiệp Thể tệp PDF, DOC, Powerpoint nội dung viết Đặc biệt tích hợp sẵn Latex - cơng cụ soạn thảo cơng thức tốn học, giúp người sử dụng viết cơng thức tốn học blog WordPress có 23 Widget (ứng dụng tạo thêm) Thống kê số truy nhập blog, Các nhất, Các viết bật nhất, Các comment nhất, Liệt kê chuyên mục, Liệt kê Trang, Danh sách liên kết, Liệt kê số viết tháng Có 79 theme để người dùng lựa chọn Ngoài việc áp dụng để xây dựng Website dạng trang tin tức Blog, WordPress sử dụng để xây dựng nên Website thương mại điện tử với mục đích bán hàng Online (Plugin Woocommerce) Tuy nhiên xét phương diện WordPress khơng thực trội SVTH: Đổ Minh Vàng “Đồ án tốt nghiệp”       GVHD: Nguyễn Thị Hạnh Ngoài thống kê số truy nhập ngày cho blog, Wordpress thống kê số truy nhập ngày viết blog Trên sở chủ blog có định hướng nên viết vấn đề Các comment duyệt cho đăng, comment có nội dung khơng phù hợp xóa, cho spam sau IP khơng gửi comment vào blog Admin (chủ blog) cho 35 cộng tác viên gửi vào blog, phân quyền cho cộng tác viên theo cấp độ khác Lưu giữ danh sách thành viên ghé thăm trang blog Admin cho đăng qua email vào blog miễn admin cho họ địa email bí mật blog (địa thay đổi lúc nào) Sao lưu liệu nhằm khôi phục nội dung blog cách dễ dàng chẳng may blog bị hack, cung cấp công cụ chuyển nhà từ blog khác sang blog WordPress WordPress hỗ trợ GB để lưu trữ tệp hình ảnh văn Hàng ngày WordPress có thống kê 100 blog tiếng Việt WordPress nhiều người đọc vịng 48 tiếng Nhờ bạn biết thông tin quan trọng diễn 1.1.4 Đối tượng sử dụng Có hai đối tượng sử dụng WordPress:   Những người hiểu biết sử dụng, bao gồm cài đặt WordPress, sử dụng giao diện plugin có sẵn để tùy biến phục vụ mục đích mình, xuất web Thường người làm blog, marketing,… Những người có kiến thức lập trình, có khả can thiệp bổ sung/mở rộng tính WordPress Sử dụng tốt thục khả mở rộng WordPress Họ cơng ty thiết kế website WordPress lập trình viên 1.1.5 Cấu trúc trang WordPress  Bộ quản trị wordpress gồm phần sau:  Dashboard: Tổng quan quản trị wordpress, bao gồm thơng tin tóm tắt website wordpress, viết blog nhanh, số bình luận nhất, từ wordpress.org blog, plugin phổ biến nhất, link đến website bạn SVTH: Đổ Minh Vàng “Đồ án tốt nghiệp”      GVHD: Nguyễn Thị Hạnh o Updates: Hiển thị tất theme plugin có vào phép nâng cấp trực tiếp Posts: Quản lý viết, tag danh mục (category) o All posts: Quản lý tất viết o Add new: Đăng viết o Categories: Quản lý tất danh mục o Tags:Quản lý tất Post Tag Appearance: Quản lý giao diện o Themes: Thêm 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ý 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 Tools: Các công cụ nhập/xuất nội dung Settings: Thiết lập tùy chọn o Genetal: Cài đặt chung o Writing Settings: Cài đặt 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 video o Permalink Settings: Cài đặt đường dẫn tĩnh 1.2 Cài đặt WordpPress Localohost với Xampp 1.1.1 Localhost Là Localhost có nghĩa máy chủ hoạt động máy tính 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 môi trường giống hosting chạy source code WordPress máy tính bạn Giống Hosting, bạn cần ứng dụng phần mêm sau:     Web server, Apache PHP MySQL PHPMyAdmin SVTH: Đổ Minh Vàng “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh 1.1.2 Cách Thức Localhost hoạt động Sau cặt đặt Local host, khởi động Apache bạn truy cập vào địa http://127.0.0.0 http://localhost Có lưu ý bạn phải kích hoạt ứng dụng kèm chạy localhost ( Mở bảng điều khiển Cpanel) 1.1.3 Hướng dẫn cách cài đặt Lovalhost Đầu tiền cần download cài đặt phần mềm XAMPP XAMPP phần mềm phổ biến, miễn phí ln có cập nhật liên tục, hỗ trợ hầu hết hệ điều hành Windows, Linux, Mact Vậy khuyên bạn sử dụng XAMPP Các bạn bấm vào link để download: https://www.apachefriends.org/download.html Ngay ô bạn tháy XAPP for Windows, cho Windows Sau tải bấm cài đặt Sẽ bảng thông báo xuất Nếu bạn kích hoạt User Account Control (UAC) vài XAMPP bị hạn Nên cảnh báo yêu cầu bạn bỏ kích hoạt UAC Bấm Next để tiến hành cài đặt: Giữ nguyên bấm Next Tiếp theo chọn đường dẫn để cài đặt Bạn giữ ngun 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 xong Và bấm Finish cài đặt thành công XAMPP Lựa chọn ngôn ngữ, bảng điều khiển XAMPP tự khởi động Mở trình duyệt web gõ vào địa http://localhost http://127.0.0.1 Một trang giới thiệu xuất Ở bạn thấy menu FAQs ( Câu hỏi thường gặp), HOW-TO Guides ( Hướng dẫn cách làm), phpMyAdmin Bạn tạ o sở liệu phpMyAdmin SVTH: Đổ Minh Vàng “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh Bạn cần hiểu rõ cách thức hoạt động localhost hosting thông thường Hosting nơi để lưu trữ website bạn, localhost lưu trữ blog hay website bạn vào thư mục máy tinh bạn Ví dụ: tạo thư mục motnoi với đường dẫn C:xampp/htdocs/motnoi Đây thư mục website bạn ( hay gọi thư mục gốc) Để kiểm tra thử copy-paste file vào thư mục C:xampp/htdocs/motnoi SVTH: Đổ Minh Vàng “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh Hình localhost hoạt động tốt 1.1.4 Tạo sở liệu Mysql Bạn làm ln bước này, sau cài đặt WordPress Mình hướng dẫn tạo MySQL bước Một sở liệu bao gồm: Tên database: Tên user database:  Mật user database:  Database host: Truy cập đường dẫn: http://localhost/phpmyadmin/ Để tiến hành tạo sở   liệu SVTH: Đổ Minh Vàng “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh Chọn sở liệu góc trái Với localhost khơng cần tạo user cho database Điền thông tin sau được: Tên user database: root Password: Bỏ trống Điền tên sở liệu, đặt tên motnoi, bên cạnh utf8_unicode_ci bấm Tạo   Tạo sở liệu SVTH: Đổ Minh Vàng 10 “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh Hình 3.1.4 Trang tốn Hình 3.1.4 Trang tốn SVTH: Đổ Minh Vàng 32 “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh Hình 3.1.6 Trang tài khoản SVTH: Đổ Minh Vàng 33 “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh 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 SVTH: Đổ Minh Vàng 34 “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh Hình 3.2.3 Trang quản lý sản phẩm Hình 3.2.4 Trang quản lý danh mục sản phẩm SVTH: Đổ Minh Vàng 35 “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh Hình 3.2.5 Trang quản lý từ khóa Hình 3.2.6 Trang quản lý giao diện SVTH: Đổ Minh Vàng 36 “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh Hình 3.2.7 Trang quản lý Plugin Hình 3.2.8 Trang quản lý tài khoản SVTH: Đổ Minh Vàng 37 “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh Hình 3.2.9 Trang đơn hàng SVTH: Đổ Minh Vàng 38 “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh Hình 3.2.10 Trang giao diện điện thoại SVTH: Đổ Minh Vàng 39 “Đồ án tốt nghiệp” 3.3 GVHD: Nguyễn Thị Hạnh Các Plugin sử dụng  Age Verification : Là xác minh độ tuổi cho WordPress Thêm cửa sổ bật lên vào trang web bạn xác minh tuổi khách truy cập trước cho phép họ xem nội dung bạn Hình 3.3.1 Age Verification  Easy WP SMTP : Easy WP SMTP cho phép bạn định cấu hình gửi tất email gửi qua máy chủ SMTP Điều ngăn không cho email bạn vào thư mục rác / thư rác người nhận Hình 3.3.2 SVTH: Đổ Minh Vàng Easy WP SMTP 40 “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh  Easy Google Fonts : Một cách đơn giản dễ dàng để thêm phông chữ google tùy chỉnh vào chủ đề WordPress mà không cần mã hóa Plugin tích hợp với WordPress Customizer để bạn xem trước phơng chữ google trang web thời gian thực Nó tương thích với chủ đề Hình 3.3.3 Easy Google Fonts  Facebook For WooCommerce : Đây plugin Facebook thức cho WooCommerce kết nối trang web WooCommerce bạn với Facebook Với plugin này, bạn cài đặt pixel Facebook, tải lên danh mục cửa hàng trực tuyến tạo cửa hàng trang Facebook mình, cho phép bạn dễ dàng chạy quảng cáo động Hình 3.3.4 SVTH: Đổ Minh Vàng Facebook For WooCommerce 41 “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh  Mailchimp for WooCommerce : Tham gia 17 triệu khách hàng sử dụng Mailchimp, tảng tự động hóa tiếp thị lớn giới, để phát triển chiến lược tiếp thị thương mại điện tử họ Với tích hợp Mailchimp thức cho WooCommerce, khách hàng bạn liệu mua hàng họ tự động đồng hóa với tài khoản Mailchimp bạn, giúp bạn dễ dàng gửi chiến dịch nhắm mục tiêu, tự động theo dõi khách hàng sau mua hàng, giới thiệu sản phẩm, khôi phục giỏ hàng bị bỏ rơi đo lường ROI nỗ lực tiếp thị bạn Và hồn tồn miễn phí Hình 3.3.5 Mailchimp For WooCommerece SVTH: Đổ Minh Vàng 42 “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh  Nextend Social Login : Nextend Social Login plugin WordPress chuyên nghiệp, dễ sử dụng miễn phí Nó cho phép khách truy cập đăng ký đăng nhập vào trang web bạn hồ sơ xã hội họ(Facebook, Google, Twitter, v.v.) thay buộc họ phải dành thời gian quý báu để điền vào biểu mẫu đăng ký mặc định Bên cạnh đó, họ khơng cần phải đợi email xác thực theo dõi tên người dùng mật Hình 3.3.6 Nextend Social Login  NotificationX : Bạn muốn tạo uy tín tức cho doanh nghiệp tăng tỷ lệ chuyển đổi lập tức? 97% tổng số khách truy cập trang web bạn không mua sản phẩm thiếu tin tưởng uy tín Nhận thành cơng với Thông báo bật lên bán hàng WooCommerce ! SVTH: Đổ Minh Vàng 43 “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh Hình 3.3.7 NotificationX  WooCommerce : WooCommerce giải pháp Thương mại điện tử nguồn mở phổ biến giới Nền tảng cốt lõi chúng tơi miễn phí, linh hoạt cộng đồng toàn cầu khuếch đại Quyền tự nguồn mở có nghĩa bạn có tồn quyền sở hữu vĩnh viễn nội dung liệu cửa hàng.Cho dù bạn khởi động công việc kinh doanh, bán lẻ trực tuyến truyền thống hay phát triển trang web cho khách hàng, sử dụng WooCommerce cho cửa hàng kết hợp mạnh mẽ nội dung thương mại Hình 3.3.8 SVTH: Đổ Minh Vàng WooCommerce 44 “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh Kết luận hướng phát triển Kết luận Đề Tài “Xây dựng Website bán hàng Condom Bằng WordPress” phát triển từ thực tế nhằm tạo tảng bán hàng uy tín khách hàng Mặc dù có nhiều cố gắng, tìm hiểu kiến thức học, kết hợp tra cứu tài liệu mạng hạn chế thời gian, khả kinh nghiệm nên không tránh thiếu sót định nên đề tài hồn thành mức độ sau:  Tìm hiểu Web Wordpress.Mysql…  Áp dụng kiến thức học đồ họa 2d (Ai), chỉnh sửa ảnh (Photoshop)…  Tiếp cận Trang web đến với khách hàng Trên Fb  Áp dụng nhu cầu mục tiêu vào đề tài… Hướng phát triển Xây dựng trang web đến với khách hàng cách tiện lợi an toàn đảm bảo an tồn thơng tin cá nhân Tiếp cận tốn Internet bank cách nhanh chóng Phát triển số lượng sản phẩm nhà đầu tư SVTH: Đổ Minh Vàng 45 “Đồ án tốt nghiệp” GVHD: Nguyễn Thị Hạnh Tài liệu tham khảo 1) 2) 3) 4) 5) 6) 7) 8) 9) https://wordpress.org/ https://facebook.com/ https://translate.google.com/ https://shopbaocaosu3s.com/ https://www307.regione.toscana.it/web/yduoctaman/home/-/blogs/tong-hop-thuoctang-kich-thuoc-duong-vat-tot-nhat-2021 https://nhathuocvinhloi.vn/thuoc-sinh-ly-nam/ https://shopee.vn/ https://tiki.vn/ https://www.google.com.vn/ SVTH: Đổ Minh Vàng 46 ... Kết luận hướng phát triển Kết luận Đề Tài ? ?Xây dựng Website bán hàng Condom Bằng WordPress? ?? phát triển từ thực tế nhằm tạo tảng bán hàng uy tín khách hàng Mặc dù có nhiều cố gắng, tìm hiểu kiến... viết tháng Có 79 theme để người dùng lựa chọn Ngồi việc áp dụng để xây dựng Website dạng trang tin tức Blog, WordPress sử dụng để xây dựng nên Website thương mại điện tử với mục đích bán hàng. .. Biểu đồ usecase tổng quát SVTH: Đổ Minh Vàng 19 ? ?Đồ án tốt nghiệp” 2.3.2 GVHD: Nguyễn Thị Hạnh Mô tả Usecase:  Khách hàng: Hình 2.3.2 Biểu đồ Usecase khách hàng SVTH: Đổ Minh Vàng 20 ? ?Đồ án tốt