使用現有內容進行設計

選取現有內容

Adobe Campaign隨附一組預先定義的內容，可協助您快速上手。 您可以使用其中一個，或者，如果您要傳送的訊息內容是在Adobe Campaign以外準備，則可從電腦或URL匯入。

建立電子郵件或登錄頁面時，您可以選擇從其他來源載入現有內容。

注意

下圖顯示如何使用 電子郵件設計工具.

  1. 建立電子郵件或登錄頁面後，請開啟其內容。

  2. 按一下首頁圖示以存取 Email Designer 首頁。

  3. 選取要載入的內容來源：

  4. 載入內容。 選取的內容會取代目前的內容。

    匯入後，即可編輯和個人化內容。

    注意

    此 電子郵件設計工具 使用特定標籤。 上傳至Campaign的標準HTML內容必須符合預期的標籤，才能完全相容並可從電子郵件設計工具編輯。 若不相符，系統會將您的內容上傳至 相容模式. 若要讓現有內容相容，請參閱 本節.

相關主題：

使用電子郵件設計工具編輯現有內容

充分利用 電子郵件設計工具，您上傳的HTML必須包含特定標籤，使其符合WYSIWYG編輯器。

如果HTML的全部或部分沒有此標籤，則內容會載入到「 相容模式'。

若要讓電子郵件設計工具中的現有外部內容完全可編輯，請參閱 使用現有內容設計電子郵件 區段。

匯入現有的電子郵件內容

從檔案匯入內容

從電子郵件設計工具首頁，按一下 Upload 按鈕，從電腦上傳檔案，然後確認。

zip檔案結構沒有限制。 但是，引用HTML檔案必須是相對的，並且要遵守zip資料夾的樹結構。

匯入支援下列格式：

  • 具有合併樣式表的HTML檔案
  • 包含HTML檔案、樣式表(.CSS)和影像的.zip資料夾
注意

對於電子郵件內容，建議您以整合的樣式表匯入單一HTML檔案。

從URL匯入內容

從URL匯入內容之前，請確定它遵循下列要求：

  • 內容必須可透過此URL公開使用。

  • 基於安全考量，僅URL開頭為 https 中指定的規則。

  • 請確定所有資源（影像、CSS）都是在絕對連結和HTTPS中設定。 否則，傳送電子郵件後，將會顯示沒有其資源的鏡像頁面。 以下是絕對連結定義的範例：

    <a href="https://www.mywebsite.com/images/myimage.png">
注意

從URL載入內容僅適用於電子郵件通道。

若要從URL擷取現有內容，請遵循下列步驟：

  1. 從電子郵件設計工具首頁中，選取 Import from URL 按鈕。

  2. 定義要從中擷取內容的URL。

  3. 按一下​Confirm。

在影片中探索此功能.

提供其他Campaign Standard作法影片 此處.

準備時自動從URL擷取內容

在郵件準備期間從URL匯入內容可讓您在每次準備電子郵件時擷取最新的HTML內容。 這樣，循環電子郵件的內容在傳送時一律為最新。 此功能也可讓您建立排程在特定日期的訊息，即使內容尚未就緒亦然。

若要在準備時擷取內容，請遵循下列步驟：

  1. 選取 Content imported during preparation 選項。

  2. URL內容在編輯器中顯示為唯讀。

    注意

    在此步驟中，不應將內容編輯器中顯示的HTML納入考量。 會在準備階段擷取。

  3. 若要預覽已擷取的URL內容，請在建立訊息後開啟訊息，然後按一下 Preview 按鈕。

您可以個人化將從中擷取內容的遠端URL。 要執行此操作，請遵循下列步驟：

  1. 按一下畫面上方的電子郵件標籤，以存取電子郵件設計工具 Properties 標籤。

  2. 尋找 Remote URL 欄位。

  3. 插入所需的個人化欄位、內容區塊或動態文字。

    此 Current date - YYYYMMDD 例如，內容區塊可讓您插入日期。

    注意

    可用的個人化欄位會連結至 傳送 僅屬性（電子郵件建立日期、狀態、促銷活動標籤……）。

