1. Trang chủ
  2. » Luận Văn - Báo Cáo

Xây dựng website bán đồ handmade

36 28 0

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Tiêu đề Xây Dựng Website Bán Đồ Handmade
Tác giả Vi Thị Huyền Trang, Trần Ngọc Khánh
Người hướng dẫn Cấn Đức Điệp
Trường học Trường Đại Học Điện Lực
Chuyên ngành Công Nghệ Thông Tin
Thể loại báo cáo
Năm xuất bản 2021
Thành phố Hà Nội
Định dạng
Số trang 36
Dung lượng 7,52 MB

Cấu trúc

  • CHƯƠNG I.TỔNG QUAN VỀ PHẦN MỀM MÃ NGUỒN MỞ (7)
    • 1.1. Tìm hiểu về phần mềm mã nguồn mở (7)
    • 1.2. Lợi ích của phần mềm mã nguồn mở (7)
  • CHƯƠNG II. WORDPRESS (8)
    • 2.1. Tìm hiểu về phần mềm mã nguồn mở Wordpress (8)
    • 2.2. Cài đặt Localhost trên máy tính để tìm hiểu WordPress (9)
      • 2.2.1 Cài đặt localhost trên máy tính với XAMPP (9)
      • 2.2.2. Các bước cài đặt WordPress trên Localhost (14)
    • 2.3. Chuyển trang web từ Localhost lên Hosting (20)
      • 2.3.1. Thông tin tên miền (Domain) (20)
      • 2.3.2. Thông tin hosting (20)
      • 2.3.3. Deploy trang web (21)
  • CHƯƠNG III.THIẾT KẾ GIAO DIỆN V KIỂM THỬ (25)
    • 3.1. Giao diện người dùng (25)
      • 3.1.1. Trang chủ (25)
      • 3.1.2. Menu chính (27)
      • 3.1.3. Trang đăng nhập (27)
      • 3.1.4. Trang sale (0)
      • 3.1.5. Trang liên hệ (0)
      • 3.1.6. Trang chi tiết sản phẩm (30)
      • 3.1.7. Trang giỏ hàng (30)
      • 3.1.8. Trang thanh toán (31)
      • 3.1.9. Trang đánh giá sản phẩm (0)
    • 3.2. Trang quản trị hệ thống (32)
    • 3.3. Thông tin phần mềm (33)
      • 3.3.1. Giao diện sử dụng (Theme) (33)
      • 3.3.2. Các plugin đang sử dụng (10 plugin) (33)
  • KẾT LUẬN (35)

Nội dung

QUAN VỀ PHẦN MỀM MÃ NGUỒN MỞ

Tìm hiểu về phần mềm mã nguồn mở

Mã nguồn mở (Open source) đề cập đến phần mềm được phát hành với mã nguồn công khai, cho phép người dùng không chỉ miễn phí về giá cả mà còn về quyền sử dụng Người dùng có quyền sửa đổi, cải tiến và phát triển phần mềm theo các nguyên tắc trong giấy phép như General Public Licence (GPL) mà không cần xin phép.

Open Source mang lại nhiều tiện ích quan trọng, bao gồm quyền tự do sử dụng phần mềm cho mọi mục đích, quyền nghiên cứu và chỉnh sửa mã nguồn theo nhu cầu cá nhân Người dùng có thể truy cập mã nguồn, phân phối lại các phiên bản cho cộng đồng, cũng như cải tiến chương trình và phát hành những bản cải tiến nhằm phục vụ lợi ích chung.

Lợi ích của phần mềm mã nguồn mở

- Phần mềm có thể được sao chép hoàn toàn miễn phí, bạn hoàn toàn an tâm khi chia sẻ một chương trình tuyệt vời với bạn bè.

Các định dạng file thường bị kiểm soát bởi một số nhà cung cấp, điều này gây khó khăn khi dữ liệu nằm trong phần mềm độc quyền Việc sử dụng định dạng file bí mật buộc bạn phải phụ thuộc vào một chương trình duy nhất, và nếu bạn muốn chuyển đổi dữ liệu sang ứng dụng khác, phần mềm bản quyền có thể không cho phép Hơn nữa, nếu nhà cung cấp ngừng hỗ trợ hoặc nâng cấp sản phẩm, dữ liệu của bạn có thể sẽ bị lãng quên Ngược lại, với phần mềm mã nguồn mở, bạn có nhiều lựa chọn nhà cung cấp, giúp bạn linh hoạt hơn trong việc quản lý dữ liệu.

