Intro to Email Marketing: Design Beautiful Branded Emails with Mailchimp | Ilya Lobanov | Skillshare

Intro to Email Marketing: Design Beautiful Branded Emails with Mailchimp

Ilya Lobanov, Creating brands that make impact

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
9 Lessons (59m)
    • 1. Class Introduction

      1:35
    • 2. Collect Brand Elements

      1:39
    • 3. Plan Your Goals

      3:18
    • 4. Create Wireframes

      3:39
    • 5. Design Newsletter Template - Part 1

      10:52
    • 6. Design Newsletter Template - Part 2

      9:36
    • 7. Customise Newsletter Template

      16:49
    • 8. Design Standalone Template

      10:38
    • 9. Final Thoughts + Class Project

      1:22

About This Class

Email Marketing is still a huge part of an overall Digital Media Strategy for any brand. 

No doubt that if you want to stay engaged with your customers, you will need to be sending emails. But sometimes a simple email is not enough – you want to promote brand awareness and brand recognition to stay top of your customers’ minds.

Your emails need to be on brand. They need to be an extension of your Brand Identity and be a beautiful representation of it.

This class is a practical step-by-step guide to creating branded emails with Mailchimp.

Working with many SME owners in the past 15 years I found that the most effective way to create emails is just to build them directly within an email platform! That means that we won’t be designing the entire email in Photoshop, but rather start by planning out our email goals, create a wireframe and then build our email templates directly in Mailchimp.

Who is this class for:

  • Designers looking to create a beautiful email for yourself or clients
  • Entrepreneurs who want to dive into the world of Email Marketing
  • Anyone else who needs an introduction into email building with Mailchimp

So if you have a brand to work with and some components that make up your Brand Style Guide, and now need a step-by-step guide for applying it to something practical, like an email template – this class is for you.

As always, I happily share and commentate my thought and decision making process along the way. 

What you will learn in the class:

  • Learn about the most common email types you can send and the purpose for each
  • Plan your email goals and learn why that’s important before you design your email
  • Create a wireframe for your email design to save yourself from wasting time
  • Watch a behind the scenes lesson of creating two email templates for a real client

Transcripts

