EmailJS

# File attachments

Adding file attachments is possible in two ways – by passing the attachment content programmatically through the emailjs.send() call, or by allowing the user to upload a file. The latter is done by creating a form with a file input field, and sending the email via emailjs.sendForm(). To get started with either option first open your template editor - Attachments tab, and add an attachment.

# Static Attachments

Static attachments have no dynamic parameters but are loaded as static files. This attachment will be automatically sent with every email sent for your current template.

# Dynamic Attachments

Dynamic attachments are used to send attachments from your code.

# Attachment type

  • Choose Form File Attachment if you want to allow the visitors of your site to upload files and attach them to your email.
  • Choose Variable Attachment if you want to create an attachment programmatically, for example, a canvas image.

# Filename

Specifies the file name of the attachment (e.g. "image.png"). Can be a string or dynamic variable.

# Content type

Specifies the content type of the attachment (e.g. "PNG").

# Parameter name

Specifies the name of the input field for the file upload if you use Form File Attachment type. The input should be of type "file" and be part of the form passed to the emailjs.sendForm() call.

For the attachments of type Variable Attachment, this is the name of the template parameter. This field contains the content of the attachment encoded in Base64 or URL.

# Code Example

Below you can find examples for dynamic attachments.

# Form File Attachment

Here’s a simple front-end example of sending an email with one attachment, added via file upload:

function formSubmit(event) {
    event.preventDefault();
    emailjs.sendForm('YOUR_SERVICE_ID', 'YOUR_TEMPLATE_ID', this);
}


 



<form enctype="multipart/form-data" method="post" onsubmit="formSubmit()">
    <label>Attach file:</label>
    <input type="file" name="my_file"> 
    <input type="submit" value="Submit">
</form>

To run this example create a template with the attachment of type Form File Attachment, and set the parameter name as my_file.

# Variable Attachment

Here’s an example of sending canvas image as attachment.

function sendCanvasAsAttachment(canvas) {
    var base64 = canvas.toDataURL();
    emailjs.send('YOUR_SERVICE_ID', 'YOUR_TEMPLATE_ID', {
        content: base64
    });
}

To run this example create a template with an attachment of type Variable Attachment, and set the parameter name as content.

Note that the content should be passed in base64 format or URL. In the example above the toDataURL() method returns data encoded already to base64. To encode arbitrary content to base64 use btoa() method.

← Collecting contacts Embedded images →