Giới thiệu
Hugo là một trình tạo trang tĩnh với tốc độ kết xuất nhanh như chớp và dễ sử dụng. Nhờ tất cả các tính năng hướng nội dung của nó, bạn luôn có thể tập trung vào việc tạo nội dung thay vì xây dựng môi trường:
- Với Hugo, bạn có thể xây dựng một trang web tĩnh chạy mọi nơi trong vài phút mà không liên quan đến các phụ thuộc hoặc cơ sở dữ liệu tẻ nhạt.
- Bạn có thể soạn nội dung của mình theo Markdown, kiểu viết thuận tiện nhất và ngay lập tức thấy những thay đổi bạn đã thực hiện trên web.
- Hơn nữa, bạn có thể tận dụng tối đa kho lưu trữ chủ đề giàu có của Hugo và cộng đồng phát triển nhanh chóng.
Trong hướng dẫn này, tôi sẽ chỉ cho bạn cách cài đặt và sử dụng Hugo để xây dựng một trang blog tĩnh trên phiên bản máy chủ Vultr LEMP dựa trên CentOS.
Điều kiện tiên quyết
Đăng nhập vào ví dụ của bạn với tư cách là người dùng không root với quyền sudo. Xem cách tạo một người dùng như vậy trong bài viết này .
Bước 1: Cài đặt chương trình Hugo
Hugo có thể được cài đặt trên hầu hết các nền tảng chính. Đối với CentOS, bạn chỉ cần tải xuống tệp chương trình mới nhất trong .tar.gz
kho lưu trữ và giải nén nó đến một vị trí thuận tiện. Tại thời điểm viết, phiên bản mới nhất là 0,15.
sudo yum update -y
sudo yum install git -y
cd ~
wget https://github.com/spf13/hugo/releases/download/v0.15/hugo_0.15_linux_amd64.tar.gz
tar -zxvf hugo_0.15_linux_amd64.tar.gz
sudo mv hugo_0.15_linux_amd64/hugo_0.15_linux_amd64 /usr/local/bin/hugo
Kiểm tra cài đặt của bạn bằng lệnh sau:
hugo version
Bước 2: Xây dựng trang web của bạn
Với Hugo, bạn có thể xây dựng trang web của mình từ trong bất kỳ thư mục nào trên máy chủ của bạn. Ở đây, tôi đã xây dựng một trang web trong thư mysite/
mục dưới thư mục nhà của tôi.
cd ~
hugo new site ~/mysite
Chạy các lệnh sau để xem kiến trúc của trang web:
cd mysite
ls -lF
Như bạn thấy, kiến trúc hiện tại của trang web giống như:
nguyên mẫu /
cấu hình
Nội dung/
dữ liệu/
bố trí /
tĩnh /
Với hai thư mục được tạo khác, themes/
và public/
, toàn bộ kiến trúc của một trang Hugo là nhỏ gọn nhưng toàn diện.
Là một người bắt đầu, biết rằng nội dung của bạn nên được lưu trữ trong thư mục content/
.
Bước 3: Cài đặt các chủ đề từ kho lưu trữ Hugo
Để cài đặt tất cả các chủ đề từ kho lưu trữ Hugo, hãy chạy các lệnh sau. Chúng sẽ tạo một thư mục có tên themes/
trong thư mục trang web của bạn và tải xuống tất cả các chủ đề từ repo chủ đề Hugo.
cd ~/mysite/
git clone --depth 1 --recursive https://github.com/spf13/hugoThemes.git themes
Nếu bạn chỉ muốn cài đặt một chủ đề duy nhất, hãy truy cập repo chủ đề Hugo để xác định chủ đề yêu thích của bạn. Sao chép URL của nó và dán nó vào git clone
lệnh bên dưới.
cd ~/mysite/
mkdir themes
cd themes
git clone https://github.com/jaden/twentyfourteen
Bước 4: Thực hiện một số thay đổi cấu hình cơ bản
Tệp có tên config.toml
trong thư mục trang web của bạn chứa cấu hình toàn cầu cho trang Hugo của bạn. Chỉnh sửa tệp bằng trình soạn thảo văn bản để thực hiện một số thay đổi cấu hình cơ bản như được liệt kê bên dưới. Hãy nhớ thay thế các giá trị theo các điều kiện cụ thể của bạn.
baseurl = "http://[YourSiteIP]/"
languageCode = "en-us"
title = "Your Site Name"
theme = "twentyfourteen"
Bước 5: Soạn nội dung của bạn
Trong thư mục trang web của bạn, nhập lệnh sau để tạo trang nội dung trong thư mục ~/mysite/content/post/
.
cd ~/mysite/
hugo new post/about.md
Mở tệp trong trình soạn thảo văn bản, định dạng của tệp sẽ giống như sau.
+++
date = "2015-12-25T03:21:23Z"
draft = true
title = "about"
+++
Giữa hai dòng +++
nói dối thông tin meta về trang nội dung của bạn. Tại đây, bạn có thể xóa dòng draft = true
và sửa đổi dòng tiêu đề theo ý muốn.
Trong +++
dòng thứ hai , thêm nội dung mà bạn muốn hiển thị trên trang web. Hãy nhớ viết nội dung của bạn bằng ngôn ngữ Markdown.
## This is an H2 headline
Text goes here.
Sau khi hoàn thành chỉnh sửa này, hãy giữ trình soạn thảo văn bản mở để sử dụng sau.
Bước 6: Điều chỉnh nội dung của bạn với máy chủ Hugo
Bạn có thể sử dụng máy chủ web tích hợp của Hugo để triển khai trang web của mình, ứng dụng này có thể hiển thị tức thời các thay đổi của bạn trên trang web ngay khi bạn sửa đổi nội dung của mình trong trình soạn thảo văn bản.
Mở một thiết bị đầu cuối khác, định cấu hình các iptables
quy tắc để cho phép bạn truy cập vào trang web của mình trên cổng mặc định của máy chủ Hugo 1313:
sudo iptables -I INPUT -p tcp --dport 1313 -j ACCEPT
Khởi chạy máy chủ Hugo:
hugo server --bind="[YourServerIP]"
Truy cập trang web của bạn từ một trình duyệt:
http://[YourServerIP]:1313
Bây giờ, bạn có thể thử chỉnh sửa nội dung của tệp trang trong thiết bị đầu cuối trước đó hoặc thêm / xóa tệp trang. Bạn sẽ thấy rằng mọi sửa đổi trong content/
thư mục sẽ được phản ánh đồng thời trên màn hình trình duyệt của bạn. Đây là một tính năng tuyệt vời cho một blogger bận rộn vì bạn luôn có thể thấy ngay các sửa đổi của mình để có trải nghiệm sáng tác tốt hơn.
Sau khi bạn hoàn thành chỉnh sửa của mình, nhấn Ctrl+C
để dừng máy chủ Hugo.
Bước 7: Xuất bản trang web của bạn
Bây giờ là lúc để xuất bản trang web của bạn trên web. Chạy các lệnh sau và Hugo sẽ tạo ra tất cả nội dung tĩnh phù hợp để xuất bản trong public/
thư mục.
cd ~/mysite
hugo
Lưu ý : Hugo sẽ không xóa các tệp cũ đã được tạo trước đó khi bạn chạy các lệnh trên. Để tránh kết quả không mong muốn, bạn luôn có thể xóa public/
thư mục trước khi chạy hugo
lệnh hoặc chỉ định đích đầu ra mới như trong lệnh sau.
hugo --destination=public2
Vì máy chủ web Nginx đã chạy trên máy chủ, tất cả những gì bạn cần làm là sao chép nội dung của ~/mysite/public/
thư mục hoặc các thư mục đích tùy chỉnh khác vào thư mục web của bạn /usr/share/nginx/html/
.
Xóa các tập tin gốc:
cd /usr/share/nginx/html/
sudo rm -rf background.jpg index.php logo.png
Sao chép các tập tin trang web tĩnh của bạn vào thư mục web:
cd ~/mysite/public
sudo cp -R ~/mysite/public/. /usr/share/nginx/html/
Đó là nó. Bây giờ bạn có thể truy cập trang web tĩnh siêu nhanh từ trình duyệt của mình : http://[YourServerIP]
.
Để xem thêm chi tiết, sử dụng lệnh hugo help
hoặc truy cập trang web chính thức của Hugo .