Hầu hết các sản phẩm mã nguồn mở đều có khả năng bảo mật xuất sắc Khi phát hiện một lỗ hổng, việc khắc phục thường diễn ra nhanh chóng hơn so với phần mềm có bản quyền.

Các hệ thống Open Source, đặc biệt là những hệ thống dựa trên UNIX, nổi bật với tính linh hoạt đáng kinh ngạc Chúng được xây dựng từ các khối thống nhất và được mô tả chi tiết, giúp bạn dễ dàng thay thế nhiều thành phần của hệ thống bằng các phần có giao diện tương tự.

- Có một cộng đồng hỗ trợ lớn, không bị phụ thuộc vào một công ty nào.

WORDPRESS

Tìm hiểu về phần mềm mã nguồn mở Wordpress

WordPress là phần mềm mã nguồn mở được phát triển bằng ngôn ngữ PHP và sử dụng cơ sở dữ liệu MySQL Ra mắt vào ngày 27/05/2003 bởi Matt Mullenweg và Mike Little, WordPress hiện nay thuộc sở hữu của công ty Automattic, có trụ sở tại San Francisco, California, Hoa Kỳ.

WordPress là một mã nguồn mở bằng ngôn ngữ PHP, nổi bật với tính dễ sử dụng và nhiều tính năng hữu ích, giúp người dùng dễ dàng tạo blog cá nhân Số lượng người dùng WordPress ngày càng tăng, cùng với sự tham gia đông đảo của các lập trình viên để phát triển mã nguồn Được xem là một hệ quản trị nội dung (CMS) vượt trội, WordPress hỗ trợ tạo ra nhiều loại website khác nhau, từ blog, website tin tức, giới thiệu doanh nghiệp, đến thương mại điện tử và các website phức tạp như đặt phòng khách sạn hay đăng dự án bất động sản Hầu hết các hình thức website quy mô nhỏ và vừa đều có thể triển khai trên nền tảng WordPress.

* Những lý do mà bạn nên chọn WordPress:

WordPress là nền tảng dễ sử dụng, được thiết kế cho người dùng phổ thông không có nhiều kiến thức lập trình Giao diện quản trị trực quan và các thao tác đơn giản giúp người dùng nhanh chóng nắm bắt cách quản lý website Việc cài đặt WordPress cũng rất dễ dàng, cho phép bạn tự cài đặt và vận hành website trên máy chủ riêng chỉ với vài cú click.

Cộng đồng WordPress rộng lớn và hỗ trợ mạnh mẽ: Là một trong những mã nguồn CMS mở phổ biến nhất thế giới, WordPress mang đến cho người dùng sự hỗ trợ từ cộng đồng đông đảo Nếu bạn có khả năng tiếng Anh tốt, việc tìm kiếm giải pháp cho các vấn đề gặp phải sẽ trở nên dễ dàng qua các từ khóa trên Google.

WordPress cung cấp nhiều gói giao diện phong phú, thường được gọi là theme, giúp người dùng dễ dàng thay đổi giao diện website chỉ với vài cú click mà không cần thiết kế riêng Ngoài các theme miễn phí, bạn cũng có thể lựa chọn mua các theme trả phí để có một website đẹp và chuyên nghiệp hơn, với mức giá đa dạng.

Nhiều plugin hỗ trợ có sẵn giúp bạn dễ dàng thêm chức năng hiển thị bài viết liên quan dưới mỗi bài viết trên website Bạn có thể cài đặt những plugin miễn phí để cải thiện trải nghiệm người dùng Ngoài ra, còn có nhiều plugin trả phí với các tính năng độc đáo và hữu ích, giá dao động từ 10 đến 80 đô la tùy thuộc vào độ phức tạp của chúng.

