​
Introduction to EmailJS

EmailJS lets you send emails directly from client-side code. You can create dynamic templates and trigger emails with just a few lines of JavaScript.

​
Step by Step Tutorial

This tutorial walks you through setting up EmailJS to send emails directly from your Magic Patterns design with no database required.

1

Create an EmailJS Account

Create an EmailJS account and connect your email service.

1

Go to EmailJS and create a free account.

Create a free EmailJS account.

2

Add new email service.

Navigate to Email Services and click Add New Service.

3

Choose your email provider.

Choose from services like Gmail, Outlook, or a custom SMTP server.

2

Create an Email Template

1

Go to the Email Templates section and create a new template.

2

Navigate to Code Editor and edit your content.

Click Edit Content and then Code Editor. We recommend replacing the body of the message with the following code, which is a placeholder that will be replaced with the content of the email:

{{content}}

Ask Magic Patterns to design an email template to customize the look and feel of your emails.

3

Add your Domain

Go to Account → Security and add an approved domain for email sending (e.g. yourdomain.com).

4

Collect Required Credentials

  • EmailJS Public Key: can be found under Account → API Keys.
  • Service ID: can be found under Email Services.
  • Template ID: can be found under Email Templates → Settings.
5

Prompt Magic Patterns to integrate EmailJS

Use the Select tool to click on your call to action button if applicable. Then, enter the following prompt:

Implement the "Try Beta" email sign up form using EmailJS to send an email.

EmailJS Public Key: {{emailjs_public_key}}
Service ID: {{service_id}}
Template ID: {{template_id}}

Inside my email template, it just takes a body with the parameter "{{content}}". Please just send me the user inputted email.

​
FAQ