知識庫首頁 aero-right 編輯器區塊

郵件區段和區塊

編輯郵件時可以加入新的區段,並重新排列區塊位置。區段用來新增郵件內的欄位,區塊則是新增內容,像是圖片、文字,或按鈕。我們的客戶非常喜歡拖曳式編輯器,因為它能輕鬆又快速設計郵件。 本篇討論的主題: 區段  新 全局設定 區塊 郵件範例 新 詞彙表 包含如何使用區塊內的「設置」標籤。       區段   區段是編輯器內用來設置郵件版型的功能。區段可以分隔郵件內容,作為區塊內容的一個容器。您可以新增或刪除區段,設置郵件版型,並且針對每封郵件設定不同的區段。   區段的設定如下: 加號選項提供五種不同的欄位種類可以新增到郵件版型。郵件可以新增的區段數量沒有限制。 區段類型有: 一欄 兩欄 三欄 兩欄,左側邊欄 兩蘭,右側邊欄 鉛筆可以開啟特定區塊的樣式設定。您可以指定背景顏色以及整個區段的邊界。如果使用多個欄位的區段,您也可以針對每一個欄位設定。 點擊區段內任何地方也可以開啟區段樣式設定。 注意,內容可以在區塊設定內單獨設定。 上下箭頭可以設定整封郵件內的區段順序。 頁首區段跟頁尾區段無法往上或往下移動。其他區段不能放在頁首區段上方,也不能放在頁尾區段的下方。 包含訂閱連結的頁尾區塊可以調整位置到郵件的任何一個地方;但是,我們建議您將這個區塊放在郵件的頁尾。把頁尾區塊放在郵件的頁尾,訂閱用戶可以輕鬆取消訂閱或管理他們的郵件偏好。 垃圾桶用途是刪除區段。只要刪除區段會連同先前新增的內容(像是區塊或樣式)一起刪除。刪除選項無法復原。為了避免遺失先前的內容,系統會要求您確認刪除區段。   返回頁首     全局設定   在全局設定裡,您可以管理郵件的佈景顏色;您也可以新增背景顏色,新增邊界到您的郵件。 佈景顏色 總共有 27 種佈景顏色可以選擇,選擇一款符合您需求的顏色。選定佈景顏色後仍然可以自訂區段及區塊的顏色。 背景顏色 此選項可以選擇您的郵件背景顏色,選擇可用的顏色或新增您的色碼。此外,區段及區塊也可以指定自己的背景顏色。 郵件邊界 您可以在「郵件邊界」選項選擇全螢幕背景或邊界背景。全螢幕背景沒有額外的樣式選項。 在邊界背景選項,您可以新增或更改下列選項:  框線 框線顏色  框線尺寸 圓角半徑 套用圓角半徑到郵件的頁首及頁尾。 顯示區段 「顯示區段」選項可以瀏覽郵件內所有區段,選擇「隱藏區段」則會移除區段名稱。顯示區段畫面時,您也可以點擊任何區塊進行編輯   返回頁首   區塊   和區段不同的是,區塊是用來保留和顯示郵件內容。 區塊是設計元素,具有功能性。使用區塊新增圖片、文字或按鈕。每一個內容區塊都有自己的樣式選項。 要新增區塊到您的郵件,點擊您要的區塊,拖曳到郵件的區段。 下列是郵件編輯器內可用的區塊: 單圖區塊和圖卡區塊 圖文區塊 文字區塊 影片區塊 分段區塊 按鍵區塊 社群媒體 & 社群分享區塊 導覽列 許可提示     單圖區塊和圖卡區塊   您可以透過這些區塊上傳圖片,或從您的圖庫選擇圖片。要使用這些區塊,將他們拖曳到您的郵件,您有兩種新增圖片的選項: 拖曳圖片。從您的電腦拖曳圖片前,確認您已點擊並開啟此區塊。 匯入檔案。從圖庫選擇現有的圖片。您也可以上傳新的圖片,或是使用存在其他網站的圖片。如果您有圖片 URL,點擊「插入圖片連結」並貼上。 新增圖片到您的郵件版型後,左側會出現自訂圖片的選項。 單圖區塊可以新增圖片到您的版型,而圖卡區塊可以同時新增圖片和文字,放到您的版型。 下面左邊是單圖區塊,右邊是圖卡區塊。 應該使用哪一個? 應該使用哪一個? 使用單圖區塊可以新增一張簡單的圖片。 使用圖卡區塊可以新增圖片的文字敘述。移除這個區塊,文字敘述也會跟著移除。 想了解更多關於如何使用單一圖片區塊以及新增圖片,點擊此處。 您可能感興趣的主題: 使用圖片編輯器編輯您的圖片 什麼是圖庫?它支援什麼類型的圖片? 如何取得圖片的 URL? 如何取得免費圖片? 從編輯器刪除圖片   返回區塊選單   圖文區塊   編輯器提供三種圖文區塊: 右欄文字 左欄文字 底端文字 想了解如何新增圖文區塊,點擊此處。 圖文區塊可以在區塊內同時新增圖片以及文字。圖文區塊和圖卡區塊最主要的差別在於圖文區塊沒有框架,所以您可以調整區塊內的間距,如下圖所示(左圖為圖文區塊,右圖為圖卡區塊)。   返回區塊選單   文字區塊   您可以使用文字區塊新增文字到您的郵件。要使用此區塊,將區塊拖曳到您想要放置的位置。接著,點擊區塊,將預設文字改成您的內容。 瀏覽詞彙表,了解左側導覽列裡面文字區塊設定底下的「設置」跟「內容」選項。 要編輯文字,使用郵件上方的工具列。您會看到常見的文字編輯選項,也有其他選項,像是建立錨點、新增連結、圖片,甚至連結文件。 複製貼上 如果您要複製文字並貼到您的郵件,我們建議您使用貼上功能,移除文字內任何隱藏字元,因為他們可能會影響您的文字設計。 原始碼 要新增原始碼,點擊原始碼 圖示,貼上您的代碼。 如果您沒有看到上述的符號,點擊工具列右邊的「更多」圖示。   返回區塊選單   影片區塊   影片是非常有效的視覺工具。透過影片,您可以呈現產品的品質,或是為什麼顧客應該跳過您的競爭對手,選擇您的產品。千萬別錯失在您的郵件使用影片的機會。 想了解如何新增影片到您的郵件,點擊此處。   返回區塊選單   分段區塊   使用分段區塊將郵件內的區塊或區段建立間隔。間隔不一定要設定為空白。要新增分段區塊,將區塊拖曳到您想要的位置。 了解所有分段區塊的資訊。   返回區塊選單     按鍵區塊   行為召喚 (CTA) 按鈕是郵件最有趣的一部份。它可以用來吸引訂閱用戶瀏覽著陸頁。 要新增按鍵,將區塊拖曳到您想要的位置。在左側面板,您會看到自訂按鍵的選項。要了解更多關於按鍵編輯選項,請瀏覽詞彙表。繼續閱讀,了解如何設定按鍵內容。 在按鈕新增按鈕文字,撰寫吸睛文字吸引訂閱用戶的目光。 首先,選擇「連結類型」,然後在「網站 URL」輸入網址。注意,這個頁面可能是外部 URL,或是您同一個郵件的某個地方。 有兩種方式新增連結: 您可以點擊位於上方文字編輯工具列的「插入連結」,然後新增網址。 或是直接在按鍵區塊內容選擇「連結類型」。注意:要新增錨點,您需要先建立錨點。 在畫面上方的文字編輯工具列自訂文字或新增連結。 如果郵件有多個按鍵,您不需要逐一設定。設定其中一個按鍵,然後勾選左側面板「內容」標籤底下的「套用所有按鍵區塊」。郵件上的所有按鍵就會套用相同的內容設定。     返回區塊選單   社群追蹤媒體 & 社群分享區塊   社群媒體區塊很重要。我們的編輯器提供兩種區塊,增加您的社群曝光管道。要使用任何一個區塊,拖曳到您選擇的位置即可。 社群追蹤區塊可以讓您新增社群媒體圖示,或是圖示加上文字。區塊可以新增多達 20 種不同的服務,包括 Facebook、Twitter、Whatsapp、Linkedin、YouTube、Pinterest、RSS、Vimeo、TripAdvisor 等。 社群分享區塊可以新增:Facebook、Twitter、Linkedin、Myspace 以及 instapaper。此區塊可以讓您直接分享郵件到社群媒體。 使用哪一種區塊? 果您要引導收件人到您的社群媒體,使用社群追蹤媒體按鈕。他們可以點擊想要瀏覽的社群媒體,按讚或新增到他們的偏好。 如果您想要用戶分享您的內容,使用社群分享區塊。 想了解如何使用「設置」,瀏覽詞彙表。 依照下列指示在兩個區塊內新增社群媒體: 拖曳想要使用的區塊或點擊版型現有的社群媒體區塊。 進入左側導覽列的「內容」標籤。 點擊「增加」的下拉式選單並選擇社群媒體,然後點擊旁邊的加號圖示。 在編輯畫面,點擊剛才新增的社群媒體圖示。自訂圖示的選項會出現在左側導覽列。 新增 URL 連結並自訂您的圖示。完成後,您可以使用「套用圓角至所有區塊的按鍵」選項,套用同樣的圓角設定到所有區塊的按鍵。     此外,移動滑鼠到社群媒體圖示會看到移動或刪除的選項。     返回區塊選單   導覽列區塊   導覽列可以搭配錨點,用來引導您的收件人跳到郵件的其他地方,或是用來連到外部連結。 如何新增導覽列 拖曳導覽列區塊到您的版型。大部分的使用者偏好將導覽列放在郵件的頁首區段。 系統預設的導覽列外觀如下: 現在,點擊導覽列的連結。連結設定的選項會顯示在左列。 新增您要的欄位類型並設定。如果要移除連結,選擇您要移除的連結,然後點擊左列的「移除」選項。 點擊連結也可以修改邊界的顏色及外觀。如果您不需要邊界,將其顏色改為透明,或是把邊界粗細改為 0。 如何自訂導覽列區塊   想了解「設置」標籤,請瀏覽詞彙表。 要新增連結,只要點擊「內容」標籤底下的「加號」按鈕。要自訂連結,點擊導覽列區塊的「連結」,設定的選項會顯示在左邊面板。您可以新增最多六組連結。連結類型有兩種可以選擇:文字或圖片。想了解更多關於不同種類的連結,點擊此處。 導覽列有三種版型可以選擇。您可以結合圖片和文字。點擊並選擇符合您設計風格的選項。 使用水平對齊和垂直對齊選項設定導覽列的排列方式。「間距寬度」決定每個連結之間的距離。 行動裝置樣式可以選擇預設、垂直堆疊以及垂直堆疊並置中。您可以選擇著陸頁在行動裝置上呈現的樣貌。       返回區塊選單   郵件範例   這裡提供一些如何使用區段優化郵件設計的案例。 下方郵件範例列出郵件中使用的區段及區塊。 範例 1 首先在頁首的地方新增導覽列。範例的標題使用左側邊欄位的區段。下一個欄位使用圖卡區塊,新增圖片和文字。最後,在底部左側邊欄,我們新增社群媒體圖示,請訂閱用戶提供回饋。     範例 2 這裡我們使用一欄和兩欄區段建立郵件。我們也在「全局設定」裡面使用邊界背景以及圓角設定,突顯郵件主文內容。     範例 3 最後一個範例,我們使用多組欄位建立郵件。我們使用分隔線分開區段。如您所見,整封郵件我們使用了單圖區塊、文字區塊、按鍵區塊、社群媒體區塊以及影片區塊。     返回頁首   詞彙表   「設置」底下的選項會根據您編輯的區塊有所不同。 背景顏色 您可以使用這個選項設定某個區塊的背景顏色。點擊圓形圖示,從色條中選擇顏色。如果您有色碼,直接貼入方框中。完成後點擊「儲存」。「重新編輯」選項會恢復原始設定。 框線和線條樣式 有些區塊裡有框線選項。要設定框線顏色,點擊圓形圖示,然後從色條中選擇顏色。使用色碼也可以。框線樣式有 9 種選擇,線條粗細可以設定 0 到 99。您可以更改顏色為透明,或將線條粗細設定為 0。「重新編輯」選項會恢復原始原始設定。 圓角半徑 有些區塊有圓角半徑選項。此選項決定物件的圓角半徑,設定  0 到 20。完成後,您可以勾選「套用所有區塊按鍵」選項,所有按鍵就會使用同樣的半徑。 間距寬度 部份區塊可以設定間距寬度,像是導覽列、社群追蹤以及社群分享區塊。此選項決定物件跟物件之間的寬度。要設定「間距寬度」,移動綠色滑桿,設定 0 到 20。 間距和邊界 「內容」標籤底下可以看到間距和邊界選項。兩者指的都是物件周遭的空間。移動滑桿就可以設定間距和邊界。 對齊 對齊選項跟物件的位置相關。要設定對齊方式,點擊下列選項:置中、靠左、靠右、底部或頂部。 行距 只有文字區塊才有行距選項,用來定義兩個行內物件的高度,選項有單行間距、1.25、1.5 以及2倍間距。  色碼 色碼是代表顏色的值。色碼開頭是井字號 (#),後面接了六個字元。舉例,#C

範本與編輯器 21 四月, 2021