WordPress là nền tảng dễ dàng cho lập trình viên, đặc biệt nếu bạn có kiến thức về HTML, CSS và PHP Với mã nguồn mở, bạn có thể dễ dàng mở rộng website của mình bằng nhiều tính năng hữu ích và hiểu rõ cách hoạt động của nó để phát triển thêm các chức năng mới.

WordPress cung cấp hàng nghìn hàm có sẵn, cho phép người dùng linh hoạt sử dụng và tùy chỉnh Bạn có thể thay đổi cấu trúc của một hàm thông qua filter hook, giúp quy trình làm việc của lập trình viên chuyên nghiệp được áp dụng một cách dễ dàng vào nền tảng này.

WordPress hỗ trợ đa ngôn ngữ với nhiều gói ngôn ngữ có sẵn, bao gồm cả tiếng Việt Mặc dù mỗi giao diện và plugin có ngôn ngữ riêng, bạn vẫn có thể tự dịch chúng bằng các phần mềm hỗ trợ.

WordPress không chỉ giới hạn ở việc tạo blog cá nhân; bạn có thể phát triển nhiều loại website khác như trang bán hàng, website giới thiệu công ty, hay tờ tạp chí online Để thực hiện điều này, bạn cần kết hợp các theme và plugin một cách hợp lý Tuy nhiên, trước khi bắt tay vào xây dựng, hãy đảm bảo bạn đã hiểu rõ về WordPress để tránh những thất vọng do độ phức tạp của nền tảng này.

Cài đặt Localhost trên máy tính để tìm hiểu WordPress

2.2.1 Cài đặt localhost trên máy tính với XAMPP

Localhost là sự kết hợp của hai từ "local" và "host" Trong lĩnh vực công nghệ thông tin, "local" ám chỉ đến máy tính cá nhân của bạn, trong khi "host" là máy chủ Do đó, localhost có nghĩa là một máy chủ hoạt động ngay trên máy tính của bạn.

Localhost là một môi trường tích hợp nhiều ứng dụng, cho phép bạn chạy mã nguồn WordPress trên máy tính của mình Tất cả các ứng dụng này kết hợp với nhau để tạo ra một hệ thống hoàn chỉnh, giúp việc phát triển và thử nghiệm WordPress trở nên dễ dàng hơn.

Apache là phần mềm webserver phổ biến nhất, thường được sử dụng để triển khai các trang web Để xử lý mã nguồn PHP, WordPress sử dụng phần mềm PHP, vì nó được phát triển bằng ngôn ngữ này Ngoài ra, MySQL Server là phần mềm lưu trữ và xử lý cơ sở dữ liệu, được WordPress sử dụng làm nền tảng cơ sở dữ liệu chính.

+ Phần mềm PHPMyAdmin để xem và quản lý cơ sở dữ liệu MySQL.

*Localhost vận hành như thế nào:

Sau khi cài đặt Localhost trên máy tính, bạn đã có một phần mềm Webserver cho phép chạy ứng dụng website tại địa chỉ http://127.0.0.1 hoặc http://localhost Để sử dụng Localhost, bạn cần mở bảng điều khiển và kích hoạt nó để khởi động các ứng dụng đi kèm.

- Lưu ý trước khi cài đặt:

Để thiết lập môi trường localhost một cách hiệu quả, trước tiên bạn cần xóa tất cả các ứng dụng liên quan như PHP và MySQL Ngoài ra, không nên cài đặt XAMPP trên Windows Server đã có IIS Hơn nữa, hãy tắt tường lửa trên máy tính của bạn, bao gồm cả tường lửa từ Windows và phần mềm Antivirus, vì chúng có thể chặn cổng 80 hoặc các ứng dụng webserver.

Để tránh các vấn đề giới hạn quyền khi sử dụng localhost trên máy tính Windows, bạn nên tắt chức năng User Account Control (UAC).

* Hướng dẫn cài đặt Localhost:

- Để cài đặt Localhost chúng ta có rất nhiều cách và phần mềm, ở đây chúng ta xử dụng XAMPP để cài đặt localhost vì:

+ XAMPP hoàn toàn miễn phí.

+ Hỗ trợ các hệ điều hành thông dụng như Windows, Mac, Linux.

