Back to Medusa

{metadata.title}

www/apps/bloom/app/features/emails/page.mdx

2.14.25.6 KB
Original Source

import { InlineIcon, InProductAction, Kbd, getOsShortcut } from "docs-ui" import { ComputerDesktop, Phone } from "@medusajs/icons"

export const metadata = { title: Emails, }

{metadata.title}

Send professional, branded emails to your customers. Bloom creates email templates that match your store's branding and sends them to customers automatically when they place orders, create accounts, or for other important events.

How Emails Work

<InProductAction product={"bloom"} type={"MEDUSA_AI_OPEN_PANE"} data={{ pane: "emails" }}>Emails</InProductAction> are essential for your ecommerce store. They allow you to communicate with customers, provide order updates, and implement marketing campaigns. However, setting up email templates and automating them can be complex and time-consuming.

With Bloom, you can create and manage your email templates without any coding. Just tell Bloom what emails you want to send, and Bloom will create the templates for you.

You can preview your store's email templates, make changes, and send test emails to ensure they look perfect before going live.

When you publish your store, Bloom automatically sends the emails to customers based on the triggers you set up. For example, customers receive an order confirmation email immediately after placing an order.

<Note>

Emails only send from your live store. You can only send test emails in preview mode to yourself or anyone in your team.

</Note>

Create Email Templates with Bloom

Ask Bloom to create templates for any type of email you want to send to customers.

For example, if you want customers to receive an order confirmation email after they place an order, ask Bloom:

bash
Create an order confirmation email that shows order details, items ordered, and total price.
Customers should receive this email immediately after placing an order.

Bloom will set up the email template to match your store's branding and include the necessary information. You can then preview the email template and ask Bloom to make any changes you want.


Preview Email Templates

To open the <InProductAction product={"bloom"} type={"MEDUSA_AI_OPEN_PANE"} data={{ pane: "emails" }}>Emails</InProductAction> tab and preview your email templates:

  1. Press <Kbd>{getOsShortcut()}</Kbd> + <Kbd>k</Kbd> to open the preview tab switcher.
  2. Select the "Emails" tab from the list.

This will open the email preview where you can:

  1. Switch between email templates, see how they look on desktop and mobile, and make changes to the design and content.
  2. Copy prompts for common email templates to ask Bloom to create them for you.

Choose Email Template

If you have email templates, you can preview them at the left side of the Emails tab.

Clicking the template will preview its content in the main area on the right.

Adjust Preview Size

The email template preview is resizable, allowing you to see how the email looks on different screen sizes.

To change the preview size, you can:

  1. Click the <InlineIcon Icon={ComputerDesktop} alt="desktop" /> button to switch to desktop view.
  2. Click the <InlineIcon Icon={Phone} alt="mobile" /> button to switch to mobile view.
  3. Drag the sides of the preview at the top, left, bottom, or right to resize the preview and see how the email adapts to different screen sizes.

Adjust the preview size to make sure your email looks great on all devices.

Ask Bloom to Make Changes

If you're not satisfied with how the email looks, or you find issues in the preview, you can ask Bloom to make changes to the template.

You'll notice that the email template is added to your Bloom chat. This means Bloom is aware you're previewing the email and can make changes to it based on your prompts.

For example, you can ask Bloom to add new sections to the email:

bash
Add a section that shows the shipping address and estimated delivery date.

Bloom will update the email template to include the new section. You can then check the preview again to see how it looks.

Fix Design Issues

You can also ask Bloom to make fixes to the design. This is useful when previewing the email on different screen sizes. If you find issues, take a screenshot and ask Bloom to fix the design based on what you see in the preview.

For example:

bash
On mobile the text is too small and the buttons are
hard to click. Can you make the text bigger and the buttons larger on mobile?

Bloom will see the issue from the screenshot and update the template to fix the mobile design.


Start Sending Emails

Once you're done building your email templates with Bloom, you can test them in preview mode before publishing them to your live store.

Send Test Emails

To send a test email, simulate the flow that triggers the email in preview mode. You can only send test emails to yourself or anyone in your team.

For example, if you created an order confirmation email, you can try placing an order in preview mode using your email address. This will trigger the order confirmation email to be sent to you as a test.

Publish Email Templates

Once you're satisfied with your email templates and have tested them, you need to publish the changes to your live store for customers and admin users to start receiving the emails.

To publish the changes, click the "Publish" button at the top right of the preview and confirm publishing.

Once your changes are live, customers will start receiving the emails based on the triggers you set up.

For example, if you set up an order confirmation email, customers will receive that email immediately after placing an order.