12_登入網站後的初始化設定
簡介 :
一個全新的網站須先做點基本設定,就跟新手機剛入手時也須做點基本設定,以利後續的運作。
實作開始 :
1、路徑 : 設定/一般
對照下圖與說明自行調整,這個以後可以隨時更動。
網站標題 : 幫自己網站想一個名字,品牌名、公司名都可。
網站說明 : 此網站的簡短說明,大概10~20字即可。
網站圖示 : 不是Logo,可以當它是「網址圖示」,在瀏覽器頁籤會出現的識別小圖示。(下載Demo圖來上傳練習)
*WordPress位址 : 此處不要亂動,除非會造成網站無法登入。
*網站位址 :此處不要亂動,除非會造成網站無法登入。
會員資格 : 不要勾,勾了會一堆機器人來註冊。(如果以後需要有加入會員功能,會用外掛方式來做,故此可以安心先不要勾)
網站介面語言 : 繁體中文或隨你高興。
日期格式 : 如圖即可。
時間格式 : 如圖即可。
完成後按下存檔即可。
2、設定/媒體
設定WordPress網站會自動產生的的圖尺寸。

WordPress都會預設幫我們產生不同尺寸的縮圖,這有利於網頁載入的速度,這是一種貼心,但這樣子每上傳一張圖就會多產生3種尺寸,比較浪費空間。
而後面會安裝佈景主題後,佈景主題也有它自行要用的縮圖尺寸,佈景主題不一定會吃以上3種內建的縮圖,不同的佈景主題可能會自己產生要用的縮圖尺寸,這樣你又會再多3張縮圖,所以每上傳1張圖就得多產生6張縮圖,為了節省空間,我們讓佈景主題自己去產生縮圖就好,故如上圖把內建的縮圖功能關掉。
當然你不關也可以的。
3、設定/永久連結

永久連結 : 指的是網址的架構或稱為格式,指的是每頁網頁或每篇文章在主網址 abc.com後面的名稱或代號,例如「 https://smallway.com.tw/網頁設計/ 」,主網址後面那串就是每一頁網頁的代稱或名稱。
一般預設是「postname」,即主網址後面就是你該網頁或文章的標題,可自行修改成中文、英文、數字或英數混合,新手架站暫以此「postname」為設定即可。
以下為「永久連結」的補充說明,若覺得太複雜可先略過:
我們可以在自訂結構中,刪掉postname後重新點選下方不同的格式,也可以同時選擇多種格式並透過斜線區隔來拼湊出想要的格式,例如新聞網站常用的是「年月日+post_id」來作為每篇文章的網址格式,這樣易於一眼判別是何時的新聞文章。
不過,這邊我們就統一『post_id』就好,這樣你寫文章時就不用篇篇去把把網址後面(slug)名稱都手動改成英文。
以「postname」而言 | 以「post_id」而言 |
---|---|
頁面與文章都可以自由修改網址後面的名稱或代稱。 | 頁面可以自由修改網址後面的名稱或代稱,但文章不行,文章網址會自動套上流水id當文章網址。 |
https://smallway.com.tw/關於我們 → 可以再自改成 https://smallway.com.tw/about | ![]() 如果網站會寫大量文章,我習慣用這樣的格式。 |
注意1 :
有些新網站在永久連結中的格式沒設定好,會造成每篇文章點進去就404找不到網頁。
注意2 :
這永久連結(即網址格式)一開始定好後,以後就不要亂改,以免網址已經被google收錄一段時間後有人搜尋點進來會找不到網頁。
如果一段時間真的有必要性要調整,就得另做好「301轉址」的對應設定,才會讓舊格式網址自動跳轉至新網址的格式。
4、設定/討論
4.1 關閉留言審核
這樣訪客的留言就會不用經批准就會出現留言區。
4.2 設定訪客留言者的頭貼
設定成自動產生。
以上是我覺得最基本的初始化設定,請務必先完成。
維護模式:
如果網站暫時不想被搜尋引擎收錄,也不想讓別人看到製作中的半成品,可以考慮先使用「維護模式」的外掛來讓網站每一頁都變成「維護中」的字樣。
11_帳密小整理
簡介 :
把當下所申請的帳密做清單式整理,日後方便管理。
說明 :
1、網域帳密
在Gandi申請網域時的會員帳密,請保管好!
2、主機帳密
在Cloudways申請主機時的會員帳密,請保管好!
3、網站後台帳密
在主機端的Application的網站中,可以找到網站後台帳密,可先複製到記事本存檔。