Để tải XAMPP, bạn cần truy cập vào trang web https://www.apachefriends.org và chọn phiên bản XAMPP tương thích với hệ điều hành của máy tính Nên chọn phiên bản PHP 8.0.9 để đảm bảo hiệu suất tốt nhất Mặc dù XAMPP chỉ có phiên bản cho hệ điều hành 32bit, nhưng nó vẫn hoạt động tốt trên hệ điều hành 64bit.

Hình 2.1 Tải XAMPP từ trang https://www.apachefriends.org

- Sau khi tải file cài đặt về xong, hãy chạy nó, sau đó chọn Next.

Hình 2.2 Bắt đầu cài đặt XAMPP

Khi chọn đường dẫn lưu cài đặt XAMPP, hãy nhớ chọn đường dẫn mà bạn có thể dễ dàng truy cập sau này, vì khi cài đặt website lên localhost, bạn sẽ cần vào thư mục này Để thuận tiện, bạn nên giữ đường dẫn mặc định là c:\xampp Sau đó, tiếp tục bấm để hoàn tất quá trình cài đặt.

Hình 2.3 Chọn đường dẫn cài đặt XAMPP

- Ở trang kế tiếp bạn bỏ chọn phần “Lear more about Bitnami for XAMPP” và ấn “Next” 2 lần nữa để hoàn tất quá trình cài đặt.

Hình 2.4 Tìm hiểu thêm về Bitnami cho Xampp

Sau khi hoàn tất cài đặt XAMPP, bạn hãy nhấn nút “Finish” để kết thúc quá trình và mở bảng điều khiển Để đảm bảo localhost hoạt động ổn định, hãy khởi động lại máy tính sau khi cài đặt.

+ Bây giờ bạn hãy vào thư mục c:\xampp và mở file xampp-panel.exe lên để bật bảng điều khiển của XAMPP.

Hình 2.5 Bảng điều khiển của XAMPP

You may notice that the Apache and MySQL applications have a Start button, indicating that these applications are not yet running To enable localhost functionality, click the Start button for each application to launch the Apache web server and MySQL server.

- Nếu cả hai ứng dụng chuyển sang màu xanh như hình dưới là đã khởi động thành công.

Hình 2.6 Khởi động Apache và MySQL

Sau khi khởi động xong, bạn hãy truy cập vào địa chỉ website http://localhost:81/dashboard để xem trang giới thiệu XAMPP.

Hình 2.7 Cài đặt XAMPP thành công 2.2.2 Các bước cài đặt WordPress trên Localhost

* Bước 1: Tải mã nguồn website WordPress.org

Trước tiên bạn hãy tải phiên bản mới nhất của mã nguồn WordPress tại địa chỉ: http://wordpress.org/latest.zip.

Sau khi giải nén, bạn sẽ nhận được một thư mục có tên "wordpress" Thư mục này có thể nằm trong một thư mục khác mang tên "wordpress-x" (trong đó x là số hiệu phiên bản), nhưng bạn chỉ cần truy cập vào thư mục "wordpress" như hình dưới đây.

Hình 2.8 File Wordpress tải về và giải nén

Next, navigate to the WordPress directory where you will find several folders named wp-admin, wp-includes, wp-content, along with files such as index.php and wp-config-sample.php Collectively, these files and folders are referred to as the WordPress source code.

*Bước 2: Copy mã nguồn WordPress vào Localhost.

Hãy sao chép toàn bộ file và thư mục từ nguồn vào thư mục website của bạn trên localhost, chẳng hạn như C:\xampp\htdocs\khanhtn Điều này có nghĩa là bạn chỉ cần sao chép các file và thư mục mã nguồn vào thư mục ngockhanh.

Hình 2.10 Copy mã nguồn WordPress vào Localhost (XAMPP)

Để cài đặt WordPress, bước đầu tiên là tạo một cơ sở dữ liệu mới trên localhost Cơ sở dữ liệu này sử dụng MySQL để lưu trữ các dữ liệu quan trọng như bài viết và các thiết lập của website.

* Bước 4: Chạy website để cài đặt:

Chuyển trang web từ Localhost lên Hosting

2.3.1 Thông tin tên miền (Domain)

