網站後台操作教學

開啟瀏覽器，輸入後台網址

打開 Google Chrome（建議使用 Chrome 以獲得最佳體驗），在網址列輸入：

按下 Enter，就會看到 WordPress 的登入頁面。

輸入帳號與密碼

在登入頁面你會看到兩個欄位：

使用者名稱或電子郵件：輸入我們提供給你的帳號
密碼：輸入我們提供給你的密碼

建議勾選下方的「記住我」，這樣下次不用重新輸入。

點擊「登入」按鈕

確認帳號密碼無誤後，點擊藍色的「登入」按鈕。成功登入後會進入 WordPress 儀表板（下一章會詳細介紹）。

認識儀表板全貌

登入後你看到的第一個頁面就是「儀表板」。它分為三大區域：

左側選單：所有功能都從這裡進入（文章、頁面、媒體、外觀等）
頂端工具列：快速捷徑，可以前往網站前台或新增內容
中間內容區：會顯示你目前操作的頁面內容

左側選單重點項目

以下是你最常用到的選單項目：

頂端工具列

畫面最上方的黑色長條就是「工具列」：

左側的網站名稱：點擊可以切換到網站前台（訪客看到的畫面）
「+ 新增」：快速新增文章、頁面或媒體
右側的頭像：登出或進入個人資料設定

進入個人資料頁面

在左側選單點擊「使用者 → 個人資料」，或者點擊右上角的頭像圖示後選擇「編輯個人資料」。

修改顯示名稱和 Email

暱稱：你希望在網站上顯示的名字（例如在文章作者處會顯示此名稱）
公開顯示名稱：從下拉選單中選擇你想公開的名稱
電子郵件：用於接收系統通知和重設密碼，請確保填寫正確

修改密碼

往下滾動找到「帳號管理」區塊，點擊「設定新密碼」按鈕。系統會自動產生一組強密碼，你可以使用這組密碼或自行輸入新密碼。

輸入完畢後，滾到頁面最下方，點擊「更新個人資料」按鈕儲存。

進入一般設定

在左側選單點擊「設定 → 一般」。

認識可修改的欄位

網站標題：你的公司/品牌名稱，會顯示在瀏覽器標題列和搜尋結果
網站說明：一句話描述你的網站，建議 20-30 字，包含核心關鍵字
管理員電子郵件地址：接收系統通知的信箱

確認時區設定

往下找到「時區」，確認設定為「UTC+8」（台北時間）。這會影響文章發布時間和排程功能的時間顯示。

修改完畢後，點擊頁面底部的「儲存變更」按鈕。

一張表搞懂差異

WordPress 有兩種內容類型，很多人搞混，其實很簡單：

簡單判斷法

問自己一個問題：「這個內容以後還會再發新的嗎？」

如果答案是「會」→ 用文章（例如：每月活動公告、新商品上架通知）
如果答案是「不會，就這一頁」→ 用頁面（例如：公司簡介、門市資訊）

新增文章

左側選單點擊「文章 → 新增文章」，或者點擊頂端工具列的「+ 新增 → 文章」。

撰寫文章內容

進入編輯器後，你會看到一個乾淨的編輯畫面：

標題區：在「新增標題」處輸入文章標題
內容區：在下方輸入文章內容。可以直接打字，按 Enter 換段落
「+」按鈕：點擊可插入圖片、標題、清單、表格等不同類型的區塊

設定分類、標籤、精選圖片

在右側面板（如果看不到，點擊右上角的齒輪圖示開啟）：

分類：勾選文章所屬的分類（至少選一個）
標籤：輸入關鍵字標籤，按 Enter 新增
精選圖片：點擊「設定精選圖片」上傳一張代表圖（會顯示在文章列表和社群分享預覽）

發布或排程

點擊右上角的「發佈」按鈕即可立即發布文章。

如果你想在未來某個時間自動發布：

1. 點擊「發佈」旁邊的「立即」文字
2. 選擇你想要的發布日期和時間
3. 按下「排程」按鈕