如果內容下載在第一次嘗試時失敗，可能會重試兩次：

  1. 第二次嘗試在第一次嘗試後開始50毫秒。
  2. 第三次嘗試在第二次嘗試後100毫秒開始。

這些重試在下列情況中很實用：

  • 遠程伺服器上的短時服務故障
  • 群集上的伺服器故障，在這種情況下，由於對工作伺服器進行負載平衡，重試更有可能成功

相容性模式

上傳內容時，必須包含特定標籤，才能與電子郵件設計工具的WYSIWYG編輯器完全相容且可編輯。

如果上傳HTML的全部或部分不符合預期的標籤，則內容會以「相容模式」載入，這會限制透過UI進行版本的可能性。

以相容模式載入內容時，您仍可透過介面執行下列修改（隱藏不可用的動作）:

  • 變更文字或變更影像
  • 插入連結和個人化欄位
  • 在所選HTML塊上編輯一些樣式選項
  • 定義條件式內容

其他修改（例如新增區段至您的電子郵件或進階樣式）必須透過HTML模式，直接在電子郵件的原始碼中完成。

如需將現有電子郵件轉換為與電子郵件設計工具相容的電子郵件的詳細資訊，請參閱 本節.

相關主題：

轉換HTML內容

如果您想要建立模組化範本和片段的架構，可結合以在多封電子郵件中重複使用，您應考慮將電子郵件HTML轉換為電子郵件設計工具範本。

此使用案例提供將HTML電子郵件轉換為電子郵件設計工具元件的快速方式。

注意

本節適用於熟悉HTML程式碼的進階使用者。

注意

與相容性模式一樣，HTML元件也是可編輯的，有限的選項有：您只能執行就地版本。

在電子郵件設計工具外部，確定原始HTML分為可重複使用的區段。

如果情況並非如此，請從HTML中切出不同的區塊。 例如：

<!-- 3 COLUMN w/CTA (SCALED) -->
<table width="100%" align="center" cellspacing="0" cellpadding="0" border="0" role="presentation" style="max-width:680px;">
<tbody>
<tr>
<td class="padh10" align="center" valign="top" style="padding:0 5px 20px 5px;">
<table width="100%" cellspacing="0" cellpadding="0" border="0" role="presentation">
<tbody>
<tr>
...
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<!-- //3 COLUMN w/CTA (SCALED) -->

識別所有區塊後，在電子郵件設計工具中，對現有電子郵件的每個區段重複下列程式：

  1. 開啟「電子郵件設計工具」以建立空白的電子郵件內容。

  2. 設定內文層級屬性：背景顏色、寬度等。 如需詳細資訊，請參閱編輯電子郵件樣式。

  3. 新增結構元件。 如需詳細資訊，請參閱「編輯電子郵件結構」。

  4. 新增HTML元件。 如需詳細資訊，請參閱「新增片段及元件」。

  5. 將您的HTML複製並貼到該元件中。

  6. 切換至行動檢視。 如需詳細資訊，請參閱本節。

    回應式檢視因您的CSS遺失而中斷。

  7. 若要修正此問題，請切換至原始碼模式，並將樣式區段複製並貼到新樣式區段中。 例如：

    <style type="text/css">
a {text-decoration:none;}
body {min-width:100% !important; margin:0 auto !important; padding:0 !important;}
img {line-height:100%; text-decoration:none; -ms-interpolation-mode:bicubic;}
...
</style>
    注意

    請務必在另一個自訂樣式標籤中，於此之後新增您的樣式。

    請勿修改電子郵件設計工具產生的CSS:

    • <style data-name="default" type="text/css">(##)</style>
    • <style data-name="supportIOS10" type="text/css">(##)</style>
    • <style data-name="mediaIOS8" type="text/css">(##)</style>
    • <style data-name="media-default-max-width-500px" type="text/css">(##)</style>
    • <style data-name="media-default--webkit-min-device-pixel-ratio-0" type="text/css">(##)</style>

  8. 返回行動檢視，檢查您的內容是否正確顯示並儲存您的變更。

本頁內容