Hình 2.18 Thông tin tên miền 2.3.2 Thông tin hosting

2.3.3 Deploy trang web Đầu tiên, ta cần nén file tiendung trong C:\xampp\htdocs thành file có đuôi.zip

Tiếp theo, ta Export cơ sử dữ liệu từ trang: http://localhost:81/phpmyadmin/index.php? route=/database/structure&server=1&db=wordpress

Hình 2.21 Export cơ sở dữ liệu ở localhost

After exporting the database, we will access the page at https://host212.vietnix.vn:2083/cpsess9372961143/frontend/paper_lantern/sql/index.html to start creating a database and adding a new user.

Hình 2.22 Tạo Database trên Cpanel

Hình 2.23 Thêm User mới trên Cpanel

Và sau đó, thực hiện bước upload file Wordpress lên File Manager trên Cpanel

Hình 2.24 Upload file Wordpress Ở bước tiếp theo, ta thực hiện Import cho Database vừa tạo ở hình 2.22.

Để website có thể nhận được cơ sở dữ liệu khi triển khai, cần thực hiện bước "Thêm người dùng vào cơ sở dữ liệu" trong MySQL Databases.

Hình 2.27 Cấu hình lại wp-config.php

Cuối cùng, bạn cần thay đổi hai giá trị của cột option_value từ địa chỉ localhost:81/khanhtn sang tên miền đã đăng ký là khanhtrang.online trong bảng wp_options của cơ sở dữ liệu đã tạo trước đó.

Hình 2.28 Thay đổi tên miền

KẾ GIAO DIỆN V KIỂM THỬ

Giao diện người dùng

Mô tả: là trang chính, chứa tất cả các mục để khách hàng thoải mái lựa chọn.

Trang chủ mang đến thông tin chi tiết về các loại sản phẩm với giao diện thân thiện và dễ sử dụng, giúp khách hàng dễ dàng tìm kiếm và đặt mua những sản phẩm yêu thích, phù hợp với ngân sách của mình.

Bạn có thể dễ dàng giao tiếp và gửi ý kiến trực tiếp đến cửa hàng Trang web luôn cập nhật và thông báo về các sản phẩm khuyến mãi, sản phẩm mới và những mặt hàng HOT nhất.

Menu chính của website bao gồm năm mục chính: Trang chủ, Danh mục sản phẩm, In tên lên sản phẩm theo yêu cầu, Sale và Liên hệ.

Danh mục sản phẩm của shop bao gồm: thiệp hộp diêm, lót ly đĩa than, móc khóa, leather charm, bao da airpod case, board games và card games Chúng tôi cam kết cung cấp thông tin rõ ràng về các sản phẩm hiện có để khách hàng dễ dàng nắm bắt và lựa chọn.

Hình 3.3 Trang đăng nhập3.1.4 Trang liên hệ

Mô tả: liên hệ với quản trị viên

Nhiệm vụ: giúp khách hàng liên hệ lại với trang quản trị để giải đáp thắc mắc 3.1.6 Trang chi tiết sản phẩm

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

Mô tả: Hiển thị chi tiết thông tin sản phẩm đang xem

Nhiệm vụ: Giúp cho khách hàng nắm rõ được thông tin chi tiết sản phẩm đang xem

Mô tả: liệt kê các sản phẩm được thêm vào giỏ

Nhiệm vụ: liệt kê các sản phẩm mà khách hàng đã lựa chọn

Hướng dẫn các bước thực hiện thanh toán trong trang thanh toán

Bước 1:Điền thông tin trước khi thanh toán, nhập mã ưu đãi nếu có

Bước 2: Chọn hình thức thanh toán

Trang quản trị hệ thống

Hình 3.11 Trang quản trị hệ thống

Mô tả: người quản trị sử dụng tài khoản để đăng nhập vào hệ thống

Nhiệm vụ: giúp người quản trị có thể bắt đầu với hệ thống

Thông tin phần mềm

3.3.1 Giao diện sử dụng (Theme)

Hình 3.13 Giao diện sử dụng (Theme)

Giao diện Flatsome: cung cấp đầy đủ tính năng thiết kế một website bán hàng hoàn chỉnh.

