撰寫內容

Markdown 和 HTML 格式

DevSite 上的大部分內容都是以 Markdown 撰寫，這種撰寫格式的設計宗旨是簡潔易讀，DevSite 會自動將 Markdown 轉換為 HTML，以便在網路上顯示。

如要瞭解常見 HTML 元素的 Google 專屬 Markdown 對等項目，請使用 go/g3mark-cheat 的快速參考表。如要查看 Google Markdown (也稱為 CommonMark) 的完整說明文件，請按這裡。

範例如下：

何時該使用 HTML 而非 Markdown

我們不會使用 Markdown 撰寫特定項目，包括：

• 加入檔案：所有加入的檔案都應為 HTML 檔案，因此不應包含以 Markdown 撰寫的任何元素。如需建立 include 檔案的指引，請參閱「在多個網頁中重複使用內容」。

• 表格：Markdown 表格難以設定格式和維護，因此即使在 Markdown 檔案中，我們也會使用 HTML 處理表格。

• 圖片：使用 HTML 圖片可更靈活地調整圖片格式和刊登位置。請參閱 DevSite 發布指南中的「圖片」一節。

• Zippies：Zippies (又稱 Devsite 上的可展開小工具) 必須以 HTML 格式呈現，並以 <div> 標記包裝。

常見內容格式

在新分頁中開啟的連結

請參閱連結指南，瞭解何時應在同一分頁中開啟連結，何時應在新分頁中開啟連結。如需在新分頁中開啟連結，可以透過下列方式設定連結格式：

Markdown

[Accessible content](/style/accessibility){:target="_blank"} 

HTML

<a href="/style/accessibility" target="_blank">Accessible content</a>

表格

如要瞭解 DevSite 提供的表格類型及其對應的 HTML，請參閱「表格」的 DevSite 發布指南。

提示：

• 如要讓表格沒有邊框，請使用 class="columns"

• 如果表格需要有邊框間距和分隔線 (如這個網頁)，請使用 class="columns extra-padding"，並在內容列之間的分隔列使用 <hr> 標記。

可展開的章節

在 Workspace 中，我們使用 arrow-icon 類別設定壓縮檔的樣式。以下是 Workspace 的 zippy (可展開的小工具) 範例：

<div>
  <devsite-expandable class="arrow-icon" id="UNIQUE_ZIPPY_ID">
    <h4 class="showalways">ZIPPY_HEADING</h4>
    <div>
      YOUR_CONTENT
    </div>
  </devsite-expandable>
</div>

如要使用這個範例，請替換下列變數：

• UNIQUE_ZIPPY_ID：輸入說明性且獨一無二的 ID，以便直接指向 zippy，例如 direct-admin-access。
• ZIPPY_HEADING：輸入使用者在展開壓縮內容前應看到的文字。
• YOUR_CONTENT：輸入使用者展開手風琴時應看到的內容。

如要進一步瞭解 DevSite 的可展開小工具，請參閱 DevSite 發布指南「小工具：可展開」。

包含共用內容

如要在多個頁面重複使用內容，可以使用 include，這是 DevSite 版本的 Composer，可在多篇文章中使用程式碼片段。

如需建立 include 檔案及在內容中使用 include 的相關指引，請參閱「在多個頁面重複使用內容」。

在標題中新增自訂錨點

DevSite 會為每個標題建立 HTML ID 屬性。為確保標題變更時的一致性，您可以在標題文字旁新增 {:#your-id}，為標題加入自訂錨點 ID，例如：

## Apply filters to your search results {:#apply-filters}

提示：如要為檔案中的所有標題自動建立自訂錨點 ID，請按 Command (\⌘) + H 鍵 (Windows 上為 Ctrl + H 鍵)。現有的自訂錨點 ID 不會變更。

詳情請參閱 DevSite 的標題 ID 發布指南。