文章就會在你設定的時間自動發布。

編輯與刪除文章

前往「文章 → 全部文章」，將滑鼠移到文章標題上，會出現操作選項：

編輯：進入完整編輯畫面
快速編輯：可以快速修改標題、分類、狀態等（不會進入編輯器）
垃圾桶：將文章移至垃圾桶（30 天後自動永久刪除）

分類 vs 標籤

分類（Category）就像資料夾，是文章的大分類。例如：「最新消息」「活動紀錄」「客戶案例」。每篇文章至少要選一個分類。

標籤（Tag）就像便利貼，是更細的關鍵字。例如：「婚禮佈置」「生日派對」「企業活動」。標籤可以選也可以不選。

管理分類

左側選單點擊「文章 → 分類」：

新增分類：在左側填寫名稱和代稱（代稱是網址用的英文，例如「news」）
上層分類：可以建立子分類（例如「活動紀錄」下面有「婚禮」「生日」）
說明：可填可不填，部分佈景主題會顯示

管理標籤

左側選單點擊「文章 → 標籤」，操作方式和分類類似。

你也可以在編輯文章時，直接在右側面板的「標籤」欄位輸入新標籤。

進入媒體庫

左側選單點擊「媒體 → 媒體庫」，就能看到你網站上所有的圖片和檔案。

你可以切換「格狀」或「列表」模式來瀏覽。

上傳圖片

點擊上方的「新增媒體」按鈕，然後：

拖曳上傳：直接把電腦裡的圖片拖到上傳區域
選取檔案：點擊「選取檔案」按鈕從電腦中選擇

填寫圖片 alt text（替代文字）

這一步非常重要！點擊任何一張圖片，右側會出現詳細資訊面板。請務必填寫「替代文字」欄位。

什麼是 alt text？就是描述圖片內容的文字。當圖片無法載入時，會顯示這段文字。

為什麼一定要填？

1. SEO 加分：Google 會讀取 alt text 來理解圖片內容，有助於你的網站出現在搜尋結果
2. 無障礙友善：使用螢幕閱讀器的視障朋友，靠 alt text 來「聽」圖片內容
3. 圖片搜尋：你的圖片有機會出現在 Google 圖片搜尋中

怎麼寫才好？用一句自然的中文描述圖片內容，10-25 個字，自然帶入相關關鍵字。

裁切圖片

點擊圖片後，在詳細資訊面板點「編輯圖片」，就能進行裁切、旋轉等操作。

進入選單管理

左側選單點擊「外觀 → 選單」。如果你有多個選單，先從上方的下拉選單選擇要編輯的那一個。

新增選單項目

在左側的「新增選單項目」區塊中，你可以從以下來源新增：

頁面：勾選想加入的頁面，點「加到選單」
文章：勾選想加入的文章
自訂連結：輸入任何網址（例如外部網站或社群連結）
分類：加入整個文章分類頁面

調整排序和子選單

調整順序：用滑鼠拖曳選單項目上下移動
建立子選單：把項目往右拖一格縮排，就會變成上一個項目的子選單
修改名稱：點擊項目右側的小三角形展開，可以修改「導覽標籤」

設定選單位置並儲存

頁面底部的「選單設定 → 顯示位置」，勾選你希望這個選單出現的位置（通常是「主選單」或「Primary Menu」）。

最後點擊「儲存選單」按鈕。

進入 Elementor 編輯模式

有兩種方式可以進入 Elementor 編輯器：

方式一：從後台
前往「頁面 → 全部頁面」，在想編輯的頁面標題下方會出現「使用 Elementor 編輯」，點擊即可。

方式二：從前台
登入狀態下瀏覽你的網站，頂端工具列會出現「使用 Elementor 編輯」按鈕。

認識編輯器介面

進入 Elementor 後，畫面分為兩大區域：

左側面板：所有的元件（Widget）和設定都在這裡
右側畫布：你的頁面即時預覽，所見即所得

