Email marketing is a powerful marketing channel that uses email to promote your business products or services. Email marketing is a form of marketing that can make the customers on your email list aware of new products, discounts, and other services.
Here I will teach you how to create an HTML email with Maizzle and TailwindCSS.
To create a new project it's quite easy, you can look at the Maizzle Documentation like the code below :
npx degit maizzle/maizzle "your-project-name"
cd "your-project-name" and
You can start a development local server that watches in localhost with :
npm run dev
Maizzle already has a built in template that you can use, you can use it as your starter template.
HTML email structure use
td as layout. The idea is same as CSS Grid, every column behave like Grid which you can adjust the width using Tailwind
When using Email HTML often you need to put an image on the email. Since Email HTML doesn't support image assets, you can get the image by hosting your image online. Here I use imagekit.io to host my image. Simply upload and get the URL of the image to put in the src image tag then you are done. Don't forget to reduce the size since it opened between the length of an email.
Build production ready to send HTML emails that have inlined CSS and many other optimizations, by running the following command:
npm run build
You can view the result of build production in Build Production folder. Then copy and paste the HTML code to be ready to send to the email receiver.
Send your first HTML Email with Insert HTML by Designmodo extension google chrome.