再來,請直接從「網站帳密」進入你的網站後台吧 !
※整理個小表格如下:
1.網域帳密 | ■登入網址 : https://www.gandi.net/ .帳號: .密碼: |
2.主機帳密 | ■登入網址 : https://cloudways.com/ .帳號: .密碼: |
3.網站帳密 | ■登入網址 : https://你的網址/wp-admin .帳號: .密碼: |
結語 :
以後會一直反覆用到的是「網站帳密」,另兩組就比較少用了。
『網域帳密』一般只有隔年續約時才會再用到,
『主機帳密』只有要做網站還原或新增網站時才會再用到,
所以暫時沒有用到的帳密請妥善保管!
[SMTP]啟動Cloudways主機端的SMTP寄信服務(純寄)-Elastic Email
簡介
讓網站的各種通知信,例如忘記密碼、註冊通知、線上表單…等各式信件可以在「網站」上以該網域的名義成功寄出到指定的信箱,且不易進入垃圾信匣中。
運用範圍
全站任何主題、插件只要會發出信件通知的,都會自動使用此發信服務。
範例
假設我的網站的網域是smallway.tw,
在此網站上面所發出的信件都是以「smallway.tw」為寄件人的Email信箱(如下圖範例是 [email protected]),這就是以「該網域的名域」來成功發送,才會具有較高的可信度,比較會秒送達至對方信箱,也不易進入垃圾信匣中。
觀念
這樣子可以以該網域名義所寄出的信件的協定一般稱為「SMTP」,聽到這個名詞先別開始覺得有點難了,因這個服務在目前專為WordPress環境運作的主機上,已有許多簡化。
所以只要是xxxx@你的網域、yyyy@你的網域、zzzz@你的網域…這種形式的「寄件人」(前面ID可自訂)都可以說它是用此「網域名義」發出信件。
而在WordPress網站中,我再把「網域名義」作為寄件人分成兩種,這兩種的共通點都是可以成功寄出信件,而不同點是一種是可「收信」的(有收信匣,另稱之為網域信箱),一種是不可收信的(純以網域名義寄信)。
由於前幾面教的是租用Cloudways主機,下表就以Cloudways主機所提供的方案做個比較。
區分 | 網域名義發信 | 網域信箱 |
服務名稱 | Elastic Email | Rackspace Email |
寄信 | 可 | 可 |
收信 | 不可 (有人寄信過來是無效信箱,因是虛擬的,這只是以一個網域名義發信實際上並這個信箱並非真實信箱) | 可 (會有一個網頁版的收信後台,也可以用Gmail或Outlook代收或寄信) |
設定難易度 | 簡單 | 稍複雜 |
費用 | 1000封/0.1美元 | 1個信箱1美元(預設無封數上限) |
故『xxx@你的網址』→因是虛擬信箱,故『xxx@你的網址』,xxx可以自訂或隨意修改或新增多個且無上限。 | 1美元買1個信箱,故無法增加多個信箱,但『xxx@你的網址』前的id可以修改,但修改後視為新的信箱,若有人寄信給你在修改前的那個信箱就會變成無效信箱,收不到信。 | |
官方說明 | 點此 | 點此1 點此2 |
實作 :
在新手架站的章節,就先以「網域名義發信」來教學,讓你的網站先能正常寄出信件為優先考量,至於「網域信箱」將會在另一個專題做說明。
1、啟用Elastic Email服務
2、選擇方案
初期小網站先選最低方案即可,以後若不夠用,它會寄信通知你,你再來提升至下個方案即可。
3、選擇要套用在哪個主機上
若是這台主機裡面有架多個網站,都會全數自動套用到。
4、選取Elastic Email
如下圖點選後即可套用完畢,而第④是可以寄測試信的,但因DNS尚須接著也設定一下才能回來寄送測試信。
上圖是截圖自smallway.tw,因該網域已有設定過,故以下就改幫「smallway.com.tw」這個網站做一下SMTP寄信的DNS設定。
5、在DNS加上5筆記錄
請進入網域商的後台,如同第07節那樣的介面,去添加5筆DNS記錄,這5筆記錄就是要讓網域名義寄信的服務可以運作所必須的設定。
▼下表參考官方說明網頁之整理
種類 | DNS 類型 | 名稱/主機/別名 | 內容 | |
SPF | TXT | @ | v=spf1 a mx include:_spf.elasticemail.com ~all | 自動或最低 |
DKIM | TXT | api._domainkey | 自動或最低 | |
Tracking | CNAME | tracking | api.elasticemail.com | 自動或最低 |
MX | @ | aspmx.l.google.com | 無 | 1 |
DMARC | TXT | _dmarc | v=DMARC1; p=none; | 自動或最低 |
Elastic Email 並非是網域信箱,所以不需要MX記錄,故這邊的MX只要隨意有設就可以了,但經測試有時候MX完全不設也可以運作。
如果是替子網域來設定的,則參考這一個表格,只差在加上「.子網域ID」而已。
種類 | DNS 類型 | 名稱/主機/別名 | 內容 | |
SPF | TXT | 子網域ID | v=spf1 a mx include:_spf.elasticemail.com ~all | 自動或最低 |
DKIM | TXT | api._domainkey.子網域ID | 自動或最低 | |
Tracking | CNAME | tracking.子網域ID | api.elasticemail.com | 自動或最低 |
MX | @ | aspmx.l.google.com | 無 | 1 |
DMARC | TXT | _dmarc.子網域ID | v=DMARC1; p=none; | 自動或最低 |
6、驗證網域
當DNS設定完後,回到Cloudways後台,在Elastic Email的啟用畫面上,如下圖點擊箭頭處的驗證。
輸入您網站的網域
7、寄測試信件
參考第4點的所在位置,然後可以如下圖啟動測試寄信。
▼我寄信是填 test@網域 ,你可以用任意字母當成「xxx@你的網域」,xxx可以任意自訂,因不管怎樣訂定xxx,這都是以你的網域名義所寄出的信,都會成功寄達。
▼成功收到測試信件
總結
上面的流程看起有點繁雜 ,實際上只要跟著設定一次,再來就不用再設定第二次了,若真的設定不成功,Cloudways線上客服隨時在線,也可以請客服協助您查原因。
10_在主機端手動做第一次備份與設定自動備份
簡介 :
新網站先做一次手動備份,萬一後面網站玩壞了可直接來此復原。
說明 :
備份,可以在主機端做,也可以在網站端做,一般而言我會傾向在主機端做即可,有必要性我才會在網站端也順便做,並把網站端的備份檔再自動上傳至Google雲端空間
這邊先示範用主機端做。
我們課程教的是「Cloudways」主機,它本身就有每日自動備份的功能(不用再付費),但由於自動備份是在半夜才會啟動,而我們現在已經要開始玩我們的網站了,為了避免新手不小心把網站搞壞(其實剛開始是不太可能),我們就先手動做一次備份吧。
其實是我為了讓新手們有備份的觀念與知道怎麼做備份,所以規劃在此先手動做一次。
開始實作 :
1、手動備份
一樣在 “Application”下的網站裡面,點選”Backup and Restore”,如下圖,在②的地方按下去就是手動立即備份了。


