本篇是我實際架設一個正式的 WordPress 網站的過程記錄,內容包含許多關鍵的技術與設定檔。

最近打算成立一個新網站,專門用來分享素食食譜,我順便把整個網站架設過程都寫在這裡,讓大家可以參考,不過這篇是個人筆記性質,只記錄關鍵性的部分,如果想要照著做的話,需要一點技術基礎,不是只用複製貼上就可以完成的。


這個新網站我是在 Linode 的 VPS 環境中架設的,在既有的伺服器中架設一個全新的網站,而原本的 CentOS Linux 系統上已經有 Nginx 伺服器、PHP 7、MariaDB 的基礎環境,以及多種系統調校:

以上只列出比較重要的部分,其他更詳細的資料可參考 Nginx 相關文章

如果想從無到有打造這樣的環境,對於沒有 Linux 基礎的人來說門檻相當高,建議改用類似 Bluehost 這類的主機商所提供的 WordPress 架站環境,簡單、快速又不需要懂太多技術。

購買網址

在架設一個正式的網站時,第一步就是要決定網址,網址可以從各大網域服務商(例如 Google DomainGoDaddy)的網站上搜尋並挑選,選擇好之後以信用卡付款,馬上就可以把網址買下來。

買下來之後,根據 Linode VPS 的 public IP 位址,分別設定 IPv4 與 IPv6 的 DNS 記錄(A 與 AAAA),網路上有很多免費的 DNS 託管服務可用,Google 本身也有提供,選哪一家都可以,影響不大,我習慣是使用 Cloudflare。

DNS 設定更新之後,需要等幾個小時到一天左右的時間,讓新設定生效。

設定 Nginx 與 HTTPS/SSL

先建立一個放置網頁資料的目錄:

mkdir -p /srv/MY.DOMAIN

其中 MY.DOAMIN 就是自己買的網址,例如 blog.gtwang.org

先建立一個簡單的 Nginx 設定檔,用來安裝 certbot 的憑證:

server {
    listen 80;
    listen [::]:80;
    server_name  MY.DOAMIN;

    root   /srv/MY.DOAMIN;
    index index.html index.htm;
}

測試並重新啟動 Nginx:

# 測試 Nginx 設定檔
nginx -t

# 重新啟動 Nginx 伺服器
systemctl restart nginx

參考以前的 certbot 教學,下載並安裝憑證:

certbot certonly --webroot -w /srv/MY.DOAMIN/ -d MY.DOAMIN

憑證安裝好之後,就可以修改 Nginx 的設定檔,將 HTTP 導向至 HTTPS,並增加各種的最佳化設定。

新增 MariaDB 資料庫與帳號

參考 MySQL/MariaDB 新增資料庫與帳號的教學,建立一個新網站專用的資料庫與使用者。

# 進入 MySQL/MariaDB 環境
mysql -u root -p

新增 MariaDB 資料庫與帳號:

# 新增資料庫
CREATE DATABASE `my_db`;

# 新增使用者,設定密碼
CREATE USER 'my_user'@'localhost' IDENTIFIED BY 'my_password';

# 設定使用者權限
GRANT ALL PRIVILEGES ON my_db.* TO 'my_user'@'localhost';

安裝 WordPress

下載並解壓縮 WordPress:

wget https://tw.wordpress.org/wordpress-5.2.3-zh_TW.tar.gz
tar zxf wordpress-5.2.3-zh_TW.tar.gz
sudo mv wordpress/* /srv/MY.DOMAIN/
rmdir wordpress

/srv/MY.DOMAIN 目錄的擁有者變更為 nginx

sudo chown -R nginx:nginx /srv/MY.DOMAIN/

接著就只要打開瀏覽器,連上 MY.DOAMIN 這個新網址,依照網頁上顯示的步驟即可進行 WordPress 的安裝了。

WordPress 安裝畫面

WordPress 安裝畫面

WordPress 外掛

WordPress 有非常大量的外掛可以使用,以下是我個人的常用清單:

  • Accelerated Mobile Pages
  • Ads.txt Manager
  • Comet Cache
  • Compress JPEG & PNG images
  • Disable Search
  • Easy Affiliate Links
  • HTML Editor Syntax Highlighter
  • Redirection
  • TinyMCE Advanced
  • Un-double the dash
  • Widget Logic
  • WP Cerber Security, Antispam & Malware Scan
  • WP Retina 2x
  • WPS Hide Login
  • Yoast SEO
  • 傳統編輯器
  • 強制重新產生縮圖

如果使用 Genesis 佈景主題,可以考慮:

  • Genesis Grid