10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站

10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 3

WordPress 是一套非常受歡迎的內容管理系統,在目前世界上的所有網頁中,有超過 40% 是由 WordPress 所建置,可見受歡迎程度非同小可!

如果你想要架設屬於自己的 WordPress 網站,基本上只要挑選好虛擬主機就可以順利的架設好自己的網站,但是隨後所要面臨到的問題就是要熟悉 WordPress 後台的操作模式,並不是人人都可以立刻上手!

那麼有沒有辦法是可以先在自己的電腦上架設 WordPress 來練習?當然是有的,本篇文章所要介紹的「XAMPP」就是一套免費的軟體工具,可以提供你在本機電腦上,快速的用 Mac XAMPP 架設 WordPress 網站!

教學是使用「Mac 版的 XAMPP」來做示範,Windows 版本的使用方式大同小異,如果在閱讀文章的過程中有任何問題,歡迎隨時在底下留言,或是透過聯絡我跟我溝通討論,讓我們準備開始吧!

除了 XAMPP 之外,還有另外一款免費工具「MAMP」也可以達成在本機電腦架設 WordPress 的目的,詳細教學文章如下:
MAMP 教學|如何在本機電腦安裝 WordPress?3分鐘搞定WordPress離線安裝

XAMPP 是什麼?

Mac XAMPP

XAMPP 是一套基於 PHP 的開發環境,其中包含 Apache、 MariaDB、PHP 和 Perl,可以讓使用者輕鬆快速的在本機電腦上架設 WordPress 網站,支援 Windows、macOS 和 Linux

如果你想要架設網站,但是對於 WordPress 又沒有那麼熟悉,就可以先利用 XAMPP 來把 WordPress 架設在自己電腦上來練習與熟悉,讓你在正式開始架設網站前可以有完整的體驗!

使用教學

10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 6

本篇文章是以 Mac 版本的 XAMPP 來當作示範教學,其餘系統的版本使用上也是大同小異,差異程度並不大,只要熟悉了流程在任何系統上都適用!
準備好要架設自己的本機 WordPress 網站了嗎?讓我們一起往下看!

預估時間: 10 minutes

步驟 1:下載與安裝 XAMPP

10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 8

點我前往 XAMPP 下載頁面,因為我是使用 macOS 來進行示範,所以選擇 Mac 版本的,如果你是其他系統記得自己選成對的版本,附帶的 PHP 版本直接選擇最新的來下載,如上圖。

下載回電腦後直接進行安裝,過程中保持預設即可,我這邊就省略中間安裝流程,如下圖。
10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 10

步驟 2:啟用資料庫

10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 12

安裝完成後打開 XAMPP 主程式,在 Manage Servers 頁面把 Apache Web Server 和 MySQL Database 兩個伺服器用 Start 按鈕啟動,啟動之後在 Status 欄位會看到 Running 的狀態,如上圖。

步驟 3:開啟資料庫後台

10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 14

在 XAMPP 程式畫面上方切換成 Welcome 頁面,點選 Go to Application,會用瀏覽器開啟歡迎頁面。

點選瀏覽器畫面右上方的 phpMyAdmin 開啟資料庫後台,如下圖。
10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 16

步驟 4:建立新資料庫

10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 18

雖然預設就有資料庫存在,但我們可以自己建立一個給 WordPress 專屬使用的資料庫,這個資料庫會拿來安裝 WordPress,名稱以英文命名,其餘保持預設,點擊「建立」按鈕就可以新增資料庫。

步驟 5:新增資料庫管理員帳號

10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 20

再來我們可以建立一個帳號來管理 WordPress 資料庫,如果你不想建立也可以跳過,預設的 root 也有最高權限,但是沒有密碼,建議還是自己新增一個,點選左下角的「新增使用者帳號」來進入建立流程。

帳號與密碼都自己設定即可,主機名稱請選擇 localhost,其餘保持預設。
10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 22

在最下方的「全域權限」,把全部的選項都打勾,這樣該帳號才有最高的權限,沒問題就按下「執行」按鈕,就會開始建立囉。
10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 24

