Send an Email with HTML template and context data from a Django project

2 min readOct 28, 2023

This article shows how you can send email with HTML template.

I believe you already have a Django project setup. I will show how you can do the email sending part.

Let’s get started!

Setup SMTP credentials in settings.py

EMAIL_BACKEND = 'django.core.mail.backends.smtp.EmailBackend'
EMAIL_HOST = 'smtp.gmail.com'   # Here I am using gmail smtp server 
EMAIL_PORT = 587       # gmail smtp server port
EMAIL_HOST_USER = 'username@mail.com'  # Use your email account
EMAIL_HOST_PASSWORD = 'xxxxxxxxxxxxxxxx' # For gmail use app password
EMAIL_USE_TLS = True     # for SSL communication use EMAIL_USE_SSL

html email template receiver_info.html

{% load static %}
<!DOCTYPE html>
<html>
<head>
    <style>
        /* Inline CSS */
        body {
            font-family: Arial, sans-serif;
            background-color: #f0f0f0;
        }

        .email-container {
            width: 100%;
            max-width: 600px;
            margin: 0 auto;
            background-color: #ffffff;
            border: 1px solid #dddddd;
            border-radius: 5px;
        }

        .header {
            background-color: #007bff;
            color: #ffffff;
            text-align: center;
            padding: 20px;
        }

        .content {
            padding: 20px;
        }

        .image {
            max-width: 100%;
            height: auto;
        }

        .footer {
            background-color: #f0f0f0;
            text-align: center;
            padding: 10px;
            font-size: 12px;
        }
    </style>
</head>
<body>
    <div class="email-container">
        <div class="header">
            <h1>This Email is sent from Django project</h1>
        </div>
        <div class="content">
            <p>Hello {{ receiver_name }},</p>
            <p>This is a sample email template for Medium article.</p>
            <p> Your Age is: {{ age }} </p>
            <img src=" static 'your/static/file/path'" alt="static image">
            <img src="https://codeskulptor-demos.commondatastorage.googleapis.com/GalaxyInvaders/back01.jpg" alt="Image 3" class="image">
            <p>Your Profession: {{ profession }}</p>
            <p> You are: {{ marital_status }}</p>
            <p>Your address: {{ address }}</p>
        </div>
        <div class="footer">
            &copy; {{ year }} ABC Inc. No rights reserved.
        </div>
    </div>
</body>
</html>

Send email with the html template from view or any function

from datetime import datetime
from django.core.mail import send_mail
from django.template.loader import render_to_string
from django.utils.html import strip_tags
from django.conf import settings


context = {
  "receiver_name": "Saium Khan",
  "age": 27,
  "profession": "Software Developer",
  "marital_status": "Divorced",
  "address": "Planet Earth"
  "year": 2023
}

receiver_email = "saium@abcinc.com"
template_name = "email/template/path/in/template/folder/filename.html"
convert_to_html_content =  render_to_string(
  template_name=template_name,
  context=context
)
plain_message = strip_tags(convert_to_html_content)

yo_send_it = send_mail(
  subject="Receiver information from a form",
  message=plain_message,
  from_email=settings.EMAIL_HOST_USER,
  recipient_list=[receiver_email,]   # recipient_list is self explainatory
  html_message=convert_to_html_content
  fail_silently=True    # Optional
)

# Optional: check if the `yo_send_it` return true or false

After email is sent successfully, You will receive the following email with context data rendered

Thank you for reading the article. Hope you enjoyed it.
My other articles on development and deployment.

Send an Email with HTML template and context data from a Django project

Let’s get started!

Written by Md. Abdullah Al Arif