Customizing NetSuite Email Templates for Branding

1. Adding a Company Logo

The company logo is a key element of brand identity. Upload your logo to the File Cabinet in NetSuite, then reference its URL in the email template.

HTML Code Example:

<div style="text-align: center; padding: 20px;">
  <img src="https://yoursite.com/logo.png" alt="Company Logo" style="width: 150px; height: auto;">
</div>

2. Using Brand Colors

Incorporate your brand’s primary and secondary colors to create a cohesive look. You can style headers, buttons, and text using inline CSS.

HTML Code Example:

<div style="background-color: #003366; color: #ffffff; text-align: center; padding: 15px;">
  <h1>Welcome to [Your Company]</h1>
</div>
<p style="color: #003366; font-size: 16px;">
  We are thrilled to have you with us. Explore our services and let us know how we can help you succeed.
</p>
<a href="https://yoursite.com" style="background-color: #ffcc00; color: #003366; padding: 10px 20px; text-decoration: none; font-weight: bold; border-radius: 5px;">
  Learn More
</a>

3. Customizing Fonts

Use fonts that match your company’s style. For maximum compatibility across email clients, stick to web-safe fonts like Arial or Helvetica.

HTML Code Example:

<p style="font-family: Arial, sans-serif; font-size: 14px;">
  Thank you for your interest in [Your Company]. We're here to provide you with the best service possible.
</p>

4. Personalizing with Tokens

NetSuite tokens allow dynamic content insertion, making each email unique to the recipient. Use tokens for customer names, order numbers, and other personalized details.

HTML Code Example:

<p>Hello, {{customer.firstname}},</p>
<p>We’re excited to let you know that your order #{{transaction.number}} has been shipped!</p>

5. Adding Social Media Links

Enhance your emails with clickable social media icons to drive traffic to your profiles.

HTML Code Example:

<div style="text-align: center; margin-top: 20px;">
  <a href="https://facebook.com/YourCompany" target="_blank">
    <img src="https://yoursite.com/facebook-icon.png" alt="Facebook" style="width: 24px; margin: 0 5px;">
  </a>
  <a href="https://twitter.com/YourCompany" target="_blank">
    <img src="https://yoursite.com/twitter-icon.png" alt="Twitter" style="width: 24px; margin: 0 5px;">
  </a>
</div>

Example: Branded Email Template

Here’s a complete example combining all the elements:

<div style="font-family: Arial, sans-serif; color: #333333; line-height: 1.5;">
  <!-- Header -->
  <div style="background-color: #003366; color: #ffffff; text-align: center; padding: 20px;">
    <img src="https://yoursite.com/logo.png" alt="Company Logo" style="width: 150px; height: auto;">
    <h1>Welcome to [Your Company]</h1>
  </div>
  
  <!-- Body -->
  <p>Hello, {{customer.firstname}},</p>
  <p>We’re thrilled to have you onboard. Your order #{{transaction.number}} is on its way! Feel free to reach out if you have any questions.</p>
  
  <!-- Call to Action -->
  <div style="text-align: center; margin: 20px 0;">
    <a href="https://yoursite.com" style="background-color: #ffcc00; color: #003366; padding: 10px 20px; text-decoration: none; font-weight: bold; border-radius: 5px;">
      Visit Our Website
    </a>
  </div>
  
  <!-- Footer -->
  <div style="text-align: center; color: #777777; font-size: 12px; margin-top: 20px;">
    <p>Follow us on:</p>
    <a href="https://facebook.com/YourCompany" target="_blank">
      <img src="https://yoursite.com/facebook-icon.png" alt="Facebook" style="width: 24px; margin: 0 5px;">
    </a>
    <a href="https://twitter.com/YourCompany" target="_blank">
      <img src="https://yoursite.com/twitter-icon.png" alt="Twitter" style="width: 24px; margin: 0 5px;">
    </a>
    <p>© 2024 [Your Company]. All rights reserved.</p>
  </div>
</div>