1. Class Introduction: once again Hi and welcome. My name is Julia, and I'm a branding expert on designer. How about branding isn't my only passion. He just so happens that I'm also passionate about designing for digital platforms as well. So I decided to combine my two passions and create this class for you. So let's say you have a brand. Did you have a week? You have a logo type. You have some brand colors, some phones, perhaps some other brain components. Now you're looking for a step by step guide on how you can combine that in a practical way and create something simple and practical as an email template. Perhaps this is why, in this class comes in, we will create a beautifully brand of email template, and we'll use one of the most popular email platforms out there. Mail Chimp will discuss the different types of emails that you can create, and we will cover the process of creating a wire frame and planning out your email designs , as well as establishing your goals and purpose for your email. What this cost. One. The covering is designing and email in photo shop, but rather it will be a practical guide in the step by step guide on how to create an email template within male chimps. Dragon Drop editor. As I think that's the most optimal way to create emails for most users. It will also save you a lot of time and resources doing it this way. This is an introductory class, and it's suitable for uses of any level. It will also be valuable for designers in creative independence alike. So hit the enroll button and I'll see you in the next video. 2. Collect Brand Elements: glad that you decided to join this class. At this point, I encourage you to start collecting all of your brand elements s so that we can create this branded email. This can include things like your logo, type your brain callous and fonts that you use as well as any related brand imagery. These components can be part of ah, comprehensive style guide, which my also covered Do's and dont's for the logo and usage of specific design elements. So if you're creating in the mouth for larger brand who first Talgat such as this, you want to make sure the reference Any sections that talk about creation, often email design or any other promotional marketing materials. Also, any kind of sections that talk about your usage of your logo, the do's and dont's clear space minimum size for your logo on any other specific style guides for you using the brands and colors and Brent elements for this particular brand. If you creating your email for a brand such as your own, you should already be quite intimately familiar with the brand, and you can really use your God feel for what's wrong and right, as I mentioned we won't be using for the shop to design our email today because we will be predominately using male chimps very own set of templates that will customize to create our emails. That doesn't mean, though, that you can't use for a shop to create branded elements such as icons and other imagery that's going to be on brand. However, before we design anything, we have to discuss how we're going to set out goals for the emails. 3. Plan Your Goals: before we can begin to design our email, we need to be very clear as to the purpose of I am on template. In other words, what action are we aiming to achieve with this email design? You know, likelihood. Just jumping into creating an email without some sort of initial planning will waste a lot of time and create the necessary work to help us. We can explode the different types of emails available to us. This will give us some strategy behind picking the most appropriate email types, based in our action that we want to aim for for that email. So the six most common email types are Number one, the newsletter. This is probably the one that's most familiar to most uses. It's probably the most common female types out there, and companies usually use it to send latest news articles and other company updates. Number two We have the stand along email, so the major drawback off a newsletter is that they usually contained multiple information competing for attention. There's typically several different articles and block entries, all with different cliques, and called the actions. So the goal over stand along email used to talk about just one specific event or drive only one specific action, such as, Ah, sign upto a webinar or ah, visit our consultation page number free. We have the nurture sequence. The sequence is usually a serious off emails. Sometimes they can be even plainly styled. This has scheduled and sent out of a period of several weeks or days to share useful tips or practical steps for particular niche topic. Now, transactional emails is something that you would have received if you've ever go on about anything from an online store where you maybe have received product recommendations. Perhaps you received some join us and get a 20% off off your order top of email, or even remind us that, hey, your shopping cart isn't going to check itself out. Here is your shopping cart. Go ahead and buy the products. Number five Have notification emails. This can include things like successful registration information for sign ups on different websites. Also, notification when someone comments are shares on your post or things of that nature. So number six we have the miles and emails. This are usually based on the data gathered on each subscriber, so it's typically things like email remind us for your birthday. Oh, for when you signed up to a particular website. So if you're one of those people that where your friends forget your birthday altogether, you can still get this warm and fuzzy feeling when blogged that you've subscribed to sends you an email to say, Hey, happy Birthday. Each of these emails can typically serve a few different purposes and goals, but some email tops a more appropriate than others. So some of the email goals that you can have can include things like brand awareness, customer loyalty, increasing conversions or driving traffic. In this class, we're going to focus on creating two types of emails. That's going to be number one, an email newsletter and number to attend a long email. So let's dive in. 4. Create Wireframes: first I like to do when creating the mile design. Once I decide what email type of like to create, and the goal that I liked the mobs on chief is to create a wife rain for that evil. So if you go ahead and Google y frames, you will see that they're quite different. Some of them can contain quite a lot of detail. Some of them contain less detail, so there's loaf ability and high fidelity wife ranks available from my background in Web site design. Why framing is a common practice. It helps the plan out the major components of the website page before you spend our setting up something encoding elements without having any plans, as you can see a tent to make a lot of emphasis on plans. Now, with my background in Web site design, why framing is quite common. And to me, it seemed like a logical progression to apply our creation off wife frames for email design as well, since both digital mediums. So I also love making analogies. So I believe that creating an email design without making some sort of ah initial plan or creating a wife from first would not be the similar to building a house without having some sort of a master plan or side plan in place, ultimately going to make it a lot more difficult for yourself without having one. To help you connect the dots of how I went about creating my wife frames, I'm going to focus on the practical example well discussed how I created the life support specific client of mine. So for the newsletter email, I knew that I will want to share some helpful beauty tips and articles in the newsletter as well as a branded message to help build brand awareness for the standard on email. I know that my client will be running several workshops and webinars in the future, so I want to focus on creating an email that will cattle for that as well. So let's take a look at the white frame examples that I've put together for four Mike Line for the new slide. Understand a long email. I've got this in the illustrator drawings for presentation purposes, but normally I start out by sketching the mark on the white board or notebook. In fact, for your class project, it's more than sufficient to submit just your wife ranks that he sketched out on a notebook or exercise book. Now the goal off a wire frame is to plan out the big rocks on the major components that in content that you want to be promoting in your emails. So I really tried to avoid focusing too much detail because that can clot up Harper Wife Rain and also the details will be driven a lot by the actual style guide and our brand design pieces that will have for each brand. So, as you can see here in my wife frames, I have one featured section at the top of my newsletter. Then I have a little promise section to add our brand messaging, and then I have some subsequent smaller articles below it for the stand along email. Have a similar layout where I will start with a welcome intro at the very top. Then I will have a middle section of some more defense and promotional imagery, and then I have two columns that some dates and locations for workshop or webinar. You will also notice in my wife frames that I have a mobile version. This is incredibly important because more and more people are checking the mass on their mobile phones. So the best practice for when you're designing or planning out your email designs for mobile is things that are in columns on the vestibule, sort of stacked one below it, another into one column layout or more wealthy. So let's starving and start creating this females. 5. Design Newsletter Template - Part 1: So let's dive in and start creating. Are you Miles? We have our brand components about logo, Have a callus, have a topography. And when it comes to topography, what you will see when we jump into creation off the email template is that funds will be limited. Every client out there renders theme are slightly differently, and not every email client has access to all of the phones and the Internet, so you will see that there's there's a least off some pretty fine system funds that are available for styling or creating in the email. So what we will need to do for Brand, he's make sure that we decide what fullback phones we can use that best represent our brand or that are the most similar to our brand phones that we've picked. So let's jumping into the creation. I've got my dashboard open here and mail chimp. Keep in mind that at the time of recording off this video, this is current. However, mail chimp obviously improves the features and sometimes the change where their position and like a certain elements. So if you can't find what we've discussed in this video, try and look for it where he seems to be the most logical place. So we want to create the template, and we do that by clicking on the brand link and click on the templates. So very quick comment here is that a template is essentially a file that can be used and replicated many times over. Once you've set it up, it will give you basically a clean plate off a styled branded email template that you'll be using to create any ongoing email in the future. We are focusing right now on creating the newsletter email so we'll have a look at my wire frames here. So this is the kind of the blocks that I would like to create. I've got my loga type a welcome message, a promo block on two articles and untraditional text block belong. So first things first, we're going to set up our mail chimp without default logo. So for that, we're going to click on the content studio, and we're going to drag and drop ah, logo that will want to use. So that's how logo. So we want to actually use that as the default logo for pretty much all the templates that we create for in the future, you click on it and over here with the button says View, details. Click on the little arrow and say, Set my logo. That's going to make that the Ford logo for any email templates that we're going to be creating. So we're going to close that window. Ah, now we're back in the templates window. So we want to create a new slider template. So click create templates and he will see a number off emails and kind of teams that male chin provides you. He will notice that some of them have this button called Upgrade to Use. Right now we will be focusing on using the free account for male chimp. So by all means, he can go ahead and upgrade, and that will give you better functionality and more our teams available to you. But because everyone will have access to a free account. So we will be focusing on using that one, too. See if we can create feel a beautiful, branded looking email just with the free account. So for that, I need to pre much have a look. First of all, my wife frame and the blocks that I needed, uh, to have. And then I jump back into male chimp See, which are emails are kind of available for free, a love this paid. So I'm just going to have a look at which months available I can see that the make announcement is ah, freebie. So I think that's suitable for what I needed to be. So you can click on the little lens here that will come and give you a preview. What? That theme looks like what that template looks like. So I think I'll be able to use that so we'll go ahead. So to use the template, you can just click on template itself and it will open up this editor right here. So before we kind of start customizing and creating our beautiful template, I'm going to just quickly talk you through off the features off a general template, dragon drop functionality and male chip. So you've got on the left inside the actual contents that you can head it, and on the right hand side here, as long as you're in the content tab, you've got this dragon drop blocks. If you conserve position and customize based on what you need. So, um, every content block becomes eligible. You can see the little pencil I can and cannot duplicate or delayed it with this. Plus, I can't or deleted with the little trash can icon. So that's the dragon drop features. And then you've also got this designed tab, and the design tapas you can see is the default place for your default styles. So that's what we're going to set our default stars to begin with on. That's going to be using, um, Global style school emails going forward. So before I do that, I'm going to, uh, close out of that. So I'm going to quickly review my wife Rain. I've got a longer type. I've got my welcome message and I've got my prom a block, and I've got my two articles in a little bit of text. So before I kind of jump in and start customizing, I think that the easiest that I find to create email templates or emails in general is to actually populated with content and then start to customize it kind of light on. So I've got my text editor here with some really the goal content. So I've got my headline in the subhead, so I'm just going to start populating this and then I can customize and tweak it later. So I'm gonna use the headline that's gonna be my headline and I've got my subhead below it . I know I wanted to be sold to be scented, So I'm gonna select this guy and make that heading one. Don't worry. For now it's looking quite myself and attractive. So that's one. Um, I don't need this Comus block and I actually going to delete all of this other blocks just so I can start from a clean slate so this blocks can be removed for now, and I can just start to populate with my own contents. So this is by far the easiest way. I wanted to customize a template. Ah, and we'll use Ah, But later on, we like should apply some colors and phones, firebrand. So we've got that main section. Now we've got our prom a block, and we've got that two articles and transformational gallery. So for the probable look, if it's going to be just an image, you could literally just place a an image there, such as So if it's going to be some text and some image. You can use a different block, such as the image card or image plus caption. However, I'm envisaging a background image of some text over laid over the top, and that's going to be a little bit trickier, and we'll customize it in the next video. So I'm also looking for another text block and two columns for the two articles. So for the textbook, I'm going to drag a basic textbook right here. Save. And I'm also got going to add another text block right there. Andi. When you dragged your blocks, you'll find that each block comes with its own styles, content and setting stab. Some of them have more features and functionality than others. A textbook. For example, If you go into the setting stab, you will see that it has a number of columns. I've got two columns, and they can actually customize the width of the columns to so my two columns. I want them to be equal with some going to save, and I'm just going to quickly populate based on my wife frame. Based on my set up email, I'm just going to actually go ahead and populate some of this text I quite quickly, some just going to pick up the first block place I'm going to send to that. I'm going to make that heading free. And just before a customize closed that window, actually click on a column too, and I'm going to populated with this content I'm gonna send to that. I am going to make that heading free a swell save pain. And I'm going to place my call to actions. I've got my heading, have got some text and I've got a bottle. So I'm going to customizes Blawg and place my text, which I will send them. And I will give this also heading free for now. And I will save that. And then based on my wife, rain, have a look. I want to have ah, cult action button. So I'm going to drag and drop a button, that style, and that's going to be cold. Calicchio. I can call it Transformation Gallery, so I'm just going to pick up my title and I'm going to link it off to the website page that it's intended to go so saving close. And so that's pretty much my contents for the email way Don't actually customize all of this and apply are some default fonts and colors. Next email. So let's have a look. 6. Design Newsletter Template - Part 2: So let's get back to our template now and then let supplies in default styling to it. So the way that it works, we've got the content that I've showed you with drag a ble sections on and then we have the design tab, which is the default setting for our template. So from my, uh, text file here, I've pretty much placed my colors in my body copy phones and my headline phones, as well as the fullback phones that I've selected that I know will be available. So I've got Laura for my headlines, and the Georgia will be the fullback automatically, and also later will be my body front and area will be the fall back. So I'm going to set up that right now. So I'm going to go into the body section and we can see down the bottom here. We've got body text. So instead of aerial weaken, set that to light on, you can see that there's ah little message here saying that the clients that don't support weapons will render a similar standard on instead so you can see that custom weapons, those of the Google Web phones that you can pick in male chimp. But this standard by Pontes is this. Pretty much very small list is what's actually available on 100% of the desktops and 99% of the desktops. But the rest can render this front were available. So I'm going to use later is the body fund, and I'm going to actually customized my colors. I'm going to use the gray for that hands in the body. So that's actually great for the text right there and for the body. Lincoln actually going to use maybe this purple body link. Now let's have Look what else is in this column. So you got what it takes that we just changed. So that's going to apply later told the front. The fold body front. We've got border for the box without any border for the box for the board. The interior style actually want to give that convertible color so we'll have a look at my , um, why frame? I want to have a bit of a box and I'm going to use my branded color. So that's how I can use or add a bit of brand to the template. That's one of the easiest ways, some actually going to pick up my pink, so I'm going to get the light pink. I've devised him. I'm going to add the hex, Cold says. Kind of given this pink box around the contents and we've got the petting petting at the top. Let's see what that does. That just sets the petting off below the logo. Eso I think we're going to say that the zero for now and petting at the bottom. That's basically the content area before the fullest starts. So for now, I'm just going to put that zero, and I'm going to the color for the background, this white, which is what I want, so that's fine. Now you can see the header has this kind of grayish think. I want to remove that. I want to actually have that white. So if it's not in the head up, let's have a look in the header. We've got a color, so let's remove that no color. So it removed it, but it still does still out. There were another great int there, so it's not found in the head up. We're going to save that eyes going to be most likely in the page. So that's going to be a default page. Still, No, it's not a page. Then I suspect that it will be in the body somewhere. So depending on the on the set up off the theme, sometimes the customization for certain elements will be found in different blocks. They kind of have to play around on find where might be hidden. So let me just go back to Page. So that's just the heading stalls eso while I'm in the heading starts. I'm just going to eso knowing that my heading stars I Want to Use Laura is the heading stars, which is the most similar to my butler front. So I'm just going to create Laura and don't worry about the sizes. For now, we're going to just use Laura, and we're going to customize that big later on on Laura and Save Page Header has no background. We don't want that much padding, so I'm going to give it 30 pixels, patting at the top zero pixels at the bottom. Perhaps, let's say 15 picks is at the bottom and there we go. That's actually the head interior style, background colors. That's so we want to make that white? No, that's not it. Background. There we go. Background color. What? That's it. And here we connection to remove callow via So we're going to save that right now. You can see the log is a little blurry, so I'm actually gonna change that size of its own, going to replace it and want to click on the logo. And I'm going to click on Edit Image. So we're gonna make the with 100 pixels on it's safe insert. So perhaps that's a little bit too small. I'm just going to replace that. But I'm going to do is I'm going to drag my logo that followed once again and then I can resize it something more appropriate. So I'm going to click on it. I'm going to say edit. I'm going to make it You 130 pixels am gonna save, and then I'm gonna click. Make sure that I have set my logo on hand and I'm gonna inserted there. That's better. So never go. That's how long ago. So now onto the styling off the some of the other components I've got ah, few things to do here left. I've got the buttons. I'm going to customize the button by going click on the button module, clicking the style I don't want to have in Iran corners, and I don't want to have any background. But I do want the border, and I'm going to give the solid to pixel border that's going to be in my gray color, and it's I want to have, Ah, a gray color for the text as well. And I'm going to set the front for that as later which is going to be my default body found . We have it. You can change the bedding here as well as you can see on there's a little tick box that's really helpful. It's as applied to all existing button blocks. So if you want that for this particular template, if you want buttons or any future buttons he created being that one default style, then you can click, apply and then saving close. So then what? I want to do that I want to add a few dividers and spaces around my contents. It's It's not too kind of bunched together, so I'm just going to drag a few of this saving close same clothes you can also just duplicate to get their own thing so I can look, just duplicate the space as well and sort of put it into spots where required. So when you have your once, you have your kind of spaces in place. But you can actually do is you can just click on one of the divide us. I don't need the border around it. I'm just going to remove the border. And I wanted because I wanted to be purely a spacer, so I'm going to give it 25 pixels. Sparing Essentially is going to be a 50 pixels high space and what I'm going to do. There's a tick box again here, applied toe existing divider blocks that's going to update every single divided block that's already on the page. I'm going to click, save and close. Let's have a look at some default styles in the next video 7. Customise Newsletter Template: So we have our template with some of the contents. I'm going to replicate this guy and replicate the space because I'm going to have four keeps in case my client wants to use a bit more content in. Otherwise they can just remove that entire Oh, so I'm going to pre feel of some off my other text that I have. I'm just removing all of the text and replacing centering, setting up different style calling to moving, pasting. Centering. This is fun, isn't it? This is just, uh, the wonders of male. She had work. So I'm going to add another space, adjust their between my text in my button. That's better. Maybe that space is too large so we can tweak individual spaces as well. So we're gonna say 15 in 15 which will give us a 30 pixel higher space we want applied to all of the text box. We're just going to customize this one saving close. So now, as for the actual styling and making a little bit more branded on on brand, So what we're going to do here, I think I'm going to just jump into my design tab and I'm going to go into my, uh, Paige Styles and the h one style. I think that's probably way to lodge. Going to go with 30 pixels. And I don't want bold. And I want to give it my great brand gray color. And I'm just going to apply that great color. Just all the headings while I'm in this section to settle consistent. Now, as for the heading free, which have selected for these guys, I'm going to also take off the bold. And I think I'm going to make that 18 pixels. It may be you can also type in 20 pixels. All right, so I'm gonna save that, um, and for this guy, make sure going to make that a heading to style. And then I'm gonna close saving clothes, and I'm gonna go back into my page and heading to I'm going to give that, uh, 28 pixels non bold, maybe 24. Okay, so I think I'm also going dubbed that the body color texts at the moment, that's a little bit too light for my liking. So I'm just gonna I'm gonna try. That's the great that I'm using. Some get, I'm gonna give it the same gray as that things now that's a bit more legible and the people easier to read. I'm going to save that s o for this section. I've I have some plans for making it a little bit fancy. I want to add a background image. You could just basically browse for an image. Um, like so. And you could, um, upload one of the images. So let's say, got a brand image that I've used elsewhere for some marketing material, so I can upload that here and insert that gives us just the back regular background image but doesn't give us any text. You could, of course, several eight with photo shop. But I tend to do that only if there's a minimal amount of text. There's a large amount of text like I'm planning to place here. I would like to create that as a background image and also give client ability to edit the life text in the future so we can see that there's a style here, for the symmetry can create the border around corners. They can play around with that you're creating unique top off style. But for my newsletter, it's about my wife rain. I want to have a bit of text late of the image, so you can do certainly edged age and this kind of stuff as well. So for I will keep that doesn't placeholder, and I'll come back to that in a second. So I've got some icon support for these guys over here, so I'm just going to give it a bit off more that branded language for the brand elements that we've created. So I'm going to click the image icon, and I'm going to drag and drop So my icons that have created So I've got four sparkle icon still heart more or less the same. They're very, very small customization speech. So I want to give a better for writing to my clients. I'm going to click first month for this column and save in an insert and calling one. I'm going to do the same thing. Place cursor, their place, an image. Pick up another icon, insert saving close, and I'm going to edit this guy called one and repeat the process. They got this icon saving insert. Call him, too. Repeat the process and saving close so you can see this is a very faint kind of element. You could, of course, tweak my beggar and color in here in the body section. Ah, you could tweak this pink to be a slightly, um, darker pink. Perhaps we can try that out. Then we can see how that works. You know, we can always revert. Uh, that's that works a little bit better. You can actually see Icahn Someone say that I'm just looking for some additional text block stars that this particular text book contains. But sometimes it gives the ability to add borders around the textbooks. But this particular dragon drop module doesn't have that functionality. Eventually, I could use things like Image group or image card on image caption that might have, Ah, a similar kind of style. And then that might give me ability to do a border. But you can play around that and see kind of get familiar with the tools of male chimp for this guy over here for the space. I think that's to like someone just gonna give it 15 pixels, save how the food up we can go into designed tap and food. I'm going to just based on life. Why frame it's kind of white. Some see. I'll see if I can just remove the background for this all together. Eso the background. Let's see if that changes. That's just food. Are in theory, a So, uh, that's changing. So there is by Gronk over overall, which we can change the bag on there hands. That's the overall style so we can change the color. We can change the colorful the text are graze again, just clicking on too many things. You're hicks. And of course, we wanted to be in a later funds. There's a food, a link. Let's make that the same gray. Just so it's kind of inconspicuous on will save, and you could see that some social I can see. You can just click on that. That actually gives you a bit about it. That's a bit of a widget that Melcher has with some social icons you can customize and add and remove suddenly Twitter and my you're ill in there so you can populate that. If your own your links for your instagram profile and your Facebook profile on you can style them. Um, you can, of course, give it a different color, so I'm just gonna have a look at what's available. So we've got said this is currently using white icon, some just going to use the gray icons. There is also a larger icons like that. So I think I prefer that. So that's saving close, and you can always customize the links. And I suggest that you do that in the template file because that every time you replicate this template, the links will always be the same. You won't need to change them every time. Um, so now if I go back into I should I'll change the foot up, um, column the moment it's transparent. So ah, whole body has this sort of like great colors and actually make it white. There we go safe. So, um, there's the guts off the template, and you can see how just small adjustments here and that can give you a beautiful Rieti so you can create kind of unique branded imagery to to I had a bit of that branded style into the template. So even just the small things, such as a little eye contact you create on image that's on Brand will give you that ability to be a bit fancy. So speaking of fancy, let's just create something a bit more unique. So I'm going to delete that and his some Kolding that's about to come up. So I'm going to drag a colding look right here. So I've also got a link which I will share in a resource is section off holding that you can use to have a background image to something. So I'm going to copy this cold. That male chin provides hands. There's this It comes of a second bit of content as well. So I'm going to place that guy over there. Eso that's essentially a cold that will give us a background image so that if you read the commentary and the instructions for this email, it will tell you to replace your image. You're l over here. So the way that I would do this is I would actually save this hand. I'm going to add my image block and you'll see why in the second somebody brought brows, I'm gonna click on this guy and I'm going to see the little arrow and I'm going to say copy your l. So I'm gonna copy the Ural for this image and clothes that I actually don't need this block anymore. Delete. I can go back to my cold look and I can actually replace this image right here. The u R L. And there's another place where you need to replace that over here, and you'll need to make sure that you're picking up the colors and replacing the colors that they've provided you. So that's this guy over here. You don't have to be an expert in coding to be able to do things like this. So if you follow along, we'll be able to create your own a beach style. So it's based on old school kind of cold. For HTML. C can create our sections using tables. So at the moment you can see that the high for the stable is 100%. I'm actually going to give it 300 pixels. I need pixels because that's the new style, and then what I'm going to do. I'm actually going to play some of my text into this section, which is which goes into the T. D. T. D. Is a cell. So if you're not familiar with HTML, you can check out some HTML tutorials. But for this purpose. We just going to place this and I'm gonna show you how to style this very quickly. And you can replicate this cold falling this instructions to create something similar. So over here, May Allchin gives us some help. So it says for any container that you want to have the full textiles apply, they can use this class. So I'm going to give my cell. Hey, Close called it Pace that class in there. And this is going to be my age too. H two. And this is going to be mine. Car enough would just be be. And I'm going to center all of this. No, that's going to align center and vertical line Middle. Hey, we're going to give it sell pad putting off, Let's say 50. So then we can use old school kind of style for front kulla equals F f for white. Yeah, we can, um, front and the same full my paragraph front. There we go. So you can play around with this. But that's the idea that you can add a bit of magic and a bit of something different to the template. Even though you only have access to the free templates for, Well, Chip. You can still use a bit of cold or even coping pace and cold created else where they can find on the Internet and kind of customized to suit what you're trying to create. So I'm going to save and close, and this is basically my template that I'm happy with. And next thing amount of these, you can click on previous test and end the primo to ensure that it looks fine on the desktop and that it looks fine on a more well as well. So you can see how it stacks. So all of this column should stack into one column has per my wife frame like so. So once you've tested and make sure you can also use preview test and send the test him out yourself to check out what it actually how it actually renders in each email client. But then what you can do is you can go save and exit, and that will prompt you to give your template names. I'm going to court, uh, standard. Can you slap them template and save so that you've just created and use letter template in less than 2025 minutes, so we can now use this template and replicated and actually adjusted to create our standalone email, which will be a lot easier that stop into that one. 8. Design Standalone Template: So what we've just done is we've created a template that ultimately we will be able to replicate and create different newsletters in the future. So a template is your base file, so that will not change. Or you can change it if you want to. But that's going to be essentially a base or your global file that you will use to start all the subsequent newsletter emails from in the future. So if you think about it this way, when you're creating a new newsletter email, you will use the template and you'll be able to replace any of the content that we've created so far. So any of the content blocks that we've just put together in this exercise you'll be able to update an edit for each unique individual emails in the future. So the next step is we're going to use that email template to create our standalone email. Um, so we've done the kind of the the major leg work with our initial template, so it's going to be a lot easier for us to create this stand along email template now. So if you go back to our templates in male cheap, we can see our standard newsletter template that was saved. You've got two options. He can essentially click on little error here and say Replicate, that will give you a duplicate copy off the template and then you can modify for in our case, I want to show you a slightly different way how you can kill two birds with one stone. So I'm going to show you how to actually create the campaign while using the template and will be a same time creating another template that we need. So we're going to click on campaigns we're going to click on, create the campaign and is going to be a regular email going to give this campaign the name . So we're going to treat this exercise as if we're sending the stand along email right now. Eso Like I said, we're killing two birds with one stone, so I'm going to use stand along the campaign on, and I'm gonna call this one masterclass because that's what my template will be about. So I've got my wife frame here. So in the standalone email, you can see that it's a similar kind of structure, will get the welcome message. I've got my prom A block. Ah, and I've got my location for my workshop. A swell. So so the standard on campaign masterclass. But it will ask you is it will essentially ask you for some details off the email campaign . It is sending two. So you will need to add recipients. So once you have leased to center recon that this you can fill out the section for ho. The email is from, uh at the subject for the campaign and then style the content. So we're just going to jump straight into design email and it will ask us what style they want to use. We're going to use safe templates, and we're going to pick out template that we've created earlier. So what we're going to do now is we're actually going to create a campaign for this master class, which will be the second email that we're creating with at the same time. You will kind of get to know how you can change the contents. And when one we actually styled it, we actually going to click here savers template, and that will give us stability to safe. The second email is another template. Ultimately which you can use in the future. So as we see in my wife frame, we're going to just customize it a little bit with the different content. So that way you can actually see how easily you can change the content and populate the content for each template with unique content without changing the template, the template will remain, as is so right here. We're going to put our second. We're going to put out a text for a second top of email, which is going to be a mosque, the class. So we're going to their colleagues. I'm delighted to introduce the coach and feature. So for this template, I think I want to just mix it up a little bit so that it's obvious that this is a different type of email s. So I'm going to go into my design and locate where this pink background is coming from self from memory. It was in the body, so I'm gonna actually use my purple purplish tint instead of a pink one, so that gives it a little bit of our difference while still its own brand. But then my client will be able to kind of differentiated templates a little bit easier, even though we're going to have a title for it, of course as well. So we're going to say that all of this other things will be the same in this case. I want need four blocks. I'm going. Teoh just need to and I'm going to feel those up with mine information. So that's going to be locations for the workshops on for the first column. I'm just going for you the little of this place it and I'm going to center it and I'm just the same like before. I'm going to start as a heading free and save I and do the same for column to relieve people of that, go back to my contents, center it apply, heading safe, and I'm going to fill out my call to action. Um, I'm going to say who is this course fall? I'm gonna I had this text over here in this block and I'm gonna center all of that and that's going to be my heading free and something to save that and the bottom will be request more information. So what I'm actually going to do is I'm gonna duplicate this guy and I'm gonna put who is this course for above. I'm going to and the space and this guy I'm actually going to replace. We've just a big interested heading one. It's already sent it, which is great. And I need space and save. And this button I'm going to replace to the cult action, which is going to be a male, too. It's a request. More information. It's email address and you can see that it gives ability that subject email, address and message putting. So I'm just going to replace them text and saving close. So that's pretty quick. So far. So far, we've just added a bit of text. I'm going to replicate this guy over here to have some more content. So I've got more, um, content over here. Show one to public Australian first would go some my bell, bold, bold, some text. And this will become my heading free and think I want to draw attention to that. I just I want to send all of that. Perhaps home is this content will swim, and I'm gonna replicate that. And this is well put the rest of the content safe. So this surely this space, I can become a little bit smaller. I'm just going to call it a 10 10. That's fine in this section I won't need because I'm just going to put ah, large image in hand said So I'm going to let that and I'm going back into my content and drag and drop on image block and I'm going to upload an image. I'm going to grab my image that I prepared earlier for the workshop. Let's have it. Dragon drop is easy as that and selected an insert. They all have it and I'm gonna make it. Um, I'm going to go all the way edge to edge safe and I'm gonna give it grab this space. A guy over here, get a little space through this workshop style so that we have it with just a little bit of imagery and non advanced customization. We've actually created on brand email and you can see how you can make small tweaks to this and customized even further. Of course, we've creating a little bit of imagery and on brand graphics that will help a lot. But even small things like phones and colors will help. You have the email to be on breath. So once you finalize this, all you can do is you can create. This is a saving exit, and it will take you to the complaints on. You can schedule and send the campaign or ultimately can save it. There's a new template which will do, and we'll call this stand along template a little safe and that's it. 9. Final Thoughts + Class Project: so that's exciting. Hope that you've enjoyed this cost. Show me a very small part of male cheap, and we've only been using the free account of male chimp as well. So as you can imagine, it contains a lot more functionality and features, and I've only covered tiny component of it. So I encourage you to go and explore the rest of the male Jim speeches. But what we've learned and covered in this class is we've created to email templates that will be able to use to create any ongoing newsletter or send along emails or email campaigns from within male gym. And that's part of your class project. I invite you to submit with a rough sketch on Illustrate a wire frame for your email. You can create more than one. If you wish to losses, submit this part of the cost project sent through a screen shot of what your final email looks like along with your brand style guide or any Branca bonnets that you're trying to cover. Also, remember that an email is only part of your digital marketing, their plant about the social media strategies involved in getting your brand out there. But that Check out my friend Nicholas. Social media strategy class. So I hope to see in my future classes. If you've enjoyed this class, I encourage it to follow me on skill share and go ahead on and and follow my classes in the future.