對於創業或樂於分享的族群而言，如何提高品牌知名度呢？吸引更多的潛在客戶和粉絲，的確是很大的挑戰。而自架網站雖然可以大幅壓低資金成本且可以 100% 設計網頁排版，但是就要付出更多的時間在網站維護與網路防護。
為什麼選擇在 Windows 作業系統上架設專屬 WordPress 網站呢？因為對於微軟系統與 Windows 軟體的接受度較高，大部分都是使用圖形化介面(GUI)就可以完成操作了。這一點就大幅降低自架網站的門檻，不需要記憶眾多指令或接觸不熟悉的 Linux 系統或查詢如何編輯網站設定文件。
架設網站費用有哪些呢？
自架網站前，先思考網站設立目的是什麼。當決定網站類型 ( 電商網站、部落格、形象網站、活動網站…等等 )之後，才能更明確地進行網站整體的規劃與準備相關資料。
以 Patti的窩 為例子，並非以電商網站或活動網站為目的。所以，不會有備份網路用戶個資的需要。簡單講，在資料庫裡儲存的都是文章內容與圖片，畢竟自架網站的初衷就是以分享資訊為出發點。表 1就是架設網站成本的明細：
| 項目 | 費用 | 備註 |
|---|---|---|
| 電腦主機 | 少於 2 萬 | 硬體: 一次性費用 系統: Windows 10 |
| 寬頻網路 | 1,299/月 | 中華電信光世代 500M/250M |
| 防火牆 | 1) 5,000/次 2) 免費 | 1) 入門款： DrayTek 2) 進階款： 軟路由 |
| 電費 | 100/月 | 電腦主機 24 運作 |
| XAMPP | 免費 | 架站安裝包 |
| WordPress | 免費 | CMS (內容管理系統) |
| 1) 免費: No-IP 2) 付費: GoDaddy | 1) 免費 2) 600/年 | 1) 30 天驗證一次 2) 每年續約 |
| Let’s Encrypt SSL | 免費 | 90 天更新一次 |
| 1) 免費佈景主題 2) 付費佈景主題 | 1) 免費 2) 1,400/次 | 1) 2023 2) OceanWP (黑五折扣) |
| 外掛 | 免費 | SEO、分享、 備份、快取 |
| 客製化設定 | 免費 | CSS、廣告位置 Google Analytics、 Apache 效能設定、 網路安全設定 |
| 網頁圖片設計 | 免費 | Canva |
| 網頁圖片壓縮 | 免費 | Squoosh |
5 套免費網站架設軟體
使用過 XAMPP、Bitnami、WAMPServer、MAMP、Local 這 5 套 Windows 架站安裝軟體後，結論會建議大家優先考慮 XAMPP 這一款安裝軟體。
XAMPP
剛開始自架網站的時候是安裝 XAMPP ( 32bit )，但是都會遇過某一個外掛經常造成【 記憶體不足 】，試了好多方法都無法解決問題，所以才轉換成 XAMPP ( 64bit ) 來試試看，結果就不曾再發生【記憶體不足】的現象了。
錯誤碼：
Fatal error: Out of memory ( allocated 13107200 ) ( tried to allocate 458752 bytes ) in C:\ xampp \ htdocs \ tomchun \ wp-content \ pluginsa3-lazy-loadadminadmin-interface.php on line 2878
官網：https://www.apachefriends.org/zh_tw/index.html
缺點：XAMPP ( 32bit ) 會造成網站不穩定
優點：
1). 安裝方便
2). 網路中、英文資料很多
3). 軟體開發商幾乎每個月都會提供新版本安裝包
備註：安裝 XAMPP 似乎是不會遇到問題才對，記得將 Windows 防火牆【允許】Apache 與 mySQL 程式的網路存取權限。
MAPM
MAMP 是以 MacOS、Apache、MySQL 及 PHP or Python 的字首結合的開發工具，但也有支援 Windows 系統。版本分成免費版與付費版兩種，很多人都選擇 MAMP 免費版來使用。
曾經試著想改用這一套 MAMP 安裝包，看上它可以切換成 Nginx 網頁伺服器的功能。但是，後來爬文發現， 在 Windows 平台，Nginx 和 Apache 沒有太大的差異，就打消念頭了。另一個原因就是論壇中討論的結果都是說 Apache 相對於 Ngnix 穩定，問題 (Bug) 也比較少。對於新手而言，穩定、不出錯的確比效能來的重要。
官網：https://www.mamp.info/en/windows/
缺點：遇到 MySQL Server 開不起來的問題，最後就放棄了。
Local
在本地電腦安裝 WordPress 後，方便編輯然後再上傳到租的虛擬主機中。但是，這套軟體好像不適合將本機電腦的網站推上線服務，所以也沒再繼續使用了。
官網：https://localwp.com/
缺點：找不到方法解決將網站上線。試了幾天後，就放棄了。
WAMPServer
WAMPServer 是一款由法國人開發的 Apache Web 伺服器、PHP 解釋器以及 MySQL 資料庫的整合軟體包。剛開始使用的時候，覺得好像很容易上手。久了之後，就會發現檔案路徑並不容易找到。
官網：https://www.wampserver.com/en/
缺點：1). 安裝包的更新似乎不如 XAMPP 頻繁。2). 檔案路徑並不容易找到。
Bitnami
Bitnami 在安裝過程當中，無法使用指定的 WordPress 資料表的前綴名稱。假使想要修改的話，需要具備專業知識來進行修改，這一點就不適合新手來操作了，動到資料庫可是很危險的事情，一個不小心可能會把網站整個毀掉。想要參考如何安裝 Bitnami 的話，可以參考: 在 Windows10 安裝 Bitnami WordPress
官網：https://bitnami.com/
缺點：安全性考量，無法更改 WordPress 資料表的前綴名稱
選用 WordPress 架站的理由
挑選 Ｗordpress 來建置自己的形象網站，最棒的地方在於有很多免費的佈景主題、外掛程式可以使用。而且使用 WordPress 架站的人也很多，所以當遇到問題時，幾乎可以在網路上找到答案，解決自架網站遇到的問題。
WordPress 程式下載：https://tw.wordpress.org/download/
佈景主題: 免費
外掛程式: 免費
問題諮詢: 免費 ( Google 大師 )
優點：
1). WordPress 架站有助於 Google 排名
2). WordPress 網路學習資源很多
3). WordPress 是一個開放資源
4). WordPress 架站，採用視覺化編輯方式
5). WordPress 可用來架設部落格網站、形象網站、企業官網、個人網站、電子商務網站
浮動 IP 可以透過 No-IP DDNS 免費架站
假使家中的寬頻網路屬於浮動 IP 的話，可以先到 No-IP 網站申請帳號，使用免費方案的 DDNS 服務，再下載 No-IP 專用的 DDNS 自動連線程式，也可以實現自架網站的目的。假使要長期經營網站的話，建議還是購買專屬的域名。
官網：https://www.noip.com/
服務：提供免費方案與付費方案
免費方案限制：
1). 一個帳戶只能註冊三個主機名稱。
2). 只能使用標準 DNS 服務，不能使用高級 DNS 服務。
3). 每 30 天需要確認一次帳戶，否則主機名稱將被刪除。
4). 每次動態 DNS 更新後，需要等待 30 分鐘才能再次更新。
DDNS 軟體名稱：Dynamic DNS Update Client (DUC) for Windows
DDNS 軟體下載網址：https://www.noip.com/download?page=win
備註：No-IP DDNS 免費方案申請，可以參考自架網站的流程章節中的【免費Let’s Encrypt SSL憑證】。
免費取得 Let’s Encrypt SSL 憑證
SSL 數位憑證就是當我們在上網時，瀏覽器網址列最前面出現的【綠色鎖頭】符號，這就是網路傳輸的安全協定。SSL 憑證除了可以保護網站資料不外洩，讓使用者更信任您的網站之外，還能讓網站優化提高 Google 搜尋的排名！
免費 SSL/TLS 憑證的發行單位：
1. Let’s Encrypt: https://letsencrypt.org/
2. Certbot: https://certbot.eff.org/
3. Free SSL Certificate: https://www.freesslcertificate.org/
備註：SSL 憑證申請有點複雜，可以參考自架網站的流程章節中的【免費域名：NoIP DDNS】。
網站架設教學：CMS WordPress 與 XAMPP 設定
基於網站安全性考量與客製化需求，某些檔案的確需要更改預設的設定值。基本的設定值更改，會統一放在【自架網站常見問題】章節中，提供給大家參考。在這個章節中，會分享幾個進階設定，相信你也能快速架設網站並讓網站成功上線。
如何更改網站域名?
剛開始使用 WordPress 自架網站時，是申請免費域名來實現免費網站架設的目的。但是讓我決定花錢買一個專屬域名的原因就是: 免費域名，常常會被其他申請者連累，讓社群網站認定是【惡意網域】，導致無法將文章分享到 Facebook、Google 相關服務。
如何將舊網站資料庫改成新的網域名稱呢？首先，開啟 XAMPP 控制面板，然後登入 phpMyAdmin
在 phpMyAdmin 首頁中，按照下列順序操作(記得先完成資料庫與網站資料的備份！):
- 點選 WordPress 資料庫
- 也就是 WordPress 網站所使用的資料庫名稱
- 點選 SQL
- 輸入 SOL 指令
- 範例在圖片下方，直接複製執行
- 點選執行
將下面範例中的 https://hipay0.com，改成您目前正在使用的網址。
然後在新網址中，改成您未來要使用的新網址。(例如: http://123.me 或 https://xyz.co)
UPDATE wp_options SET option_value=REPLACE(option_value,’https://hipay0.com‘,’新網址‘);
UPDATE wp_posts SET post_content=REPLACE(post_content,’https://hipay0.com‘,’新網址‘);
UPDATE wp_posts SET guid=REPLACE(guid,’https://hipay0.com‘,’新網址‘);
UPDATE wp_postmeta SET meta_value = replace(meta_value,’https://hipay0.com‘,’新網址‘);
添加 Google Analytics WordPress 追蹤碼到 WordPress 自架網站
登入您的 Google 帳號後，進入 Google Analytics 開始申請：
1). 首先設定帳戶ＩＤ，下方選項保持預設設定即可
2). 勾選網頁的選項
3). 設定網站名稱，網站位址就是您要追蹤的網址(把您的域名貼上來)，產業類別請您自行選擇，報表時區選擇臺灣時間，之後就建立成功了
接著參考下圖，前往 Google Analytics 的畫面點選左下方的管理，進入後找到【追蹤資訊】，在下方可以看到【追蹤程式碼】，點開後就可以看到您的追蹤碼了
基本上，我們就是要把下面程式碼加到 WordPress 網站中。
打開 header.php (路徑在: C:\xampp\htdocs\wp-content\themes\oceanwp\ )，把上圖的程式碼全部貼在 <head>的下方，然後存檔。請注意，利用這個方法後，就不需要再安裝其他 GA 外掛或開啟相關功能了，不然流量會重複統計。
使用圖片外掛將網站圖片優化後，為什麼 pagespeed 還是有點慢呢?
一直困擾我很長一段時間，即使調整了 OceanWP 佈景主題中 CSS/JS 的設定、使用許多 Cache Plugins、換了圖片優化外掛….，也一直都看到在 Google Pagespeed Insights 的網頁速度測試結果都不怎麼理想。
最後，找到了原因，假使在網頁開啟的畫面中(above-the-fold)，存在任何圖片的話，就必須將圖片的 ID 或 Class 加到圖片外掛(Smush)緩載入(lazyload)的選項裡。以我的例子為例，網頁開啟後有兩張圖片，一張是網站標示圖，另一張是背景圖片。所以在網頁中，點擊滑鼠右鍵開啟【檢查】的功能，將滑鼠上下移動，找到圖片使用的 ID 或 Class，將值複製下來，貼到 Smush 外掛中的【 Lazy Load】->【Classes & IDs】的欄位裡面。記得在值的前面要加上【.】代表是 Class，【#】代表是 ID。
Blog WordPress 網站上線前的最後步驟
分成兩部分說明，一個是【區域網路：網站只對內使用】，另一個是【網際網路：網站對外開放】。
區域網路：自架網站只對內使用
假使網站只在家裡區域網路使用的話，完成上述任一網站架設軟體與資料庫設定後，就可以在區域網路內使用了。
1). 不需要申請 SSL 憑證
2). 不需要申請 DDNS 服務
3). 不需要設定路由器通訊阜轉發。
以下圖為例，直接在瀏覽器的網址列輸入架設網站那台電腦(PC)的 IP (192.168.1.2)後，就可以連到 WordPress 網站了。
網際網路：自架網站對外開放
一旦完成域名申請、DDNS 設定、SSL 憑證申請、 Virtual Host 設定、路由器通訊阜轉發 ( port forwarding )後，就可以透過網際網路連上。利用這個方法，我們可以利用很短時間， 建立各種高品質的網頁，達到行銷或資訊分享的目的。
架設網站流程
總結以上內容，下圖就是完整的自架網站流程。只要你一步一步將需要的軟體設定好，相信您自行架設網站也可成功進入上線階段！
架站硬體
– 電腦：安裝 Windows 10
– 路由器：入門防火牆、進階防火牆
– 寬頻網路：中華電信光世代
架站軟體
– 5套免費架站懶人包
(參考第 2 章節，推薦使用 XAMPP)
網域名稱
– 免費域名：NoIP DDNS
(建議購買專屬域名)
網頁標題
自己架網站，電費會很昂貴嗎？
個人電腦在待機狀態下耗電嗎？很多人都說電費太貴，不划算，所以就去租用主機。但是我發現個人電腦架設網站，電費是在可接受範圍內。假使用相同電腦規格與租用主機的費用來比較的話，電費絕對比租用主機的費用便宜。
然而當電腦在運作許多服務的時候，多耗電呢？以我的例子而言，這個問題就取決於是不是全部硬碟都在存取資料，例如:
- 小孩是不是使用 Plex Server 的服務，在觀看學校的英文課程呢？(將CD片轉檔成影片檔，放在電腦中，使用平板來複習)
- 家人是不是將手機照片同步到電腦的 nextCloud 呢？
- 而 WordPress 網站是不是也在寫作、編輯照片、檔案或連線呢？
但是，以上這些服務並非 24 小時都在執行，當晚上睡覺時或白天上班、上學時，這些服務都會進入閒置狀態，所以電腦耗電量是會回到待機狀態的耗電量。
下圖是個人電腦待機時的耗電資訊，大致上都在 25 W 到 30 W 的區間跳動。就來計算一下 30W 的耗電量，一期電費會是多少：
- ( 30W x 24hrs x 60days ) / 1000Wh = 43.2度
- 電費： 43.2 x 3元 = 129.6 元 (假設一度電費是 3 元)
- 電腦規格：
- Intel i5-7500(內建顯示晶片)
- DDR4-2400 8GBx4
- WD SN750 500GB SSD
- Toshiba 1TB 7200rpm HDD(存監視器錄影檔)
- WD NAS RED 4TB HDD x3(用途：NAS, Plex Server, nextCloud)
將電腦實現一機多用的例子
假使你的個人電腦只是單純架網站使用，電費會更低。因為我的個人電腦除了架設 WordPress 網站之外，還扮演以下幾個角色：
WordPress 網站
個人雲端
NAS
監視系統
所以，每期 ( 2 個月 ) 電費預估至少會是 NTD 129.6 元！下圖是電腦的工作管理員畫面，將 Plex Server、TrueNAS、nextCloud 等服務關閉，可以看到 CPU 使用率最高的就是監視器錄影軟體了。
自架網站常見問題
以我的經驗而言，安裝好 XAMPP 後，難免會遇到小問題，但是這些問題，都來自於因為本身不具備專業知識所造成的。所以，在這裡分享幾個基礎架站檔案的設定，避免大家也浪費時間走冤枉路。
如何重新安裝 WordPress 網站或搬家網站呢?
很多人會建議用【UpdraftPlus 】這類的備份/還原外掛來重新安裝網站。但是你有想過一種狀況嗎？假使連備份檔案也中毒或遺失檔案的話，這樣子還原回去有用嗎？
釜底抽薪的方法就是：重新架設 WordPress 網站!
不過，卻不是要你再重新寫所有的文章與設定所有細節。細節可以參考我的作法: 【網站搬家】與【網頁速度調整】心得
如何提高資料庫安全性呢?
打開 XAMPP控制面板，然後登入【phpMyadmin首頁】，除了【你的登入帳號】外，刪除其餘帳號。
例如: “任何”、”root(127.0.0.1)”、”root(::1)”
提高登入 phpMyadmin 的安全性措施
在 C:\phpMyAdmin\config.inc.php 找到以下兩行，把值改成’cookie’與False，這樣子就會強迫登入 phpMyadmin 時要輸入密碼。
$cfg[‘Servers’][$i][‘auth_type’] = ‘cookie’;
$cfg[‘Servers’][$i][‘AllowNoPassword’] = False;
更改 php.ini 參數，調整上傳檔案大小、加大記憶體容量、更改時區與開啟Gzip壓縮功能
開啟 php.ini (路徑：C:\xampp\php\php.ini)，更改以下參數值：
Line:388-> max_execution_time : 300
Line:409-> memory_limit = 512M
Line:694-> post_max_size = 80M
Line:846-> upload_max_filesize = 80M
Line:1971–> Asia/Taipei
Line:259-> zlib.output_compression = On
Line:262-> zlib.output_compression_level = -1
Line:262的值是代表壓縮率。”-1″是由系統自己決定；”10″是最大壓縮率，檔案最小但是CPU使用率會最高；”0″則是相反。官方文件建議設定值為”7″。
避免資料庫產生很多無用的數據
在 C:\htdocs\wp-config.php 中，加入以下兩行來避免當你每次修改文章時，WordPress 會自動幫你保存修改之前的文章版本，導致資料庫的無用資料越來越多，拖慢整體效能。
define(‘WP_POST_REVISIONS’, false );
define (‘EMPTY_TRASH_DAYS’, 7);
啟動Gzip網頁壓縮
在 C:\apache\conf\httpd.conf 中，將以下幾行的#刪除。
LoadModule deflate_module modules/mod_deflate.so
LoadModule filter_module modules/mod_filter.so
LoadModule headers_module modules/mod_headers.so
解決 Leverage browser caching 的方法
在 C:\apache\conf\httpd.conf 中，將以下這行的#刪除。
LoadModule expires_module modules/mod_expires.so
如何啟動 http/2 ，加快網頁連線速度呢?
在 C:\apache\conf\httpd.conf 中，將以下這行的#刪除。
LoadModule http2_module modules/mod_http2.so
然後到 C:\apache\conf\extra\httpd-ssl.conf 中，找到 SSLEngine on 後，加入以下這行:
Protocols h2 http/1.1
再找 SSLProtocol all -SSLv3 這一行，改成以下這一行:
SSLProtocol all -SSLv3 -TLSv1 -TLSv1.1
最後，重新啟動 Apache。利用這個連結檢查使否有成功: https://tools.keycdn.com/http2-test
讓 Windows 10 自動啟動 Apache / MySQL 的設定方法
1. 在開始程式集當中，找到 XAMPP，然後滑到 XAMPP Control Panel -> 點選滑鼠右鍵 -> 以系統管理員身分執行 -> 啟用 xampp
2. 點選 Apache 前面的 x，出現【Click Yes to install the Apache service】視窗，點選 yes
3. 點選 MySQL 前面的 x，出現【Click Yes to install the MySQL service】視窗，點選 yes
4. 觀察 Apache 與 MySQL 有沒有都變成綠色勾勾，有的話，表示設定成功。
以後，電腦重新開機後，Apacha / MySQL 就會自動啟動，網站也跟著上線了。
NAS也可以架網站，為什麼要用一台電腦來架設網站呢?
看個人需求，並沒有說 NAS 不行。
但是一開始架網站時，有把握一定會走下去嗎？萬一放棄了，那麼花一兩萬買個 NAS 放在家裡，還要維護它；相對的，電腦的功能性還是比 NAS 來的靈活、強大，可以做的運用也比 NAS 多。
家用寬頻網路的速度，會不會導致網頁連線緩慢呢?
頭兩年使用的是社區寬頻網路(120M/30M)，現在換成 HiNet 光世代(500M/250M)，一直以來都會注意網頁速度，而我的觀察是家用寬頻網路好像也沒有很差!
在 Google PageSpeed Insights的測試結果當中，過去 28 天不論是桌上型電腦或手機用戶，分別在 4 個項目中(FCP、FID、LCP、CLS)，都在 Google 定義的標準之內。所以也就維持現況，並沒有針對程式碼、JS、CSS做優化，因為我也不會!
哪一個佈景主題速度比較快呢?
在社團中，常常聽到網頁開啟速度要快，就是考慮某幾個佈景主題。聖誕節時，廠商都會提出很多優惠方案，所以買了 OceanWP、Astra 兩個佈景主題來試看看。以我的例子而言，在相同的電腦主機、相同的文章下，這兩套佈景主題的速度，並沒有差異，就如同上圖一樣!
我覺得要加快速度的話，還是要靠專業的網路公司/大師級站長，針對程式碼、JS、CSS做優化才能達到。
架設網站自學心得
如同文章開頭講的：自架網站雖然可以大幅壓低資金成本且可以 100% 設計網頁排版，但是就要付出更多的時間在網站維護與網路防護。
雖然架設 WordPress 網站存在一定的門檻，但是過程中所遇到的問題，大部分都可以花時間找到答案解決。在臉書社團中，也有相當多的專家願意協助。所以，假使自己架設網站沒有時間壓力的話，真的會建議大家嘗試看看！
