# 自訂你的狀態頁

Source: https://instatus.com/help/zh-tw/status-page/customize

你可以在**狀態頁**設定中修改狀態頁的標誌、顏色、頁首設計、深色模式、語言、日期格式與社群預覽，並加入自訂的 HTML、CSS 與 JavaScript。

| At a glance | Details |
| :-- | :-- |
| [品牌](https://instatus.com/help/zh-tw/status-page/customize#如何加上我的標誌與顏色) | 標誌、深色模式標誌、網站圖示、品牌與狀態顏色 |
| [設計](https://instatus.com/help/zh-tw/status-page/customize#如何修改設計或深色模式) | 3 種頁首設計、深色或淺色模式、元件版面 |
| [自訂程式碼](https://instatus.com/help/zh-tw/status-page/customize#可以加入自訂的-htmlcss-或-javascript-嗎) | 可在 5 個位置加入 HTML、CSS 與 JavaScript |
| [語言](https://instatus.com/help/zh-tw/status-page/customize#如何修改狀態頁的語言) | 預設語言，Pro 方案支援多語言 |
| [時間軸](https://instatus.com/help/zh-tw/status-page/customize#如何修改日期時間與時區格式) | 日期與時間格式、時區、開始日期 |
| [搜尋與社群](https://instatus.com/help/zh-tw/status-page/customize#如何控制-google-與社群媒體上的預覽) | 預覽用的標題、說明與圖片 |

## 如何加上我的標誌與顏色？

在 [instatus.com/login](https://dashboard.instatus.com/login) 登入，選擇你的狀態頁，然後前往**狀態頁 → 外觀樣式**。

在品牌區塊中你可以修改：

- 品牌標誌，包含深色模式專用的標誌。
- 網站圖示。
- 與標誌搭配的品牌顏色。
- 狀態顏色。

自訂完成後點擊**儲存**，你的頁面就會更新。

![品牌設定](https://instatus.com/help/customize/1.png)

## 如何修改設計或深色模式？

在**外觀樣式**的設計區塊中你可以修改：

- 頁首設計，可從我們的 3 種設計中選擇。
- 狀態頁要以深色模式、淺色模式顯示，還是提供按鈕讓訪客切換。
- 元件的顯示方式。

變更設計後點擊**儲存**，你的頁面就會更新。

![外觀樣式設定](https://instatus.com/help/customize/2.png)

## 可以加入自訂的 HTML、CSS 或 JavaScript 嗎？

可以。在**狀態頁 → HTML** 中，你可以在五個位置插入自己的 HTML、CSS 與 JavaScript：

- 狀態頁頁首上方。
- 頁首下方。
- 狀態頁元件下方。
- 狀態頁頁尾上方。
- 頁尾下方。

加入自訂 HTML 後點擊**儲存**，你的頁面就會更新。

![自訂 HTML 設定](https://instatus.com/help/customize/3.png)

## 如何修改狀態頁的語言？

在**狀態頁 → 語言**中你可以修改：

- 狀態頁的預設語言。

**Pro 方案功能：**

- 多語言狀態頁。
- 使用你自訂的語言。

設定多語言的逐步指南請見我們的
[多語言支援](https://instatus.com/help/zh-tw/status-page/multi-language)文章。

![語言設定](https://instatus.com/help/customize/4.png)

變更狀態頁語言後點擊**儲存**，你的頁面就會更新。

## 如何修改日期、時間與時區格式？

在**狀態頁 → 時間軸**中你可以修改：

- 日期與時間格式，[可以在這裡了解更多日期與時間格式](https://date-fns.org/v2.16.1/docs/format)。
- 時區。
- 服務開始日期。

變更狀態頁的日期與時間後點擊**儲存**，你的頁面就會更新。

![日期與時間格式設定](https://instatus.com/help/customize/5.png)

## 如何控制 Google 與社群媒體上的預覽？

在**狀態頁 → 搜尋與社群**中你可以設定：

- 修改標題。
- 為 Google 與社群媒體加上自訂說明。
- 上傳圖片。

自訂搜尋與社群設定後，點擊**儲存**讓變更生效。

![搜尋與社群設定](https://instatus.com/help/customize/6.png)

- [多語言支援](https://instatus.com/help/zh-tw/status-page/multi-language): 了解如何讓狀態頁支援多種語言。