左側面板上方有幾個重要圖示：

漢堡圖示（三條線）→ 回到元件列表
九宮格圖示 → 搜尋所有元件
圖層圖示 → 開啟導航器（Navigator）

儲存與離開

左側面板最底部有三個重要按鈕：

齒輪圖示：頁面設定（標題、版面配置等）
圖層圖示：開啟導航器
眼睛圖示：預覽頁面
綠色「更新」按鈕：儲存所有修改

編輯完成後，記得點擊綠色的「更新」按鈕儲存。要離開編輯器，點擊左上角的漢堡圖示，然後選擇「離開」。

理解三層結構

Elementor 的頁面像一棟房子，由三個層級組成：

Section（區段）= 一層樓
頁面上的水平區塊，佔滿整個寬度。一個頁面由多個 Section 上下排列組成。

Column（欄位）= 房間
每個 Section 裡面可以分成 1-6 個直欄，用來控制左右佈局。

Widget（元件）= 家具
放在 Column 裡面的具體內容，例如文字、圖片、按鈕等。

新增 Section

在頁面中，你會看到一個紅色的「+」按鈕，點擊後會出現結構選擇：

1 欄（全寬）、2 欄（左右各半）、3 欄、4 欄等不同佈局。

選擇你需要的結構，Section 就會出現在頁面上。

拖曳 Widget 到 Column

從左側面板找到你需要的元件（例如「標題」），用滑鼠按住不放，拖曳到右側畫布的 Column 裡放開。

放下後，左側面板會自動切換到該元件的設定頁面，你可以立即開始編輯內容。

選取和編輯不同層級

用右鍵點擊頁面上的元素，會出現選單讓你選擇要編輯的層級。你也可以用以下方式快速辨識：

點擊 Widget 上方的鉛筆圖示 → 編輯該 Widget
點擊 Column 上方的灰色小方框 → 編輯該 Column
點擊 Section 左側的藍色六點圖示 → 編輯該 Section

標題元件（Heading）

點擊頁面上的任何標題文字，左側面板會顯示設定選項：

內容 → 標題：直接修改文字內容
內容 → HTML 標記：選擇 H1-H6（H1 是最大的主標題，一個頁面建議只用一個 H1）
樣式 → 文字顏色：點擊色塊可以更換顏色
樣式 → 排版：可以調整字體大小、粗細、行距

文字編輯器（Text Editor）

文字編輯器適合較長的段落文字。點擊頁面上的文字段落，左側面板會出現一個類似 Word 的編輯框：

你可以直接在框中修改文字，使用上方工具列進行粗體、斜體、加入連結、插入清單等排版操作。

圖片元件（Image）

點擊頁面上的圖片，左側面板的「內容」頁籤中可以：

選擇圖片：點擊圖片預覽可以更換圖片（從媒體庫選擇或上傳新圖）
圖片大小：選擇預設尺寸或自訂
連結：設定點擊圖片時要前往的頁面（「無」「媒體檔案」「自訂 URL」）

按鈕元件（Button）

按鈕是引導訪客行動的關鍵元素。點擊頁面上的按鈕：

內容 → 文字：修改按鈕上顯示的文字（如「立即諮詢」「查看更多」）
內容 → 連結：設定點擊按鈕後前往的網址
樣式 → 背景顏色：修改按鈕底色
樣式 → 邊框圓角：調整按鈕的圓角程度

間距元件（Spacer）和分隔線（Divider）

間距：用來增加元素之間的空白距離，拖曳中間的控制點可以調整高度
分隔線：在兩個區塊之間加一條水平線，可選擇實線、虛線、雙線等樣式

輪播元件（Image Carousel）

輪播就是圖片自動輪播的效果。點擊輪播元件後：

新增圖片：點擊「新增圖片」從媒體庫選擇
調整順序：拖曳圖片縮圖來排序
刪除圖片：將滑鼠移到縮圖上，點擊 X

在「進階設定」中可以調整自動播放速度和是否顯示導航箭頭。