步驟 6:下載 WordPress 安裝檔

10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 26

到這邊資料庫的設定就完成了,接下來要下載最新版本的 WordPress 安裝檔,請點我前往下載。

下載回電腦後請解壓縮,並且把資料夾名稱命名成自己想要的,依我的例子就是命名成「miumiu」,會等於你的網址名稱,如果我想要訪問我的網站,就是要輸入「http://localhost/miumiu」前往。

步驟 7:複製 WordPress 安裝檔資料夾到 htdocs

10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 28

再次打開 XAMPP 主程式畫面,點選「Open Application Folder」打開安裝的資料夾。

在「htdocs」資料夾內,把剛剛所下載且自行命名的 WordPress 安裝檔資料夾移動或複製過去,如下圖。
10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 30

步驟 8:開始安裝 WordPress

10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 32

還記得我剛剛所說的網址嗎?

依照我的例子,我是要前往「http://localhost/miumiu」就會開始安裝 WordPress 的流程,記得把後方資料夾名稱改成自己的

步驟 9:WordPress 連接資料庫

10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 34

接下來要把 WordPress 連接上剛剛所建立的資料庫,輸入資料庫的名稱、使用者名稱與密碼後,其餘保持預設並按下傳送按鈕,如上圖。

如果順利連接上資料庫,會看到如下圖畫面。
10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 36

步驟 10:建立 WordPress 後台帳號

10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 38

再來需要建立一個 WordPress 後台的帳號,網站標題先隨便輸入,之後到後台還可以更改,如上圖。

成功建立之後就會看到如下圖片,代表可以登入 WordPress 後台囉!
10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 40

步驟 11:開始使用 WordPress 本機網站

10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 42

順利登入 WordPress 後台後,就可以開始著手架設網站相關的練習囉!

供應者:

  • XAMPP

使用工具:

  • XAMPP

網站架設概念

如果你已經熟悉了整個流程,後續可以考慮把網站上線,讓大家可以拜訪你的網站,至於詳細的架設 WordPress 網站的方法,請參考下列詳細概念文章:

總結

XAMPP 是一套非常好用的免費軟體,不管是在你尚未熟悉 WordPress 的時期想要練習,或是已經是老手了想要弄個網站來測試,都相當好用,像我自己就會用一個本機的 WordPress 來安裝與測試外掛、修改佈景主題等等!

常見問題

XAMPP 是什麼?

XAMPP 是一套基於 PHP 的開發環境,其中包含 Apache、 MariaDB、PHP 和 Perl,可以讓使用者輕鬆快速的在本機電腦上架設 WordPress 網站,支援 Windows、macOS 和 Linux。

XAMPP 支援哪些系統?

支援 Windows、macOS 與 Linux 三種作業系統。

如果沒有建立資料庫使用者帳號,預設可以用什麼帳號密碼?

可以使用 root 帳號,沒有密碼!

資料來源

文章內資料與圖片來源如下:

XAMPP 簡介

XAMPP 簡介
10分鐘學會用 Mac XAMPP 在本機電腦架設 WordPress 網站 44

XAMPP 是一套基於 PHP 的開發環境,其中包含 Apache、 MariaDB、PHP 和 Perl,可以讓使用者輕鬆快速的在本機電腦上架設 WordPress 網站,支援 Windows、macOS 和 Linux。

幣種: TWD

適用系統: macOS

軟體類別: DeveloperApplication

推薦指數
5
歡迎在下方訂閱本站,第一時間接收最新文章發布訊息!

  • 文章內容有誤需要更新或有商業合作需求,都歡迎透過「聯絡我」來一起聊聊。
  • 部落格內某些連結是聯盟行銷,如果你透過連結購買產品,我會得到些許回饋,但不影響購買原始價格,詳細請參閱「免責聲明」。
  • 部落格全站內容皆為免費教學版權為本站所有,如要轉載請先來信溝通,詳細資訊請看「隱私權政策」。

留言討論分享

回到頂端