Employee Referral Email

Email details

Client nameLogo URLBanner URL

Optional. Leave empty and the banner row is removed from the output.

The client name populates the logo alt text and the footer copyright line. ATS merge fields such as {sWebsiteTitle}, {sRecipient} and {sJobDetails} are left in place for the ATS to resolve.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{sWebsiteTitle}</title>

<style>
body {
    margin: 0;
    padding: 0;
    background-color: #f5f5f5;
    font-family: Arial, Helvetica, sans-serif;
    color: #333333;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

img {
    border: 0;
    display: block;
    max-width: 100%;
    height: auto;
}

a {
    color: #333333;
}

.email-wrapper {
    width: 100%;
    background-color: #f5f5f5;
}

.email-container {
    width: 620px;
    max-width: 620px;
    background-color: #ffffff;
}

.logo {
    padding: 25px 20px;
    background-color: #ffffff;
    text-align: left;
}

.logo img {
    width: 140px;
    max-width: 100%;
    height: auto;
}

.banner img {
    width: 620px;
    max-width: 100%;
    height: auto;
}

.email-content {
    padding: 30px;
    color: #444444;
    font-size: 15px;
    line-height: 1.6;
}

.job-details {
    padding: 20px 0;
}

.footer {
    padding: 20px 30px;
    background-color: #f5f5f5;
    color: #777777;
    font-size: 12px;
    line-height: 1.5;
    text-align: center;
}

@media only screen and (max-width: 640px) {
    .email-container {
        width: 100% !important;
    }

    .email-content {
        padding: 20px !important;
    }

    .logo {
        padding: 20px !important;
    }

    .logo img {
        width: 140px !important;
    }

    .footer {
        padding: 20px !important;
    }
}
</style>
</head>

<body>
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" class="email-wrapper">
    <tr>
        <td align="center">
            <table role="presentation" width="620" cellpadding="0" cellspacing="0" border="0" class="email-container">
                <tr>
                    <td class="logo" align="left">
                        <img src="#" alt="Client Name Logo" width="140">
                    </td>
                </tr>

                <tr>
                    <td class="email-content">
                        Hi {sRecipient},<br><br>

                        Here is an opportunity I found at {sWebsiteTitle} that might be of interest to you.

                        <table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0">
                            <tr>
                                <td class="job-details">
                                    {sJobDetails}
                                </td>
                            </tr>
                        </table>

                        To find out more about {sWebsiteTitle}, visit the careers website.
                    </td>
                </tr>

                <tr>
                    <td class="footer">
                        Copyright &copy; Client Name
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>
</body>
</html>

Employee Referral Email

Email details

Generated HTML