Email Feedback Loop Footer Template

Gather valuable customer feedback with this simple and effective interactive email footer.

This template makes it effortless for users to give feedback with a single click. By embedding a simple rating system directly in the email, you can dramatically increase response rates compared to linking out to a traditional survey.

Screenshot of an email footer asking 'How was your experience?' with three clickable emoji faces for rating.

Get Source Code Preview

About this Feedback Loop Email Footer Template

This email footer turns every communication into an opportunity to listen to your customers. It features a clear question and a set of clickable icons that allow users to rate their experience. Each icon is a link that can point to a specific landing page (e.g., a thank you page for good reviews, or a contact form for bad reviews). The design is clean, engaging, and built with email-safe tables and inlined CSS for maximum reliability.

Features

One-Click Feedback: A simple, low-friction way for users to provide a rating.
Emoji Icon Placeholders: Uses emoji placeholder images to represent different satisfaction levels. These can be swapped with your own emojis.
Customizable Links: Each rating icon can be linked to a different URL to create a tailored follow-up experience.
Maximum Compatibility: Built with the standard approach of table-based layouts and inlined CSS for consistent rendering.
Legally Compliant: Includes a separate, unobtrusive section for the required unsubscribe link and address.

Ideal Use Cases

Post-purchase or order delivery follow-ups.
After a customer support interaction has been resolved.
Following a user's first major action in a SaaS app.
Net Promoter Score (NPS) style surveys.

Code Breakdown

The template is built with nested table elements for reliability. The main interactive section is a three-column table, where each td holds an a tag wrapping an img of an emoji placeholder image. This structure ensures the icons sit side-by-side with consistent spacing. The placeholder images can be replaced with your own icon images. The links for each icon can be customized with URL parameters (e.g., ?rating=good) to track responses. All CSS is inlined for maximum email client support.

Code

Here's the full code for the footer template:

<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" style="background-color:#f9f9f9;">
    <tr>
        <td align="center" style="padding:40px 20px;">
            
            <table border="0" cellpadding="0" cellspacing="0" width="600" role="presentation" style="width:600px; max-width:600px; background-color:#ffffff; border:1px solid #e0e0e0; border-radius:8px;">
                
                <tr>
                    <td align="center" style="padding:30px 20px;">
                        <table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
                            
                            <tr>
                                <td align="center" style="padding-bottom:15px;">
                                    <p style="margin:0; font-family: Arial, sans-serif; font-size:18px; line-height:24px; color:#333333; font-weight:bold;">
                                        How was your experience?
                                    </p>
                                </td>
                            </tr>
                            
                            <tr>
                                <td align="center">
                                    <table border="0" cellpadding="0" cellspacing="0" role="presentation">
                                        <tr>
                                            
                                            <td style="padding:0 15px;">
                                                <a href="https://example.com?rating=bad" target="_blank" style="text-decoration:none;">
                                                    <img src="https://placehold.co/60x60/f1c40f/ffffff?text=%3A%28" width="60" alt="Bad" style="width:60px; max-width:60px; display:block; border:0;">
                                                    <p style="margin:5px 0 0 0; font-family: Arial, sans-serif; font-size:12px; color:#555555;">Not Good</p>
                                                </a>
                                            </td>
                                            
                                            <td style="padding:0 15px;">
                                                <a href="https://example.com?rating=neutral" target="_blank" style="text-decoration:none;">
                                                    <img src="https://placehold.co/60x60/f1c40f/ffffff?text=%3A%7C" width="60" alt="Neutral" style="width:60px; max-width:60px; display:block; border:0;">
                                                    <p style="margin:5px 0 0 0; font-family: Arial, sans-serif; font-size:12px; color:#555555;">Okay</p>
                                                </a>
                                            </td>
                                            
                                            <td style="padding:0 15px;">
                                                <a href="https://example.com?rating=good" target="_blank" style="text-decoration:none;">
                                                    <img src="https://placehold.co/60x60/f1c40f/ffffff?text=%3A%29" width="60" alt="Good" style="width:60px; max-width:60px; display:block; border:0;">
                                                    <p style="margin:5px 0 0 0; font-family: Arial, sans-serif; font-size:12px; color:#555555;">Great!</p>
                                                </a>
                                            </td>
                                        </tr>
                                    </table>
                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
            
            <table border="0" cellpadding="0" cellspacing="0" width="600" role="presentation" style="width:600px; max-width:600px;">
                 <tr>
                    <td align="center" style="font-family: Arial, sans-serif; font-size:12px; line-height:18px; color:#777777; padding-top:30px;">
                        <p style="margin:0 0 10px 0;">&copy; 2025 Your Company, Inc. All rights reserved.</p>
                        <p style="margin:0;"><a href="https://example.com" target="_blank" style="color:#777777; text-decoration:underline;">Unsubscribe</a></p>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

View Output