靜等它跑完即可,此時不要任意關閉畫面。
2、手動還原
同樣的畫面,下方若點選 ” ROLLBACK “再點OK,就可以選一個日期還原。
基本上它的日期是每2日一個備份,保留15個還原點。

以上即學會了在「主機端」對網站的備份、還原。
3.更改自動備份的週期
如下圖,先切換到Servers的介面,設定一下備份的週期,基本上是建議設定每日一次(預設值是每2日一次)並保留四週,這樣就可以了。

進階說明 :
1、網站備份檔可以下載嗎?
在主機端做的備份檔預設是無法下載(想下載須另外改成本地端空間備份才行),但在網站端做的才可以下載或再設定讓它直接備份到Google雲端去,需要時再去雲端空間來下載。
2、一般用網站端做的備份可以直接下載,下載後可以複製到其它主機上的空網站去還原,這樣就變成一個一模一樣的網站了,也就是所謂的「網站搬家」。
3、用WordPress替人做網站,完工後若業主要求要交付原始檔的話,只要交付這個「網站端的備份檔」即可。
4、未來如果網站有做外掛升級、大變動前,最好都來手動備份一次,以免網站出問題要還原時卻沒有離現在最新的備份檔可用。(因主機自動建立的備份時間點是前一日)
09_在主機端安裝免費SSL憑證
簡介 :
SSL憑證主要是讓封包傳輸時,替封包做「加密傳輸」,有安裝的話讓網址會有「https」開頭。
(尤其是機敏資料,例如填寫會員資料、購物網站的刷卡…等等)
SSL憑證不用另外買,我們用的這家主機商就有送了!
準備 :
請先測試一下前一章節教的所設定的網域指向是否已經生效,若未生效則安裝SSL憑證會失敗喔。
只要在瀏覽輸入你的網址,如果已經可以看到一個全新的空的WordPress網站就代表已經指向生效了。
開始實作 :
1、至「Applications」選擇網站
先從Applications中選擇自己剛安裝好的網站,並點擊進去。

