Email Templates

Fyno's email templates allow you to create some exciting templates, be it for marketing or transactional communication.

📘

Don't forget to add a Subject for your email before getting started!

You can also add placeholders in the subject line, if you want to personalise it.

On Clicking Email, you can select one of the two editors that Fyno has:

  1. Stripo
  2. Unlayer
  3. HTML Editor

📘

Use HTML Editor, when you already have your HTML code. You can just paste your code in HTML editor.

Fyno recommends using the Stripo editor due to the ease of use as it supports AMP options giving you a wonderful and responsive email experience for your customers.

  1. You can create your own email template from scratch using either the email editor tool
  2. Add anything from Content or Blocks and edit the entire email format through the Body tabs on the left Navigation panel

    👍

    Blocks can be saved!

    On creating a block that you will use repeatedly in other templates, you can save it by clicking on the save button next to the block. Give it a name and a tag and you are good to go!.

    This will then be available under the "Blocks" section for you to use.

  3. Preview your created template by clicking on the "eye" icon in the bottom right corner. You can also see how your template looks on different devices.
  4. Save your design by clicking on the Save button.
  5. Clicking on Close Editor will allow you to discard the draft.
  6. Save and create different versions of the templates by hitting Save which will be Test versions. Use Save & Promote when you are ready to move your template into the "Live" version.

📘

To use any user property in your templates, you can add it in this format - {{$user.$<user_property>}}. For example, to add Name as placeholder from User profile, you can add it as {{$user.$name}}

How to override Sender details

To override the sender details configured in the Service Provider integration, follow the below steps

  1. Click 'Enter From and Cc/Bcc detals' above the Subject line.

  2. You will see the sender details as shown below.

  3. Once you enter the sender details, it will look as shown.

  4. To override Cc/Bcc details, click the CC/BCC tab and enter the details as shown.

  5. Once you entered Cc and Bcc details, it will look like shown below

📘

Cc and Bcc details provided in Email template will override the Cc and Bcc details provided in the Notification Event API

How to add attachments

You can add static as well as dynamic attachments to emails

📘

There is no limit to the number of attachments. However, maximum size of the attachment(s) should be 10MB. We support image (all formats), audio (all formats), video (all formats), doc, docx, xls, xlsx, csv, txt, application/pdf files

On clicking on the attach button (highlighted below) on the to right corner of the either Email editor, you will see:

Upload Files: Allows you to attach files from the system. This then stays as a static attachment in the body of the email and is sent along with the email as an attachment every time it's triggered.

Dynamic Placeholders: Allows you to include dynamic files within the email, when the notification event is triggered. You can use placeholders to specify the:

  • Filename - provide a static value like 'Invoice.pdf' (if you are testing it manually) or a placeholder like {{attachment.filename}}(if your are triggering notification event via API)
  • File type - provide a static value like 'application/pdf' (if you are testing it manually) or a placeholder like {{attachment.filetype}}(if your are triggering notification event via API). File type should be MIME type. You can get all the MIME types here
  • Content - provide the converted BASE64 file content (if you are testing it manually) or a placeholder like {{attachment.base64}}(if your are triggering notification event via API). You can also use any Presigned URL in the content.

📘

Please note that if you are using Presigned S3 URL, then the URL should trigger a download of the file immediately when opened.

Placeholders should be used if the attachment information is dynamic (for instance, a personalized attachment depending on the recipient). Typically such attachments are sent via an API call. To send dynamic attachments in the event payload, make sure that the data section of the payload has an object called attachment as shown below.

curl -X POST 'https://api.fyno.io/v1/{WorkspaceId}/test/event' \
-H 'Authorization: Bearer <API_KEY>' \
-H 'Content-Type: application/json' \
-d '{
    "event": "EmailWithAttachments",
    "to": {
        "email": "[email protected]"
    },
    "data": {
       "attachment":
        {
            "base64": "<BASE64 content>",
            "filename": "<attchement_file_name>",
            "filetype": "application/pdf"
       }
    }
}'

In the above command:

  1. Replace {WorkspaceId} with your actual Workspace ID.
  2. Replace <API_KEY> with your actual API key.
  3. Replace with the base64-encoded content of the attachment file..
  4. Replace with the name of the file attached.

Ensure to provide the correct filename and filetype for the attachment.

When sending dynamic attachments in the payload, we need to configure the dynamic placeholders as shown below.


❗️

You cannot use only numeric values as placeholder keys!


How to add multiple attachments

To add multiple attachments in email, add them in the placeholders as shown below.

  1. For file 1, you can give the below placeholders,
    1. Filename - {{attachment.filename.0}}
    2. File Type - {{attachment.filetype.0}}
    3. Content - {{attachment.base64.0}}
  2. Click 'Add Key'
  3. For file 2, you can give the below placeholders
    1. Filename - {{attachment.filename.1}}
    2. File Type - {{attachment.filetype.1}}
    3. Content - {{attachment.base64.1}}
  4. You can keep adding as many files. The total file size should not exceed 10MB.

📘

Please note that the content can be base64-encoded content or a Presigned URL


How to add multiple 'to' emails

Sample code with multiple 'to' details. You can add any no of emails to 'to'.

curl -X POST 'https://api.fyno.io/v1/{WorkspaceId}/test/event' \
-H 'Authorization: Bearer <API_KEY>' \
-H 'Content-Type: application/json' \
-d '{
    "event": "ReleaseNote",
    "to": {
       "email": ["[email protected]","[email protected]"]
    },
    "data": {
        "company": "Fyno",
        "key": "value"
    }
}'

