HTML email templates in Flask - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to send an HTML email using Flask-Mail.

Flask

from flask_mail import Message
msg = Message(subject='Hello', recipients=['[e-mail]'])
msg.[1] = '<h1>Welcome!</h1><p>This is an HTML email.</p>'

Drag options to blanks, or click blank then click option'

Acontent

Bbody

Ctext

Dhtml

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'body' instead of 'html' for HTML content.

Using 'text' which is for plain text emails.

The html attribute of Message sets the HTML content of the email.

2fill in blank

medium

Complete the code to render an HTML email template with Flask's render_template.

Flask

from flask import render_template
html_content = render_template('[1]', username='Alice')

Drag options to blanks, or click blank then click option'

Aemail_template.html

Bemail_template.txt

Cemail_template.py

Demail_template.css

Attempts:

3 left

💡 Hint

Common Mistakes

Using a text or CSS file instead of an HTML template.

Using a Python file as a template.

HTML email templates usually have the .html extension to be rendered properly.

3fill in blank

hard

Fix the error in the code to send an HTML email with Flask-Mail.

Flask

msg = Message('Greetings', recipients=['[e-mail]'])
msg.body = 'Hello!'
msg.[1] = '<p>This is an HTML email.</p>'
mail.send(msg)

Drag options to blanks, or click blank then click option'

Atext

Bmessage

Chtml

Dcontent

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'content' or 'text' instead of 'html'.

Trying to set 'message' attribute which does not exist.

The correct attribute to set HTML content is html. Using content or text will not render HTML.

4fill in blank

hard

Fill both blanks to create a dictionary comprehension that maps usernames to their email HTML content.

Flask

emails = {user: render_template([1], username=user) for user in users if user [2] 'admin'}

Drag options to blanks, or click blank then click option'

A'email_template.html'

B==

C!=

D'admin'

Attempts:

3 left

💡 Hint

Common Mistakes

Using '==' instead of '!=' to exclude 'admin'.

Using a non-HTML template file.

The template file is 'email_template.html'. The condition excludes the user 'admin' using '!='.

5fill in blank

hard

Fill all three blanks to create a dictionary comprehension filtering users and rendering HTML emails.

Flask

emails = [1]: render_template('email_template.html', username=[2]) for [3] in users if [2] != 'guest'}}

Drag options to blanks, or click blank then click option'

Auser.upper()

Buser

Dusername

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'username' as loop variable which is undefined.

Not using uppercase for keys.

The keys are uppercase usernames using user.upper(). The value uses user as the username. The loop variable is user.

Practice

1. What is the main purpose of using HTML email templates in Flask applications?

easy

A. To create visually appealing and structured email content

B. To speed up the sending of emails

C. To store email addresses securely

D. To encrypt email messages automatically

Solution

1. Step 1: Understand what HTML email templates do

   HTML email templates help format emails with colors, images, and layout to look professional.

2. Step 2: Identify the purpose in Flask context

   Flask uses templates to generate this HTML content dynamically for emails.

3. Final Answer:

   To create visually appealing and structured email content -> Option A

4. Quick Check:

   HTML email templates = visually appealing emails [OK]

Hint: HTML templates make emails look nice and professional [OK]

Common Mistakes:

• Confusing template purpose with email sending speed
• Thinking templates store email addresses
• Assuming templates encrypt emails

2. Which Flask function is commonly used to render an HTML email template from a file?

easy

A. render_template_string()

B. make_response()

C. send_email()

D. render_template()

Solution

1. Step 1: Recall Flask template rendering functions

   Flask provides render_template() to render templates from files and render_template_string() for strings.

2. Step 2: Identify the function for file templates

   For HTML email templates stored as files, render_template() is used.

3. Final Answer:

   render_template() -> Option D

4. Quick Check:

   File template rendering = render_template() [OK]

Hint: Use render_template() for file-based HTML templates [OK]

Common Mistakes:

• Using render_template_string() for file templates
• Confusing send_email() as a Flask function
• Using make_response() for rendering templates

3. Given this Flask code snippet for sending an email, what will be the content type of the email sent?

from flask_mail import Message
msg = Message(subject='Hello', recipients=['[e-mail]'])
msg.html = render_template('email.html', name='Alice')

medium

A. HTML formatted email

B. JSON formatted email

C. Multipart email with attachments

D. Plain text email

Solution

1. Step 1: Check how email content is set

   The code sets msg.html using render_template(), which produces HTML content.

2. Step 2: Understand Flask-Mail behavior

   Setting msg.html sends the email as HTML formatted content.

3. Final Answer:

   HTML formatted email -> Option A

4. Quick Check:

   msg.html set = HTML email [OK]

Hint: Setting msg.html sends HTML email content [OK]

Common Mistakes:

• Assuming plain text because no msg.body set
• Thinking attachments are included automatically
• Confusing JSON format with email content

4. Identify the error in this Flask email template rendering code:

msg = Message('Hi', recipients=['[e-mail]'])
msg.html = render_template('email_template.html')
send_email(msg)

medium

A. render_template() requires variables passed

B. msg.html should be msg.body

C. send_email() is not a Flask-Mail function

D. Message requires sender argument

Solution

1. Step 1: Check Flask-Mail sending function

   Flask-Mail uses mail.send(msg) to send emails, not send_email().

2. Step 2: Verify other parts

   Setting msg.html is correct for HTML content, and sender is optional if configured globally.

3. Final Answer:

   send_email() is not a Flask-Mail function -> Option C

4. Quick Check:

   Flask-Mail send = mail.send() [OK]

Hint: Use mail.send() to send emails, not send_email() [OK]

Common Mistakes:

• Using send_email() instead of mail.send()
• Confusing msg.html with msg.body
• Thinking sender is always required in Message

5. You want to send a personalized HTML email in Flask using a template that includes the user's name and a list of their favorite items. Which approach correctly combines rendering and sending the email?

hard

A. Use render_template_string() without variables, set msg.html, then mail.send(msg)

B. Render template with variables, set msg.html, then use mail.send(msg)

C. Set msg.body with template filename, then call mail.send(msg)

D. Set msg.html to plain text, then call mail.send(msg)

Solution

1. Step 1: Render template with variables

   Use render_template() passing user's name and list to generate HTML content.

2. Step 2: Assign rendered HTML to msg.html and send

   Set msg.html to the rendered content and send with mail.send(msg).

3. Final Answer:

   Render template with variables, set msg.html, then use mail.send(msg) -> Option B

4. Quick Check:

   Render with vars + msg.html + mail.send() = correct [OK]

Hint: Render with variables, assign to msg.html, send with mail.send() [OK]

Common Mistakes:

• Setting msg.body to template filename instead of content
• Not passing variables to render_template()
• Sending plain text in msg.html