圖片庫元件（Gallery）

適合展示多張圖片的作品集或商品圖。操作方式：

新增圖片：點擊「新增」從媒體庫批次選擇多張圖片
版面配置：可選擇網格（Grid）或瀑布流（Masonry）排列
欄數：選擇每行顯示幾張圖（2-6 欄）

手風琴元件（Accordion）

手風琴是「點擊標題展開內容」的效果，常用於 FAQ 或服務說明。

修改項目：點擊左側面板中的項目即可編輯標題和內容
新增項目：點擊「新增項目」
調整順序：拖曳項目上下排列
刪除項目：點擊項目右側的 X

分頁元件（Tabs）

分頁是「點擊不同標籤切換內容」的效果。操作方式和手風琴幾乎一樣，只是呈現方式不同。

常見用途：不同服務方案的比較、不同尺寸的規格說明等。

切換裝置預覽

Elementor 底部工具列有三個裝置圖示，點擊即可切換：

桌面（螢幕圖示）：預覽電腦版畫面
平板（平板圖示）：預覽平板裝置畫面
手機（手機圖示）：預覽手機版畫面

針對不同裝置調整設定

當你在設定字體大小、間距等數值時，會看到旁邊有個小裝置圖示。點擊它就能針對不同裝置設定不同的值。

例如：標題在電腦版設定 36px，在手機版可以改為 24px，讓手機螢幕不會太擠。

在特定裝置上隱藏元素

有些元素只適合在電腦版顯示（例如大型裝飾圖片），在手機版可以隱藏：

1. 選取要隱藏的元素
2. 左側面板切換到「進階」頁籤
3. 找到「響應式」區塊
4. 開啟「在手機上隱藏」選項

全域顏色（Global Colors）

全域顏色就是你網站的「品牌色彩」。筠澗設計在建站時已經設定好了。

當你在任何元件中選擇顏色時，會看到一排預設的色彩圓圈 — 這些就是全域顏色。使用全域顏色的好處是：如果以後要統一更換品牌色，只要改一處全站就會同步更新。

全域字型（Global Fonts）

和全域顏色同理，全域字型控制了整個網站的字體風格。

在設定排版（Typography）時，選擇「Primary」「Secondary」等預設選項，就是使用全域字型。

儲存為模板

如果你做了一個很棒的 Section，想在其他頁面重複使用：

1. 右鍵點擊 Section → 選擇「另存為模板」
2. 取一個容易辨識的名字
3. 在其他頁面點擊「新增模板」→「我的模板」就能找到並插入

進入 Theme Builder

頁首（Header）和頁尾（Footer）是出現在每一頁的共用元素。要編輯它們：

左側選單點擊「範本 → Theme Builder」，你會看到網站各部分的範本列表，找到「Header」或「Footer」點擊編輯。

修改頁首（Header）

頁首通常包含：Logo 圖片、導覽選單、聯絡按鈕。

更換 Logo：點擊 Logo 圖片元件 → 內容 → 點擊圖片更換
修改選單：點擊選單元件 → 內容 → 選擇要顯示的選單（在 CH09 中管理）
修改按鈕：點擊按鈕 → 修改文字和連結

修改頁尾（Footer）

頁尾通常包含：公司資訊、聯絡方式、社群連結、版權聲明。

編輯方式和一般頁面完全相同，修改文字和連結即可。修改完記得點「更新」，變更會自動套用到全站所有頁面。

查看表單提交紀錄

你的網站使用的表單外掛會在左側選單中有專屬區域。常見的有 Contact Form 7 或 WPForms。

進入表單外掛的選單，找到「提交紀錄」或「Entries」，就能看到所有訪客提交的表單資料。

編輯表單

在表單列表中點擊表單名稱即可進入編輯畫面。你可以：

新增欄位：拖曳或點擊新增不同類型的欄位（文字、Email、下拉選單、核取方塊等）
修改欄位：點擊現有欄位可以修改標籤文字、是否必填等
刪除欄位：點擊欄位右上角的刪除圖示

