Bài 02 – Hướng dẫn cách tạo tên miền ảo (domain) trên localhost bằng XAMPP

1. Tên miền ảo trên localhost là gì?

Để Website hoạt động trên môi trường internet bạn cần phải đăng ký tên miền và trỏ địa chỉ IP (Hosting) để chúng hoạt động khi kết nối mạng.

Trên thực tế khi bạn mới bắt đầu học WordPress cơ bản bạn chưa có đủ chi phí cho việc mua domain và hosting. Nhưng bạn cũng đừng quá lo lắng bởi XAMPP có thể giúp bạn có được một tên miền ảo y như thật. Chú ý rằng domain ảo chỉ chạy khi bạn khởi động phần mềm này. Và dĩ nhiên đây là một nhược điểm đúng không?

Vậy chúng ta cấu hình như thế nào? Bạn hãy xem bước dưới đây sẽ rõ nhé.

2. Cách cấu hình tên miền ảo bằng XAMPP

2.1 Chỉnh sửa file Hosts

Ví dụ cấu hình tên miền thiết kế web trọn gói: thietkewebtrongoi.com để tránh trường hợp tên miền đã tồn tại thực tế, chúng ta thêm sub domain như thế này wp.thietkewebtrongoi.com để chắc chắn không trùng lặp.

Tiếp theo bạn hãy tìm file hosts theo đường dẫn sau: C:\Windows\System32\drivers\etc\hosts. Mở với quyền administrator nhé.

Chú ý: Không phải file Hosts nào cũng giống nhau. Nếu nội dung file của bạn không như trong bài viết này, bạn cũng hết sức bình tĩnh nhé.

Bạn hãy mở bằng Notepad hay bất kì tool lập trình nào như Sublime text, Visual Studio Code, NetBeans….

127.10.1.1 wp.thietkewebtrongoi.com dán dòng này vào file hosts của bạn.

Chú ý dãy IP 127.10.1.1, mỗi 1 tên miền ảo bạn hãy tăng lên 1 cho đến 255 nhé, không được vượt qua số 255.

127.10.1.2 wp.website366.com
127.10.1.3 wp.tbay.vn
.......
127.10.1.255 wp.wpshare247.com

2.2 Chỉnh sửa file httpd-vhosts.conf

Tiếp theo bạn vào đường dẫn C:\xampp\apache\conf\extra nơi chứa thư mục httpd-vhosts.conf. Hãy mở file này lên bằng các công cụ mở file.

Sau khi mở file httpd-vhosts.conf bạn sao chép đoạn code sau vào cuối cùng của file và lưu lại. Nhưng hãy chú ý một vài điểm sau:

################################################################################################################
# wp.thietkewebtrongoi.com
################################################################################################################
<VirtualHost 127.10.1.1>
    DocumentRoot "D:\Projects\thietkewebtrongoi\code"
    ServerName wp.thietkewebtrongoi.com
    ServerAlias wp.thietkewebtrongoi.com
    <Directory "D:\Projects\thietkewebtrongoi\code">
        AllowOverride All
        Require all granted
    </Directory>
</VirtualHost>

Giải thích:

• Các dấu ### là chú thích, không ảnh hưởng gì đến cấu hình domain ảo
• <VirtualHost 127.10.1.1> : 127.10.1.1 chính là IP mình đã cấu hình trong file hosts tại bước 2.1 127.10.1.1 wp.thietkewebtrongoi.com
• D:\Projects\thietkewebtrongoi\code : Đường dẫn chứa code của chúng ta, bạn có thể để bất cứ đâu miễn thư mục tồn tại.
• wp.thietkewebtrongoi.com chính là tên miền ảo tại bước 2.1

2.3 Khởi động lại XAMPP

Sau khi cấu hình xong bạn hãy restart lại Xampp một lần, bằng cách Stop và Start lại

2.4 Kiểm tra tên miền ảo

Để đảm bảo tên miền ảo hoạt động được, bạn tạo 1 file index.html với nội dung bất kì, ở đây tôi sẽ tạo nội dung html là

<h1>Xìn chào Học WordPress cơ bản, WPSHARE247.COM</h1>

Hãy lưu file này vào thư mục D:\Projects\thietkewebtrongoi\code\index.html

Giờ là lúc ta kiểm tra kết quả thôi. Hãy mở trình duyệt lên và gõ wp.thietkewebtrongoi.com

Nếu bạn thấy màn hình bên dưới hiện ra thì xin chúc mừng bạn đã cấu hình tên miền ảo thành công rồi đấy

3. Tại sao phải cấu hình Domain ảo

Cấu hình tên miền ảo giúp chúng ta có được tên miền đơn giản không bị dư thừa như kiểu chạy truyền thống của xampp là http://localhost/tenduan, thêm nữa khi cấu hình tên miền ảo bạn không bị sự cố khi code có thể nằm bất kì ổ cứng nào, không giống kiểu mặc định để trong C:\xampp\htdocs\duan nếu bạn lỡ cài XAMPP vào ổ C.

Xem video cách tạo tên miền ảo (domain) trên localhost bằng XAMPP

Như vậy bạn vừa học cách hướng dẫn tạo 1 domain ảo như thế nào rồi đúng không. Bây giờ bạn hãy áp dụng nó vào học WordPress ngay đi nào. Hi vọng bài viết giúp ích được cho bạn trong quá trình học thiết kế Web WordPress nhé.