編輯純文字、HTML和行動電子郵件格式

電子郵件設計工具可讓您編輯數個轉譯電子郵件。 您可以產生電子郵件的文字版本、編輯電子郵件的HTML來源,並設計行動裝置檢視的電子郵件。

生成電子郵件的文本版本

依預設,會自動產生您電子郵件的​Plain text​版本,並與​Edit​版本同步。

新增至HTML版本的個人化欄位和內容區塊也會與純文字版本同步。

注意

若要在純文字版本中使用內容區塊,請確定它們不包含HTML程式碼。

要使純文字檔案版本與HTML版本不同,可以通過從電子郵件的​Plain text​視圖按一下​Sync with HTML​開關來禁用此同步。

然後,您可以視需要編輯純文字版本。

注意

如果在禁用同步時編輯​Plain text​版本,則下次啟用​Sync with HTML​選項時,在純文字檔案版本中所做的所有更改都將替換為HTML版本。 在​Plain text​檢視中所做的變更無法反映在​HTML​檢視中。

在HTML中編輯電子郵件內容來源

對於最進階的使用者和除錯,您可以直接在HTML中檢視和編輯電子郵件內容。

您有兩種方式可編輯HTML版本的電子郵件:

  • 選擇​Edit > HTML​以開啟整個電子郵件的HTML版本。

  • 從WYSIWYG介面中,選擇一個元素並按一下​Source code​表徵圖。

    只顯示所選元素的源。 如果所選元素是​HTML​內容元件,則可以編輯原始碼。 其他元件則為唯讀模式,但仍可在電子郵件的完整HTML版本中編輯。

如果您修改程式碼的HTML,電子郵件的回應速度可能會中斷。 請務必使用​Preview​按鈕來測試它。 請參閱「預覽訊息」。

設計行動轉換電子郵件

您可以個別編輯行動顯示的所有樣式選項,以微調電子郵件的互動式設計。 例如,您可以調整邊界和填補空白、使用較小或較大的字型大小、變更按鈕,或套用行動版電子郵件專用的不同背景顏色。

所有樣式選項都可在行動裝置檢視中使用。 「電子郵件設計器」樣式設定先前會顯示在此頁面。

  1. 建立電子郵件並開始編輯內容。 如需詳細資訊,請參閱從頭設計電子郵件內容

  2. 要訪問專用的移動視圖,請選擇​Switch to mobile view​按鈕。

    隨即顯示電子郵件的行動版本。 它包含案頭檢視中定義的所有元件和樣式。

  3. 獨立編輯所有樣式設定,例如背景顏色、對齊、填補、邊界、字型系列、文字顏色等。

  4. 在行動檢視中編輯任何樣式設定時,修改僅會套用至行動顯示。

    例如,縮小影像大小、新增綠色背景並變更行動檢視中的間距。

  5. 您可以在行動裝置上顯示元件時隱藏元件。 要執行此操作,請從​Display options​中選擇​Show only on desktop devices

    您也可以選擇在桌上型裝置上隱藏此元件,這表示此元件只會顯示在行動裝置上。 要執行此操作,請選擇​Show only on mobile devices

    例如,此選項可讓您在行動裝置上顯示特定影像,在桌上型裝置上顯示其他影像。

    您可以從行動裝置或案頭檢視設定此選項。

  6. 再次按一下​Switch to mobile view​按鈕返回標準案頭視圖。 您剛做的樣式變更不會反映在內。

    注意

    唯一的例外是​Style inline​設定。 任何樣式內嵌設定變更也會套用至標準案頭檢視。

  7. 任何對電子郵件結構或內容的其他變更,例如文字編輯、上傳新影像、新增元件等。 也會套用至標準檢視。

    例如,切換回行動裝置檢視、編輯部分文字並取代影像。

  8. 再次按一下​Switch to mobile view​按鈕返回標準案頭視圖。 會反映變更。

  9. 移除行動檢視中的樣式會帶您回到案頭模式中套用的樣式。

    例如,在行動裝置檢視中,將綠色背景顏色套用至按鈕。

  10. 切換至案頭檢視,並將灰色背景套用至相同的按鈕。

  11. 再次切換至行動檢視,現在停用​Background color​設定。

    案頭檢視中定義的背景顏色現在會套用:會變成灰色(而非空白)。

    唯一的例外是​Border color​設定。 在行動檢視中停用時,即使在案頭檢視中定義了邊框色彩,也不會再套用邊框。

注意

片段中不提供行動檢視。

本頁內容

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now