2、點擊”SSL Certificate”
「SSL Certificate」就是主機商提供的免費SSL。
如下圖步驟完成即可。

3、強制使用https開頭的網址
安裝成功後,會跳出一個小視窗問你是否要把網址都強制轉向至有https開頭的,請按下「ENABLT HTTPS」。若按太快不小心關掉,可以來圖4這邊設定即可。


4、重要提醒
你一定要把SSL憑證安裝成功,且確定網址都已經是「https」開頭(有一個鎖頭),才正式在網站中上傳圖片、檔案之類,

否則在你網址都還沒有成為https狀態之下,就開始編寫網頁,此時頁面或文章時所上傳的任何檔案或媒體,它的來源網址都會是無https的,而就算你未來把SSL憑證補安裝好了,原本已上線的網頁中的媒體或圖,仍會是無https狀態的路徑,這樣會造成整個網頁中有https與無https的圖檔混在一起,形成「混合內容」,在瀏覽器的網址列上仍是會顯示不安全。
其它說明 :
1、SSL憑證也有付費式,但一般網站我們用免費的就非常足夠了。
2、免費SSL憑證的提供 : 有些主機商會提供、有些是網域商也會提供,但一般都是主機端會提供居多。
3、有安裝SSL憑證不代表主機、網站就不會受駭客攻擊或入侵,真正要防止駭客的是主機(商)的主機防護能力、網站的資安作為,而不是單靠這個SSL憑證。
4、有安裝SSL憑證的話,訪客的瀏覽器上就不會出現不安全的字樣,讓訪客比較安心可以瀏覽。
08_把網域的DNS指向主機
簡介 :
把買好的網域指向與主機裡面的網站做互相對應,這樣在瀏覽器輸入網址才能找到新架設的網站。
說明 :
在網域後台把A紀錄填上主機的網站的IP。
+
在主機後台,把網站的Domain輸入網域名稱。
(這個動作稱為「修改DNS記錄」)
開始實作 :
主機後台:
1、主機端 : 先在「網站」加入新買的網域名稱
到Applications中選到自己的網站,然後把新買好的網域名稱填入,不用包含http,如下圖。
2、主機端 : 取得主機IP
在Server中,如下圖複製好主機IP。

