Trong bài này, mình sẽ hướng dẫn bạn cách đưa một trang web đơn giản lên host miễn phí. Ở đây, mình dùng một host được cung cấp bởi: https://www.000webhost.com/. Host này cung cấp các tính năng cơ bản. Nào, hãy cùng bắt đầu.
Đang xem: Tải tệp html lên wordpress
Bạn đang xem: Cách upload file
Bạn đang xem: đưa file html lên web
Kiến thức liên quan
Để hoàn thành được bài hướng dẫn này, bạn cần có những kiến thức sau:
Hiểu về hoạt động của một trang web đơn giản gồm các file html, css, javascript
Chuẩn bị
Để đưa web của bạn lên internet, trước tiên, bạn cần chuẩn bị toàn bộ các file html, css, js ở máy cá nhân. Để giảm thiểu những rủi ro gây ra lỗi khi chạy trên internet, bạn nên kiểm tra kĩ web của mình ở máy tính cá nhân trước nhé.
Thêm một chú ý nhỏ, trong các file html của bạn, bạn chọn ra một file làm trang chủ, và đặt tên nó là index.html.
Đây là project của mình đã chuẩn bị trên máy:
Đăng kí tài khoản
Bước 1: Bạn truy cập đường dẫn sau: https://www.000webhost.com/
Bước 2: Đăng kí tài khoản (nếu đã có tài khoản, bạn có thể bỏ qua mục này).
Bạn click vào nút FREE SIGN UP để đăng kí tài khoản. 000webhost cho phép dùng email để đăng kí, hoặc sử dụng các tài khoản mạng xã hội.
Sau khi đăng kí, bạn sẽ nhận được email thông báo về tài khoản đã tạo.
Bước 3: Đăng nhập tài khoản, bạn sẽ được dẫn đến trang quản lí https://www.000webhost.com/members/website/list
Tạo web site
Bước 4: Để tạo web site, bạn click vào nút: Create new Site
Bạn điền đường dẫn cho web site. Bạn có thể sử dụng mật khẩu do hệ thống tự sinh ra hoặc đặt mật khẩu riêng cho dễ nhớ. Bạn sẽ cần dùng mật khẩu này cho những lần đăng nhập sau để quản lí site của bạn.
Bước 5: Quản lí site, bạn trở lại trang quản lí: https://www.000webhost.com/members/website/list
Ở đây, sẽ liệt kê các site mà bạn đã tạo ra. Với tài khoản miễn phí, bạn tạo được tối đa 2 site.
Bạn chọn site cần quản lí và click vào Manage Website ở giữa hình
Bước 6: Tiến hành tải các file lên host
Cần chú ý là: project có cấu trúc thư mục như thế nào, thì bạn giữ nguyên cấu trúc đó khi đưa lên public_html
Bước 7: Kiểm tra lại web đã hoạt động
OK, nếu web của bạn đã hiển thị, chúc mừng bạn đã đưa thành công web lên internet.
Bạn có thể khoe nó với bạn bè !!!
Một số lỗi thường gặp:
1. Khi bạn vào web ở bước 7 thì không thấy web hiện lên, bạn nhận được thông báo “404 Page Not Found”
Nguyên nhân: bạn không có file index.html trong thư mục public_html. Để web hoạt động được, web cần 1 file được gọi là default document (trang mặc định). Trong trường hợp bạn vào web mà không chỉ định rõ bạn muốn truy cập vào file html nào, thì file mặc định sẽ được gọi đến. Cụ thể ở đây, web sẽ sử dụng file có tên là index.html
Cách sửa: bạn chọn file làm trang chủ cho web, và đổi tên nó thành index.html. Nhớ là đổi tên file ở folder public_html nhé. Sau khi đổi xong, bạn hãy thử lại web
2. Một số ảnh không được tải lên đúng như mong muốn
Nguyên nhân 1: khi upload lên folder public_html, bạn đã không giữ đúng cấu trúc thư mục như đang để ở máy cá nhân
Cách sửa 1: hãy kiểm tra lại cấu trúc thư mục ở folder public_html và chắc chắn là nó giống cấu trúc ở máy bạn
Nguyên nhân 2: bạn đang để đường dẫn tuyệt đối. Ví dụ: bạn sử dụng 1 ảnh nào đó trong máy và để đường dẫn tuyệt đối C://Project1/images/flower.jpg. Đường dẫn này sẽ không còn đúng khi bạn chuyển project lên folder public_html.
Cách sửa 2: bạn cần chuyển sang sử dụng đường dẫn tương đối
Để tìm hiểu thêm về cách đặt đường dẫn cho file trong html, các bạn có thể tham khảo ở w3school HTML File Paths
3. Css hoặc javascript không hoạt động.
Xem thêm: Bệnh Phụ Khoa Nữ Triệu Chứng, Dấu Hiệu Nhận Biết Các Bệnh Phụ Khoa
Cả hai trường hợp này tương tự như trường hợp ảnh bị sai ở trên. Bạn kiểm tra lại đường dẫn cho chính xác.