設定通知信

表單提交後，系統會寄通知信到指定的 Email。在表單設定中找到「通知」或「Notifications」頁籤，可以設定：

收件人 Email：表單提交後通知寄到哪裡
郵件主旨：通知信的標題
郵件內容：可以包含表單欄位的變數

找到 Rank Math SEO 欄位

當你在編輯文章或商品頁面時，往下滾動到內容區下方，你會看到「Rank Math SEO」的區塊。如果沒看到，點擊頁面右上方的「Rank Math」圖示展開。

這裡有三個你必須填的欄位，每次發文或上架商品都要花 2 分鐘填好。

填寫 SEO 標題（Title Tag）

這是什麼？就是你的頁面在 Google 搜尋結果中顯示的標題。

怎麼寫？「核心關鍵字 + 補充說明 | 品牌名」，控制在 30 個字以內。

填寫 SEO 描述（Meta Description）

這是什麼？Google 搜尋結果中，標題下方的灰色說明文字。

怎麼寫？50-70 個字，說明頁面內容 + 一句行動呼籲。

範例：「婚禮最驚喜的一刻！趣球職人提供專業爆破氣球特效，客製化設計，歡迎 LINE 諮詢。」

設定社群分享圖（OG Image）

這是什麼？當別人在 LINE 或 Facebook 分享你的頁面連結時，會顯示的預覽圖片。

在 Rank Math 的「Social」頁籤中可以設定 OG Image。建議使用 1200x630px 的圖片。

如果不設定，系統會自動使用精選圖片，但最好還是手動設定一張專用的分享圖。

找到備份外掛

筠澗設計已為你的網站安裝備份外掛，在左側選單中找到對應項目（通常是 WPvivid 或 UpdraftPlus）。

手動備份

在做任何重大修改前（例如更新外掛、修改頁面結構），建議先手動備份一次。

點擊「立即備份」或「Backup Now」按鈕，等待備份完成。完成後可以在備份列表中看到剛才的備份檔案。

從備份還原（緊急時使用）

如果網站出了嚴重問題，可以從備份還原到之前的狀態：

1. 找到備份列表中你要還原的那一筆
2. 點擊「還原」按鈕
3. 確認還原範圍（通常選全部還原）
4. 等待還原完成

什麼需要更新？

WordPress 生態系有三種東西會定期更新：

WordPress 核心：WordPress 本體
外掛（Plugins）：網站功能擴充
佈景主題（Theme）：網站外觀框架

當有更新可用時，左側選單會出現紅色數字提醒。

安全更新步驟

更新前請遵循以下步驟：

1. 先備份（回顧 CH20）
2. 前往「儀表板 → 更新」
3. 一次只更新一個：先更新外掛，確認網站正常後再更新佈景主題
4. 每更新一項就到前台瀏覽一下，確認網站沒壞掉
5. 如果更新後網站出問題，立即還原備份並聯繫筠澗設計

確認自動備份排程

筠澗設計已為你的網站設定自動備份排程（通常是每天或每週自動備份一次）。

進入備份外掛的「排程」或「Schedule」設定，確認以下項目：

備份頻率：建議至少每週一次
保留份數：建議保留最近 5-10 份
備份範圍：應包含「資料庫 + 檔案」完整備份

下載備份到本機

建議每月至少下載一次備份到你的電腦或雲端硬碟保存，以防萬一主機出問題：

1. 進入備份列表
2. 找到最新的備份
3. 點擊「下載」按鈕
4. 儲存到你的電腦（建議建一個「網站備份」資料夾）

影響網站速度的常見原因

圖片太大：這是最常見的原因。手機拍的原圖動輒 5-10MB，嚴重拖慢載入速度
外掛太多：每個外掛都會載入額外的程式碼
嵌入太多外部資源：例如嵌入了很多 YouTube 影片或社群貼文

你可以自己做的優化

