# 【影片】電子報模板設計教學 － 母親節 EDM 行銷 > 節慶行銷模板設計皆可以參考，本篇文章將帶你使用電子豹拖放式模板設計工具，從 0 到 1，手把手教你如何製作出一封精美的 EDM 電子報節慶行銷賀卡。 電子報設計影片教學－母親節行銷 母親節是每年當中最重要的節慶行銷！即將到來之際，想要發母親節 EDM 賀卡卻苦無素材？只要利用電子豹的拖放式模板編輯器，輕鬆製作屬於你的母親節行銷賀卡 EDM。如有疑問可以參考我們的教學影片，帶你一步步操作。 歡迎下載我們提供給你的參考圖片素材。 （點擊下載）母親節賀卡圖片素材包（內含 Jpg 和 Ai 向量圖檔） 2022 母親節行銷沒靈感？看看這 9 大知名品牌案例！ 沒梗了？看看這 6 款新穎有趣的母親節 EDM 範例吧！ 接下來，拆解逐一步驟，從「新增活動」到「設計內容」到「試寄一封」，輕鬆完成專業的 Email 設計。 Step1. 新增活動 新增活動頁面 1.1「新增活動」填寫基本資料，按下一步。 1.2 設計內容選擇「拖放式編輯器」 **分類：** Email 行銷 **作者：** Bao **發布日期：** 2022-04-08T16:36:00.000+08:00 節慶行銷模板設計皆可以參考，本篇文章將帶你使用電子豹拖放式模板設計工具，從 0 到 1，手把手教你如何製作出一封精美的 EDM 電子報節慶行銷賀卡。 ## 電子報設計影片教學－母親節行銷 母親節是每年當中最重要的節慶行銷！即將到來之際，想要發母親節 EDM 賀卡卻苦無素材？只要利用電子豹的拖放式模板編輯器，輕鬆製作屬於你的母親節行銷賀卡 EDM。如有疑問可以參考我們的教學影片，帶你一步步操作。 歡迎下載我們提供給你的參考圖片素材。 [（點擊下載）母親節賀卡圖片素材包（內含 Jpg 和 Ai 向量圖檔）](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2021/03/mother-s-day-by-newsleopard.zip?ref=cms.newsleopard.com) > [2022 母親節行銷沒靈感？看看這 9 大知名品牌案例！](https://blog.newsleopard.com/mothers-day-marketing-9-ideas/?ref=cms.newsleopard.com) > [沒梗了？看看這 6 款新穎有趣的母親節 EDM 範例吧！](https://blog.newsleopard.com/email-marketing-mothers-day-6-campaigns/?ref=cms.newsleopard.com) 接下來，拆解逐一步驟，從「新增活動」到「設計內容」到「試寄一封」，輕鬆完成專業的 Email 設計。 ## **Step1. 新增活動** [新增活動頁面](https://app.newsleopard.com/campaign/new?utm_source=blog&utm_medium=post&utm_campaign=dnd_first_release&utm_content=how_to_use_drag_and_drop_editor-20190606) ### **1.1「新增活動」填寫基本資料，按下一步。** ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/1.1.jpg) ### **1.2 設計內容選擇「拖放式編輯器」。** ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/1.2.jpg) ## **Step2: 設計內容** ### 2.1 Email 整體設定 2.1.1 更改 email 背景顏色。 ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/2.2.jpg) ### 2.2 設計內容 2.2.1 拖拉左側的**「Logo」**設計元件至編輯器中。 ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/2.3.jpg) 2.2.2 點擊元件進入編輯狀態，並上傳 logo 圖片、填寫連結與描述文字(若不需要連結則不用填寫)。 ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/2.4.jpg) 2.2.3 點擊「Logo」設計元件的「圖片樣式」更改 logo 大小。 ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/2.5.jpg) 2.2.4 你可以調整上下間距，符合最適位置。確認無誤後，關閉編輯狀態。 ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/2.6.jpg) 2.2.5 拖拉左側的**「標題」**設計元件至編輯器中，編輯你的標題。(若需調整元件位置，你可以利用箭頭移動元件上下位置，或是直接按住 :: 拖動) ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/2.7.jpg) 2.2.6 點擊「標題」設計元件的「字體樣式」更改標題的字體大小、顏色及位置。確認無誤後，關閉編輯狀態。 ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/2.8.jpg) 2.2.7 拖拉左側的**「段落文字」**設計元件至編輯器中，編輯你的文案。 ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/2.9.jpg) 2.2.8 你可以利用「段落文字」設計元件的工具列，將文案加粗體、設連結/連結樣式、調整字體大小/樣式或插入自訂變數。確認無誤後，關閉編輯狀態。 ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/2.10.jpg) 2.2.9 拖拉左側的**「圖片」**設計元件至編輯器中，並更換圖片、點擊「圖片樣式」自訂你的圖片大小。確認無誤後，關閉編輯狀態。 ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/2.11.jpg) 2.2.10 拖拉左側的**「按鈕」**設計元件至編輯器中，為你的 email 加上 call to action。連結記得不要忘記填寫喔！ ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/2.12.jpg) 2.2.11 你可以點擊「按鈕」設計元件的「按鈕樣式」，編輯你的按鈕顏色或點擊「字體樣式」編輯按鈕文字顏色等等。確認無誤後，關閉編輯狀態。 ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/2.13.jpg) 2.2.12 拖拉左側的**「分隔線」**至編輯器中，可以在「樣式設定」裡面設定顏色。 ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/2.16.jpg) 2.2.13 使用**「段落文字」**設計元件增加聯絡方式。 ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/2.17.jpg) 2.2.14 最後，拖拉左側的**「社群連結」**設計元件至編輯器中，填上你的社群連結，讓會員輕易追蹤你。 ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/2.18.jpg) ## **Step3: 試寄一封及完成** 利用上方工具列的**「試寄一封」**功能，寄給自己檢查看看**內容、文字、連結**有沒有問題， 建議用電腦、手機載具都閱讀看看， 都沒問題的話就可以按編輯器的**「完成」**，回到建立活動排定時間寄信啦！ ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/buttons1-1200x200.jpg) ## 沒有設計靈感嗎？參考看看別人怎麼做吧！ ![](https://prod-newsleopard-blog.s3.amazonaws.com/wp-content/uploads/2019/06/Screen-Shot-2019-06-26-at-3.12.41-PM-1500x486.png) 看看用電子豹模板製作出來的範例（附贈版型下載） 1. 範例一：[｜小器生活通信｜簡單而重要的事](https://newsleopard.com/newsleopard/email-examples/thexiaoqi?ref=cms.newsleopard.com) 2. 範例二：[【買犬糧抽紅包】愛泥愛泥新春優惠，現在買犬糧最划算](https://newsleopard.com/newsleopard/email-examples/abaopet?ref=cms.newsleopard.com) 3. 範例三：[MALOJA 機能與外型兼具的潮流品牌](https://newsleopard.com/newsleopard/email-examples/ulohas?ref=cms.newsleopard.com) 4. 範例四：[風和日麗不是不報｜☁城市漂浮著，城市有養分☁](https://newsleopard.com/newsleopard/email-examples/agoodday?ref=cms.newsleopard.com) * * * 延伸閱讀：[沒梗了？看看這 6 款新穎有趣的母親節 EDM 範例吧！](https://blog.newsleopard.com/email-marketing-mothers-day-6-campaigns/?ref=cms.newsleopard.com) 延伸閱讀：[母親節行銷沒靈感？看看這 9 大知名品牌案例！](https://blog.newsleopard.com/mothers-day-marketing-9-ideas/?ref=cms.newsleopard.com)