Design your own email templates directly from the Strapi CMS admin panel and use the magic to send programmatically email from your controllers / services.

Visual composer provided by Unlayer

Install Strapi with this Quickstart command to create a Strapi project instantly:

• (Use yarn to install the Strapi project (recommended). Install yarn with these docs.)

# with yarn
yarn create strapi-app my-project --quickstart

# with npm/npx
npx create-strapi-app my-project --quickstart

This command generates a brand new project with the default features (authentication, permissions, content management, content type builder & file upload). The Quickstart command installs Strapi using a SQLite database which is used for prototyping in development.

• Add the strapi-designer plugin

yarn add strapi-plugin-email-designer@latest

# or

npm i -S strapi-plugin-email-designer@latest

• After successful installation you've to build a fresh package that includes plugin UI. To archive that simply use:

yarn build && yarn develop

# or

npm run build && npm run develop

• or just run Strapi in the development mode with --watch-admin option:

yarn develop --watch-admin

#or

npm run develop --watch-admin

The Email Designer plugin should appear in the Plugins section of Strapi sidebar after you run app again.

1. Design your template with easy on the visual composer

2. Send email programmatically:

{
  // ...

  const templateId = "[GET_THE_TEMPLATE_ID]",
    to: "[email protected]",
    from: "[email protected]",
    replyTo: "[email protected]",
    subject: "[TEST] This is a test using strapi-email-designer",
    userData: {
      firstname: "Alex",
      lastname: "Zaganelli",
      email: "[email protected]",
    };

  try {
    await strapi.plugins["email-designer"].services.email.send({
      templateId,
      to,
      from,
      replyTo,
      subject,
      data: userData,
    });
  } catch (err) {
    strapi.log.debug("📺: ", err);
    return ctx.badRequest(null, err);
  }

  // ...
}

3. or simply get the composed body mail

{
  // ...

  const templateId = "[GET_THE_TEMPLATE_ID]",
    userData: {
      firstname: "Alex",
      lastname: "Zaganelli",
      email: "[email protected]",
    };

  const { composedHtml, composedText } = await strapi.plugins["email-designer"].services.email.compose({
    templateId,
    data: userData,
  });

  // ...
}

Enjoy 🎉

Complete installation requirements are exact same as for Strapi itself and can be found in the documentation under Installation Requirements.

Supported Strapi versions:

• Strapi v3.4.x

(This plugin may work with the older Strapi versions, but these are not tested nor officially supported at this time.)

Node / NPM versions:

• NodeJS >= 12.10 <= 14
• NPM >= 6.x

We recommend always using the latest version of Strapi to start your new projects.

• Template composer helper
• Import design functionality
• Preview email with real data
• Override Strapi's core email system
• Tags functionality
• Custom components extension
• Complete UI tests
• i18n translations

Feel free to fork and make a Pull Request to this plugin project. All the input is warmly welcome!

Give a star if this project helped you. You can also offer me a beer 🍻.

• NPM package
• GitHub repository

• For general help using Strapi, please refer to the official Strapi documentation.
• Strapi Slack channel
• You can DM me on Twitter

MIT License Copyright (c) 2020 Alex Zaganelli & Strapi Solutions.