Custom Desk.com Auto-Acknowledgement Email Theme (matches look & feel of the email notification theme)

1 - Read Me

This is a custom theme for the Desk.com Auto-Acknowledgement Email. It is styled to match the look and feel of the default email notification theme. If the private portal is enabled the My Cases link will display in the email.

2 - HTML Body

<table style="margin: 5px 15px 0 0; padding: 0px; background-color: #f9f9f9; border: 0px solid #e9e9e9; width: 100%; font-family: 'Open Sans',sans-serif; font-weight: 300; line-height: 19px; font-size: 13px;" border="0" cellpadding="0" cellspacing="0" width="100%">
  <tr>
    <td align="center" valign="top">
      
      <table cellspacing="0" cellpadding="0" border="0" style="background-color:#3498db;padding-top:10px;padding-bottom:10px;color:#fff;width:100%;text-align:center;font-weight:300;">
        <tbody><tr>
          <td>
            
            <span>{{system.snippets.response_above_this_line}}</span>
            
          </td>
          </tr>
        </tbody></table>
      
      <table border="0" cellpadding="0" cellspacing="0" width="100%">
        <tr>
          <td valign="top" style="color:#333; font-family:Arial; font-size:14px; line-height:150%; text-align:left;">
            
            <table border="0" cellpadding="10" cellspacing="0" width="100%">
              <tr>
                <td valign="top">
                  
                  <div>
                    
                    
                    
                    <h2 style="font-family: arial,sans-serif; color: #555; font-size: 18px; font-weight: 300;">{{email.subject}}</h2>
                    
                    <div style="border: 1px solid #e9e9e9; background-color: white; padding:25px;">
                      <strong>{{site.company_name}}</strong> &nbsp;|&nbsp; <span style="font-size:80%;">{{case.updated_at | in_time_zone: site.timezone | date: "%b %d, %Y %I:%M%p %Z"}}</span>
                      <br />
                      <br />
                      <!---Custom copy goes here---->
                      <span style="color:#999; font-weight: 300; font-size: 13px;">
                        Thanks for contacting us. We've received your case regarding {{email.subject | replace:'Re:','' }}. <br><br>
                        
                        We'll keep you up-to-date as we work on your inquiry. You can also add a comment by replying to this email at any time.<br><br>
                        
                        {{site.company_name}} Support Team
                      </span>
                      
                    </div>
                    
                    <br />
                    
                    
                    {% if site.portal_authentication_enabled_config %}
                    {% if site.myportal_enabled %}     
                    <table cellspacing="0" cellpadding="0" border="0" style="width:100%">
                      <tbody><tr>
                        <td>&nbsp;</td>
                        <td style="overflow:hidden;padding-top:10px;padding-bottom:10px;background-color:#e95445;width:185px; text-align: center;">
                          <a id="view-case" href="https://{{site.subdomain}}.desk.com/customer/{{system.language}}/portal/private/cases/{{case.id}}" style="color:#fff;text-decoration:none;text-align:center" target="_blank">View Case</a>
                        </td>
                        <td>&nbsp;</td>
                        </tr>
                      </tbody></table>
                    {% endif %}
                    {% endif %}
                    
                    <div style="background-color:#fafafa; border:0; font-size:80%; padding:2px; border-top: 1px solid #e9e9e9; margin-top: 25px; padding-top: 25px; text-align: center; color: #999; font-weight: 300; font-size: 13px;"> {{system.snippets.message_was_sent_to}} {{case.customer.email}} {{system.snippets.in_reference_to_case}}{{case.id}}.
                      
                    </div>
                    
                  </div>
                  
                </td>
              </tr>
            </table>
            
          </td>
        </tr>
      </table>
      
    </td>
  </tr>
</table>