網域後台:
3、登入Gandi網域 / 我的產品

4、進入DNS設定

5、找到「A」對應的編輯
找到「A」,指的就是「A紀錄」,A紀錄就是用來對應主機的,照下圖做即可,剩下的都先不用亂動。

6、填入主機IP

7、靜等生效
大概5分鐘左右,在瀏覽器輸入您的網址,就能直接對應到您的網站了,您會看到一個全新的空網站。
8、生效後立即安裝SSL安全憑證
請見下一篇。
總結
這邊新網站只需要設一次,以後就幾乎不會再用到這邊的設定了。
這樣是不是很容易呢?買網域、買主機好像沒那麼可怕呢!
補充說明 :
1、一般DNS生效需要24小時以上時間(台灣很多網域商就是如此),但有些網域商的DNS在更新與散播上有比較特殊的處理,所以在速度上很快就生效了,像我們用的Gandi設定好A紀錄,不用5分鐘就生效了。
2、其實DNS的設定尚有另一種方式,就是「DNS託管」,也就是網域雖然在Gandi買,但可以把「DNS紀錄管理權」直接託管給你的主機商,這樣以後在主機商那邊就可以直接設定DNS了。不過我們用的Cloudways主機商並沒有這種託管服務,所以我們只能在Gandi這麼直接設定A紀錄中的IP即可,但也沒有很麻煩,三兩下就完成了。
補充子網域的設定 :
把網域前面加上不同的ID名稱,就形成了「子網域」,子網域可以用來對應不同的新網站。
- 主網域 : 100cc.xyz
- 子網域1 : mydog.100cc.xyz
- 子網域2 : mycat.100cc.xyz
- 子網域3 : mylife.100cc.xyz
- ……可無限新增
07_網站主機申請流程(Cloudways)
主機的申請,我們採用CP值最高、效能也穩定的Cloudways的VPS主機,也是市面上最多人使用的主機商之一。
因主機商在國外,故介面會是英文版的介面,但只要網頁上按右鍵翻成中文,在操作上就沒有太大的門檻,而且我們只要架設好網站之後,不會常常需要進入到主機後台做特殊操作,只會較常登入網站後台居多。(如果你想使用國內的主機商請另參考這家台灣遠振主機商)
Cloudways VPS主機特色
開始申請Cloudways主機
1、從START FREE開始
申請網址 : 點此
(若看不到網址請用無痕模式開啟此頁)
2、使用Google帳號註冊
點Google帳冊比較快。
並設定一個密碼,請將密碼記下來。
3、寫信驗證身份
不一定每個人註冊時都會跳出要寫信驗證,但如果有要求驗證會出下圖的頁面,此時可複製上面的客服信箱來寫一段小訊息做驗證。
請用你申請時的信箱寄信給它指定的信箱( [email protected] ),
- 主旨 : Please active my account : xxxx@gmail.com
- 內容 :「Please active my account,thanks」即可。
如果客服有回信詢問問題你須回答一下(直接按回信),如下圖,給個FB主頁網址與個人電話,這樣就可以通過了。
4、登入

5、驗證信箱