How to add cc and bcc

Sample code with cc and bcc details. You can add any no of emails to cc and bcc.

curl -X POST 'https://api.fyno.io/v1/{WorkspaceId}/test/event' \
-H 'Authorization: Bearer <API_KEY>' \
-H 'Content-Type: application/json' \
-d '{
    "event": "ReleaseNote",
    "to": {
        "email": "[email protected]"
    },
    "data": {
        "name": "Rahul",
        "key": "value"
    },
    "channel": {
        "email": {
            "append": {
                "cc": [
                    {
                        "name": "name1",
                        "email": "[email protected]"
                    }
                ],
             "bcc": [
                    {
                        "name": "name2",
                        "email": "[email protected]"
                    }
                ]
            }
        }
    }
}'

In the sent logs, you'll find the recipient details (destination, cc, and bcc) in the Summary tab.

For the above scenario, the sent logs will display the following information.

How to add dynamic From_Email

During the integration setup, you would have specified a 'From_Email' address. If you have multiple email addresses such as [email protected], [email protected], [email protected], and you wish to use the appropriate email address depending on the communication you send, you can dynamically assign values to 'From_Email'. To achieve this, please follow the steps outlined below.

  1. Within the integrations popup, include 'from_email' as shown below. In this example, [email protected] will serve as the default From Email if the provided email ID in the payload is not valid. If you prefer not to use the default email, simply specify 'from_email' in the respective field.

📘

Adding a default 'from_email' is advisable to ensure uninterrupted communication.

  1. In the Notification event payload, you need to pass the from_email as shown below. By doing so, the emails triggered via this notification event will go from '[email protected]'.
curl -X POST 'https://api.fyno.io/v1/{WorkspaceId}/test/event' \
-H 'Authorization: Bearer <API_KEY>' \
-H 'Content-Type: application/json' \
-d '{
    "event": "ReleaseNote",
    "to": {
        "email": "[email protected]"
    },
    "data": {
        "name": "Rahul",
        "key": "value"
    },
    "channel": {
        "email": {
            "override": {
                “from_email": “[email protected]"
            }
        }
    }
}'

📘

The same process can be followed for 'from_name' field also.

How to test Email template

You can use this feature to conduct thorough testing of a template prior to its inclusion in any Notification Event. This ensures the early detection and resolution of any potential issues, ensuring a seamless user experience.

  1. Click 'Run Test' on the top right hand side of the template.
  2. It opens the pop up as shown below.
  1. Enter the email id of the recipient where the Email should be sent.
  2. Select a Email service provider which is already configured in Fyno.
  3. When you click 'TEST', it will send Email to the recipient with the selected service provider. You will see the success or failure message along with the link for Sent Logs.

How to add unsubscribe link in Header

To add Unsubscribe link in Header,

  1. Ensure that the email channel's state within the subscription topic is set to either On or Off.

  2. Make sure the email channel has the unsubscribe feature activated.

  3. Make sure the 'Enable one-click unsubscribe' checkbox is ticked.

  4. When an email is triggered with this subscription topic, Unsubscribe link will be automatically added in the Header.

  5. When user clicks Unsubscribe link, they will see a popup as shown.

  1. Once the user clicks Unsubscribe, their email will be added to Opt-out list for Email for that Subscription Topic.
  2. You can view all the users opted-out of any channel by clicking any Subscription Topic.

🚧

Add Right Subscription Topic to your Notification Event!

Unsubscribes are managed at Subscription topic level, so using the wrong Subscription Topic with a notification event can accidentally unsubscribe users from something they didn't intend.

📘

This is enabled only for SES and Postmark service providers now. Please reach out to us if you want to enable it for any other Email service provider.

How to add unsubscribe link in Footer

You can also add a Unsubscribe link in the footer by following these steps.

  1. In the email editor, add a block for Unsubscribe. Highlight the word Unsubscribe
  2. Click Link icon in the toolbar. It will add hyperlink to the word Unsubscribe.
  3. On the right hand side, the block section for Link will open. In that choose Other from the dropdown and enter the URL or enter {{$fyno.$unsubscribe.url}} if you want to shorten the URL using Fyno Shorty in the text box next to it.
  1. We suggest using the original URL rather than Fyno Shorty since the URL linked to the Unsubscribe option won't be visible to users. Thus, Fyno Shorty doesn't offer significant benefits in this context.

  2. When the user receives this email and clicks Unsubscribe link, the below popup opens to ask the user to confirm if they want to unsubscribe from this subscription topic.

  3. Once the user clicks Confirm, they will see the confirmation message as shown.

  4. If you mistakenly unsubscribed, you can resubscribe by clicking on 'Resubscribe' CTA. Once you resubscribed you will see success message like shown below.

  5. Once you have unsubscribed, we will add this email to the opt-out list in the respective subscription topic. When you try to send any email communication for the same topic, Fyno will exclude the user from the payload submitted to the service provider. So the user won't receive any email for this topic.

  6. In the Sent logs, you will see the below response if you send any notification to your unsubscribed users. SUBSCRIPTION " <Subscription_topic> - User opted-out from ()


How to view change logs

To view the history of all the modifications made to a template, you can utilize the change logs feature.

To do so, locate the history icon positioned at the top right corner of the template page, as shown in the image below, and click on it to view the change logs.

It shows the following details

  1. Who updated it
  2. Which version was updated
  3. At what date & time its updated.

How to add reusable components in your email

This feature helps you to create components which you would like to reuse in other emails like Header, Footer etc.

This helps you to avoid rework by creating same components in every email you create.

You can read about it here