從草稿開始設計電子郵件

瞭解如何掌握電子郵件內容版本。 使用電子郵件設計工具，您可以建立電子郵件和範本，不論是否使用您自己預先定義的內容。

以下是使用電子郵件設計工具從頭開始建立和設計電子郵件內容的主要步驟：

  1. 建立電子郵件並開啟其內容。
  2. 新增結構元件以塑造電子郵件。 請參閱編輯電子郵件結構。
  3. 在結構元件中插入內容元件和片段。 請參閱新增片段和內容元件。
  4. 新增影像並編輯電子郵件的文字。 請參閱插入影像。
  5. 新增個人化欄位、連結等，以個人化您的電子郵件。 請參閱插入個人化欄位、插入連結和定義電子郵件中的動態內容。
  6. 定義您電子郵件的主旨行。 請參閱個人化電子郵件的主旨行。
  7. 預覽您的電子郵件.
  8. 儲存您的內容，並在確定您已定義對象並正確排程傳送後繼續處理訊息。

您也可以查看此簡介影片。

注意

為避免從頭開始設計電子郵件內容，您可以使用現成可用的內容範本。 如需詳細資訊，請參閱內容範本。

定義電子郵件結構

電子郵件設計工具可讓您輕鬆定義電子郵件的結構。 透過使用簡單的拖放動作新增和移動結構元素，您可以在數秒內設計電子郵件的形狀。

要編輯電子郵件的結構：

  1. 開啟現有內容或建立新的電子郵件內容。

  2. 選擇左側的​+​表徵圖以訪問​Structure components。

  3. 拖放您塑造電子郵件形狀所需的結構元件。

    在放置結構元件之前，藍線會實體化其確切位置。 您可以將它放在任何其他元件之上、之間或之下，但不能放在內部。

    注意

    請注意，欄堆並不與所有電子郵件程式相容。 不支援時，不會堆疊欄。

    一旦置入電子郵件中，您就無法移動或移除元件，除非其中已有內容元件或片段。

  4. 多個由一個或多個列組成的結構元件可用。

    選擇​n:n column​元件以定義您選擇的欄數（介於3和10之間）。 您也可以移動每欄底部的箭頭來定義每欄的寬度。

    注意

    每個列大小不能低於結構元件總寬度的10%。 您無法刪除非空的欄。

定義結構後，您就可以將內容片段和元件新增至電子郵件。

使用前標

前置標題是從收件匣檢視電子郵件時，主旨行後面的簡短摘要文字。 預報頭可提供較高的開放率。

選擇​Preheader​編輯框並完成內容。

您可以在前標內容中添加​Content block、Dynamic content​或​Personalization fields。

注意

請注意，預先標題與所有電子郵件程式不相容。 不支援時，將不會顯示預先標題。

使用內容元件

內容元件是原始的空白元件，放入電子郵件後，您就可以編輯這些元件。

您可以在結構元件中新增任意數量的內容元件。 也可將它們在結構元件內或移動到另一個結構元件。

以下是「電子郵件設計器」中可用元件的清單：

Button

如果您需要使用多個按鈕，而不是從頭開始編輯每個按鈕，則可以使用上下文工具欄複製​Button​元件。

您也可以將按鈕儲存至可重複使用的片段。 如需詳細資訊，請參閱「建立內容片段](…/…/designing/using/using-reusable-content.md#creating-a-content-fragment)」和「將內容儲存為片段](…/…/designing/using/using-reusable-content.md#saving-content-as-a-fragment)」。[[

選擇​Fallback view​以在電子郵件設計器中顯示備用影像。

Text

使用此元件在您的電子郵件中插入文字。 您可以調整​Component Settings​中文字的顏色、樣式和大小。

Divider

使用此元件在電子郵件中插入分界線。 可以在​Component Settings​中選擇分行的顏色、樣式和大小。

HTML

使用此元件可複製並貼上現有HTML的不同部分。 這可讓您建立免費的模組化HTML元件。

注意

免費的HTML元件可以編輯，但選項有限。 如果未插入所有樣式，請務必在HTML程式碼的​head​區段中新增正確的CSS，否則電子郵件將無法回應。 使用​Preview​按鈕測試內容的回應速度（請參閱預覽訊息）。

為了讓外部內容與電子郵件設計人員相容，Adobe建議從頭開始建立訊息，並將內容從您現有的電子郵件複製到片段和元件。

當您有無法重新建立的內容時，可以使用​Html​內容元件，從原始電子郵件複製並貼上HTML程式碼。 繼續之前，請務必熟悉HTML。

注意

新內容不會是原始電子郵件的完整副本，但下列步驟會引導您建立盡可能接近的訊息。

複製內容之前

  1. 在原始電子郵件中，從您要傳送的每封電子郵件中識別可重複使用的區段。
  2. 儲存您要使用的所有影像和資產。
  3. 如果您熟悉HTML，請將原始HTML內容分割為不同的部分。

視頻

將視訊元件插入電子郵件的結構元件，並在​Component Settings​中輸入視訊連結。

注意

請注意，視訊與所有電子郵件程式不相容。 不支援時，將會顯示備援。

影像

使用此元件將影像插入您的電子郵件中。

將影像元件插入結構元件，然後按一下「瀏覽」，從電腦上傳影像檔案。

Social

使用此元件，在電子郵件中插入社交媒體頁面的連結。 您可以選取要顯示的連結，以及​Component Settings​中其圖示的大小。

  1. 將​Carousel​元件拖放至結構元件內。

  2. 瀏覽以從您的電腦選取影像。

  3. 在​Settings​窗格中，設定您要在轉盤中的縮圖數。

  4. 從您的電腦選擇備援影像。

轉盤元件與所有電子郵件程式不相容。 當電子郵件不支援轉盤時，上傳備援以顯示影像。

注意

轉盤元件與下列電子郵件平台相容：Apple Mail 7、Apple Mail 8、Outlook 2011 for Mac、Outlook 2016 for Mac、Mozilla Thunderbird、iPad和iPad mini iOS、iPhone iOS、Android、AOL（Chrome、Firefox和Safari）。

相關主題：

本頁內容