6、驗證手機
回到Cloudways後台,可能會有下圖的畫面可以選主機,但右下角仍有紅字警告你尚未完全所有驗證。
如下圖(我用瀏覽器按右鍵翻成中文),點選驗證帳戶。
輸入手機號碼,收到簡訊後再輸入簡訊驗證碼即可完成驗證。
7、綁定信用卡
就算只是要試用三日,也要先綁信用卡才能試用喔!
我們要先綁一下信用卡,如下圖路徑去點選(也可以點此直達設定頁面)。
輸入卡號
完成以上後,請放心,目前都沒有費用產生(因為裡面還沒有網站),直到正式安裝網站了,才會開始按小時計費,每月月繳一次費用(自動刷卡)。
如果三日後不想再用,可以把整台主機刪除,然後信用卡解除綁定即可。
8、開始安裝主機與網站
9、切換回舊介面
Cloudways主機後台,目前有新舊二種操作介面,我比較習慣舊介面,本站教學目前也都以舊介面來說明,故可依下圖切換至舊介面。
10、信用卡到期日加入Google行事曆
超級重要!!!
Cloudway主機只能用信用卡繳費,但我的有些客戶們曾發生信用卡到期了但未留意,故主機的月繳費時的扣繳失敗,造成主機被停用,故在申請完主機綁完信用卡後,請立即打開你的Google行事曆,在信用卡到期日的前一個月提醒自己要進到Cloudways來更換卡片(延展),否則會不小心讓自己的主機因未繳費而完全消失喔,這樣苦心設計經營的網站全都救不回了,這一點超重要!!!
還有「網域」的購買也是有綁信用卡,也記得在信用卡到期時要一併更換綁定的信用卡唷!
05_網站主機+網址的選擇與介紹
簡介
架設網站,必須擁有1個主機空間 + 1個網址,並將網址與主機IP做綁定指向。
說明
1、主機(伺服器)
主機(伺服器),可以想像成是一台位在網路上的電腦,它與一般電腦一般具有CPU、記憶體等規格,也具有運算能力,所以主機就會有規格等級的區分。
空間,只是主機內含的一部分,所以光有空間還不能架設WordPress網站,例如Google雲端硬碟,這個就「純空間」不能用來架WordPress網站。我們的WordPress網站是動態式的網站(有資料庫),故是安裝在已經設定好環境的「主機」上才能運作,而不是單純存放在「空間」上就能運作(早期靜態網頁是純放在空間這樣的作法)。
以上的比喻雖非是完全正確的比喻,但新手只要略懂這個比喻要傳達的概念即可。
一般架站中小型的WordPress網站,會使用「虛擬主機」,好一點的會使用「VPS主機」,更高階的可能會用到「雲端主機」,但一般性的需求我們使用虛擬主機或VPS主機就已經夠用了,也比較好操作。
▼簡單比喻三種主機的差別:
虛擬主機 | VPS主機 | 雲端主機 |
套房 | 公寓 | 透天厝 |
這樣的比喻雖沒有非常正確,但就是一個等級上的概念區分讓您可以有大致的概念。
2、網域
網址,嚴格說應稱為「網域」,因為網域可以用在各種服務上,用在網站的服務我們才稱之為「網址」。
網域命名:
- 形音不混淆(例r+n)
- 好記有含意
- 命名方向 : 品牌縮寫 或 雙單字 或 單字+數字
- 常以「.com.tw」、「.com」、「.tw」、「.cc」
- 例: mobile01.com、
盡量不要選擇過於臭長的ID當網域名稱。
總結
簡單想,網址就好比是手機號碼,主機就是你的智慧手機,辦門號+買手機才能讓一台智慧手機完全運作起來。
02_WordPress簡介
簡介
早期只有懂程式的人才能做網站寫網頁,而WordPress是近十多年流行起來的架站與網頁設計一種方式,可以不用具資訊底子也能入門學習的一種架站方式。(不過後期深度研究的接案工作者仍遲早會與程式碼碰頭)
透過安裝核心程式與佈景主題的方式立即擁有初步的前、後台框架與基本功能,再透過安裝適當的插件外掛來堆出想要的功能。
客製化程度可高達90%。
說明
(取自維基百科)
正確寫法 : WordPress (W與P都要大寫)。
核心組成:PHP程式碼+MySQL資料庫組成的開源套裝架站系統。
網站組成:1套佈景主題 + 適合適當量的外掛。
比喻如下:
- 1個手機門號→網址
- 1套作業系統(iOS、Android)→WordPress網站
- 1個手機主題樣式→佈景主題
- 多種APP→外掛
所以我們就用「設定新手機」的概念與心情來學習WordPress吧!