3.3.2 Các plugin đang sử dụng (10 plugin)

Hình 3.14 Các plugin đang sử dụng (10 plugin)

Plugin WooCommerce cung cấp các tính năng cần thiết cho thương mại điện tử, bao gồm chi tiết sản phẩm, giỏ hàng và thanh toán, cùng với nhiều chức năng bổ sung hỗ trợ cho việc bán hàng hiệu quả.

Ngoài ra Website còn sử dụng các plugin khác liên quan đến WooCommerce nhằm tạo ra một trang web bán hàng hoàn chỉnh nhất.

Ngày đăng: 26/04/2022, 15:02

HÌNH ẢNH LIÊN QUAN

 Piture : (hình do cài dặt vào , hoặc truy cập ,hình ảnh động …….. ). - Xây dựng website bán đồ handmade
iture (hình do cài dặt vào , hoặc truy cập ,hình ảnh động …….. ) (Trang 3)
sẽ cần mở bảng điều khiển của localhost lên và kích hoạt nó khỏi động các ứng dụng đi kèm. - Xây dựng website bán đồ handmade
s ẽ cần mở bảng điều khiển của localhost lên và kích hoạt nó khỏi động các ứng dụng đi kèm (Trang 10)
Hình 2.2.Bắt đầu cài đặt XAMPP - Xây dựng website bán đồ handmade
Hình 2.2. Bắt đầu cài đặt XAMPP (Trang 11)
Hình 2.3.Chọn đường dẫn cài đặt XAMPP - Xây dựng website bán đồ handmade
Hình 2.3. Chọn đường dẫn cài đặt XAMPP (Trang 12)
- Nếu cả hai ứng dụng chuyển sang màu xanh như hình dưới là đã khởi động thành công. - Xây dựng website bán đồ handmade
u cả hai ứng dụng chuyển sang màu xanh như hình dưới là đã khởi động thành công (Trang 13)
Hình 2.5.Bảng điều khiển của XAMPP - Xây dựng website bán đồ handmade
Hình 2.5. Bảng điều khiển của XAMPP (Trang 13)
Hình 2.7.Cài đặt XAMPP thành công 2.2.2. Các bước cài đặt WordPress trên Localhost * Bước 1: Tải mã nguồn website WordPress.org - Xây dựng website bán đồ handmade
Hình 2.7. Cài đặt XAMPP thành công 2.2.2. Các bước cài đặt WordPress trên Localhost * Bước 1: Tải mã nguồn website WordPress.org (Trang 14)
Hình 2.9.File Wordpress - Xây dựng website bán đồ handmade
Hình 2.9. File Wordpress (Trang 15)
Hình 2.10.Copy mã nguồn WordPress vào Localhost(XAMPP) - Xây dựng website bán đồ handmade
Hình 2.10. Copy mã nguồn WordPress vào Localhost(XAMPP) (Trang 16)
Hình 2.11.Chọn ngôn ngữ khi cài đặt WordPress. - Xây dựng website bán đồ handmade
Hình 2.11. Chọn ngôn ngữ khi cài đặt WordPress (Trang 17)
Hình 2.12. Nhắc nhở trước khi cài đặt - Xây dựng website bán đồ handmade
Hình 2.12. Nhắc nhở trước khi cài đặt (Trang 18)
Hình 2.15.Thiết lập các thông tin quan trọng cho website - Xây dựng website bán đồ handmade
Hình 2.15. Thiết lập các thông tin quan trọng cho website (Trang 19)
Hình 2.17.Trang quản trị WordPress (Localhost) 2.3. Chuyển trang web từ Localhost lên Hosting - Xây dựng website bán đồ handmade
Hình 2.17. Trang quản trị WordPress (Localhost) 2.3. Chuyển trang web từ Localhost lên Hosting (Trang 20)
Hình 2.20.Nén file wordpress - Xây dựng website bán đồ handmade
Hình 2.20. Nén file wordpress (Trang 21)
Hình 2.22.Tạo Database trên Cpanel - Xây dựng website bán đồ handmade
Hình 2.22. Tạo Database trên Cpanel (Trang 22)

TỪ KHÓA LIÊN QUAN

w