1. 上傳圖片前先壓縮：用 TinyPNG（tinypng.com）壓縮到 500KB 以下
2. 圖片寬度不超過 1920px：不需要上傳超高解析度的原圖
3. 不要自行安裝額外外掛：有需求先和筠澗設計討論
4. 不要在頁面上嵌入太多影片：如果需要放多個影片，考慮使用影片連結清單而非全部嵌入

初步判斷

網站出問題時，先做以下確認：

緊急聯繫筠澗設計

聯繫時請提供：

1. 問題的截圖
2. 你最後做了什麼操作（例如：更新了某個外掛）
3. 問題出現的時間
4. 是所有頁面都有問題還是只有特定頁面

提供越詳細的資訊，我們越能快速為你解決問題。

登入 GA4

在瀏覽器輸入 analytics.google.com，用你的 Google 帳號登入。登入後選擇你的網站資源，就會看到數據總覽頁面。

重要指標說明

查看流量來源

左側選單點擊「報表 → 流量開發 → 流量獲取」，可以看到訪客從哪裡來的：

認識 Search Console

Google Search Console（簡稱 GSC）是 Google 官方提供的免費工具，讓你知道：

1. 你的網站在 Google 搜尋結果中出現了幾次
2. 有多少人點進來
3. 是搜尋什麼關鍵字找到你的
4. 你的哪些網頁被 Google 收錄了

前往 search.google.com/search-console 登入你的 Google 帳號。

查看搜尋成效

左側選單點擊「成效」，可以看到四個關鍵指標：

曝光次數：你的網頁在搜尋結果中出現了幾次
點擊次數：有多少人實際點進來
平均點閱率（CTR）：曝光中有多少比例被點擊
平均排序：你的網頁通常出現在搜尋結果的第幾名

確認收錄狀態

左側選單點擊「索引 → 網頁」，可以看到 Google 已收錄和未收錄的網頁數量。

如果你新發布了文章，可以在上方的搜尋列輸入該網頁的網址，查看是否已被收錄。如果尚未收錄，可以點擊「要求建立索引」加速收錄。

SEO 文章的基本結構

一篇對搜尋引擎友善的文章應該包含：

標題（H1）：包含主要關鍵字，吸引人點擊
開頭段落：前 100 字就帶到關鍵字，告訴讀者這篇文章在講什麼
小標題（H2/H3）：將文章分成清楚的段落，每個小標題盡量包含相關關鍵字
內容：字數建議 800-1500 字以上，提供有價值的資訊
結尾：行動呼籲（例如「歡迎 LINE 諮詢」「立即預約」）

關鍵字使用技巧

主要關鍵字：文章的核心主題（例如「婚禮氣球佈置」），在標題、開頭、結尾各出現一次
相關關鍵字：延伸的詞彙（例如「婚禮佈置推薦」「氣球拱門」），自然融入內容中
長尾關鍵字：更具體的搜尋詞（例如「台北婚禮氣球佈置推薦」），可以作為小標題

發布文章前的 SEO 檢查清單

嵌入 YouTube 影片

最簡單的方式是在文章或 Elementor 中使用「影片」元件：

1. 在 YouTube 打開要嵌入的影片
2. 複製影片的網址（例如 https://www.youtube.com/watch?v=xxxxx）
3. 在 Elementor 中拖入「影片」元件
4. 將網址貼上到「連結」欄位

在文章編輯器中更簡單 — 直接貼上 YouTube 網址，WordPress 會自動嵌入影片。

嵌入 Instagram 貼文

1. 在 Instagram 打開要嵌入的貼文
2. 點擊貼文右上角的三個點（...） → 選擇「嵌入」
3. 複製嵌入代碼
4. 在 Elementor 中使用「HTML」元件，把代碼貼上

嵌入 Facebook 貼文

方式和 Instagram 類似：

1. 在 Facebook 打開貼文
2. 點擊右上角的三個點 → 選擇「嵌入」
3. 複製嵌入代碼
4. 在 Elementor 中使用「HTML」元件貼上