Make.com + Brevo Integration: Email template not rendering content/variables

English
1

Hi everyone!

I’m working on a complex automated workflow and could really use your help troubleshooting an issue.

The Setup

I’ve created an automated workflow in Make .com that should send a personalized email when someone subscribes to our newsletter on our website. The email should contain a personalized horoscope report that:

  • Generates custom content based on the subscriber’s birth date
  • Substitutes variables (subscriber’s name, personalized horoscope content)

The Problem

The emails are being sent, but they arrive completely empty - no content whatsoever.

What I’m Using

  • Make .com for the automation workflow
  • Brevo for email sending
  • Custom HTML template in Brevo with variables for personalization

What I’ve Already Done

  • Set up the HTML template in Brevo with proper variable placeholders
  • Configured the Make. com workflow to trigger on newsletter subscription
  • Tested the workflow - emails are sent but arrive empty

Files/Screenshots

I upload the HTML code.

Would appreciate any insights on what might be causing the email content to not render properly. Is this a variable substitution issue, a template problem, or something with the Make.com-Brevo integration?

Thanks in advance for any help!

Weekly Horoscope body { font-family: Arial, sans-serif; background-color: #f8f9fa; margin: 0; padding: 20px; } .container { max-width: 600px; margin: 0 auto; background: white; border-radius: 20px; box-shadow: 0 10px 30px rgba(0,0,0,0.1); overflow: hidden; } .header { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; padding: 40px 20px; text-align: center; } .header h1 { margin: 0; font-size: 28px; font-weight: 700; } .content { padding: 40px 30px; } .greeting { font-size: 18px; color: #495057; text-align: center; margin-bottom: 30px; } .horoscope-text { font-size: 17px; line-height: 1.7; color: #2c3e50; background: #f8f9fa; padding: 30px; border-radius: 15px; border-left: 4px solid #667eea; margin: 20px 0; } .golden-text { color: #D4AF37; font-weight: 600; } .section-header { color: #667eea; font-size: 20px; font-weight: 700; margin: 30px 0 15px 0; border-bottom: 2px solid #667eea; padding-bottom: 8px; } .event-item { margin: 15px 0; padding: 15px; background: #f1f4ff; border-radius: 10px; border-left: 3px solid #667eea; } .event-date { font-weight: 700; color: #667eea; font-size: 16px; } .daily-item { margin: 12px 0; padding: 12px; background: #fafbfc; border-radius: 8px; border-left: 3px solid #D4AF37; } .daily-date { font-weight: 700; color: #D4AF37; font-size: 16px; } .tip-box { background: linear-gradient(135deg, #667eea20, #764ba220); padding: 20px; border-radius: 15px; margin: 20px 0; border: 1px solid #667eea30; } .divider { text-align: center; margin: 30px 0; } .footer { text-align: center; color: #7f8c8d; font-size: 14px; margin-top: 30px; } 
    /* Additional styles for dynamic content */
    .horoscope-text h1, .horoscope-text h2, .horoscope-text h3 {
        color: #667eea;
        margin-top: 25px;
        margin-bottom: 15px;
    }
    
    .horoscope-text h1 {
        font-size: 24px;
        text-align: center;
    }
    
    .horoscope-text h2 {
        font-size: 20px;
        border-bottom: 2px solid #667eea;
        padding-bottom: 8px;
    }
    
    .horoscope-text h3 {
        font-size: 18px;
        color: #D4AF37;
    }
    
    .horoscope-text ul {
        margin: 10px 0;
        padding-left: 20px;
    }
    
    .horoscope-text li {
        margin: 8px 0;
    }
    
    .horoscope-text strong {
        color: #667eea;
    }
    
    .horoscope-text p {
        margin: 15px 0;
    }
</style>

    <div class="header" style="border-radius: 0; margin-top: 0;">
        <h1>🔮 Your Weekly Horoscope 🌟</h1>
    </div>
    
    <div class="content">
        <div class="greeting">
            Dear <span class="golden-text">{{ params.first_name }}</span>!
        </div>
        
        <!-- Dynamic horoscope content from OpenAI API -->
        <div class="horoscope-text">
            {{ params.horoscope_content }}
        </div>
        
        <div class="divider">
            <div style="width: 60px; height: 3px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); margin: 0 auto; border-radius: 2px;"></div>
        </div>
        
        <div class="footer">
            <p>🌟 Thank you for joining us on this cosmic journey! 🌟</p>
            <p>With love,<br><strong>The Horoscope Fusion Team</strong></p>
        </div>
    </div>
</div>