Forums/Documentation/Configuring and using your email channel

Customizing your email templates

Anton de Young
posted this on August 19, 2011 11:26

All the email notifications sent from your Zendesk are formatted for both HTML and plain text emails. Both formats are included in each email. The version end-users see depends on the preference settings of their email clients. You can customize the HTML template to match your branding by making a few simple style changes. You can also edit the information in the text versions of your emails.

The look and feel of the emails are controlled by an HTML template and a text template.

To edit the email templates
  1. Click the Manage icon () in the sidebar, then select Channels > Email.
    Zendesk Classic: Select the Setting menu, then select Channels > Email > Edit.
  2. Modify the email templates.

    If you need help, see the following topics:

  3. If you want to start over with the unmodified version of the template, click the Revert to Default link below the template.
  4. Click Save.
In addition to customizing the email templates, you can change emails as follows:

Tip: If you have the Plus or Enterprise plan, you can modify and test email changes in a sandbox before deploying them publicly. See Testing changes in your sandbox.

Editing the HTML template

You can change the appearance of HTML emails by editing the HTML and CSS in the HTML template.

This section covers the following topics:

Note: If you signed up to Zendesk before July 12th, 2012, you have a different HTML template. See Editing the old HTML template for instructions. If you want to upgrade to the new template, see Switching to the new HTML template.

Changing the appearance of HTML emails

The HTML template consists of DIV tags and system placeholders.

The placeholders supply most of the content to the email. The {{delimiter}} and {{content}} placeholders are required and should not be deleted. The {{footer}} placeholder is optional. No other placeholder can be used in the template. For more information, see Understanding the system placeholders.

The DIV tags apply CSS styles to the content. By adding or modifying CSS styles, you can change the look and feel of the email as a whole, the delimiter, or the footer. To edit the styles, open the Email channel settings page and scroll down to Email Templates. Make sure to click Save when you're done.

Here's the relevant code in the template (reformatted slightly for clarity):

<div style="padding: 10px; 
            line-height: 18px;
            font-family: 'Lucida Grande',Verdana,Arial,sans-serif;
            font-size: 12px;
            color:#444444;" >

  <div style="color: #b5b5b5;">
   {{delimiter}}
  </div>

 {{content}}

  <div style="color: #aaaaaa;
              margin: 10px 0 14px 0;
              padding-top: 10px;
              border-top: 1px solid #eeeeee;" >
    {{footer}}. Delivered by <a href="http://www.zendesk.com" style="color:black" target="_new">Zendesk</a>.
  </div>

</div>

For example, here's how to change the font color of the footer to teal:

...
 <div style=" color: #009966;
              margin: 10px 0 14px 0;
              padding-top: 10px;
              border-top: 1px solid #eeeeee;" >
    {{footer}}.  Delivered by <a href="http://www.zendesk.com" style="color:black" target="_new">Zendesk</a>.
  </div>
...

The font color is set to teal's hexadecimal value with the following style declaration:

color: #009966;
Note:The color of links can't be customized. Links are styled with CSS pseudo classes such as :hover. Example:a:hover {color:#FF00FF;}. Unfortunately, CSS pseudo classes are not supported in inline CSS, and major email clients like Gmail strip out any CSS that is not inline.

To add an image such as a company logo to the template, insert an IMG tag that references the image. Example:

<img src="http://YOURWEBSITE.com/logo.png"/>
Note: Before adding logos and other images, remember that most email clients don't display images by default.
If you want to add a hyperlink to the logo, enclose the IMG tag in an anchor tag, as in this example:
<a href="http://YOURACCOUNT.zendesk.com"><img src="http://YOURWEBSITE.com/logo.png"></a>
For more information, see the following resources:

Guidelines for customizing HTML emails

You can customize the HTML template extensively. However, keep in mind that designing HTML emails is hard because of the way HTML and CSS are rendered in different web browsers and email clients. Certain types of formatting can even be interpreted as spam. In general, keep your customization as simple as possible and follow these guidelines:
  • Do not use CSS3 style declarations. Stick to CSS1 or 2.
  • Do not add more DIV sections.
  • Do not use<style>...</style>to apply styles. Most email clients strip out the tag.
  • Keep text formatting to a minimum. Lots of bold text can trigger spam filters.
  • HTML5 is not yet supported, so don't use it.
  • Don't add lots of images (another trigger for spam filters) and downscale the images that you do use.
  • Use the ALT tag on all images. The tag displays a description of the image before users allow the images to be displayed.
  • If you know the width and height of the image, define it. This forces the email client to reserve the image space in the layout of the email before the images have been downloaded.
  • Background images are not supported in all email clients, so don't rely on them for information or functional design.

Editing the old HTML template

If you signed up to Zendesk before July 12th, 2012, you have a different HTML email template. Refer to this section to customize it. If you want to upgrade to the new template, see Switching to the new HTML template.

The older version of the template consists of the email text delimiter, a header, the content area, and the footer. All of them are contained within an HTML table.

The template also includes system placeholders that insert the delimiter, header, footer, and ticket content. The {{delimiter}} and {{content}} placeholders are required. The {{header}} and {{footer}} placeholders are optional. See Understanding the system placeholders.

You can make minor changes to the HTML to make simple branding changes. For example, here's how to set the background and font colors of the header and footer (relevant code in bold):

<td style="font-size: 12px;
            font-weight: bold;
            color: #fff;
            line-height: 1.5em;
            font-family: Helvetica, Arial, sans-serif;
            width: 100%;
            text-align: center;
            background: #98c332; 
            padding:8px; 
            margin:4px">
  {{header}}
</td>

...

<td style="font-size: 12px;
            font-weight: bold;
            color: #fff;
            line-height: 1.5em;
            font-family: Helvetica, Arial, sans-serif;
            width: 100%;
            text-align: center;
            background: #98c332;
            padding:8px">
  {{footer}}
</td>

The font color is set with this style declaration:

color: #fff;
The background color is set with this style declaration:
background: #98c332;

For a great example of a customized email template complete with sample files, check out Ben Lucier's post A better email template for Zendesk in our Community forums.

Switching to the new HTML template

If you signed up to Zendesk before July 12th, 2012, you have an older version of the HTML email template. To learn about the new version, see Introducing an all new email notification template by Jake Holman.

You can upgrade to the new version as follows.

  1. Click the Manage icon () in the sidebar, then select Channels > Email.
    Zendesk Classic: Select the Setting menu, then select Channels > Email > Edit.
  2. Scroll down to the Email Templates section.
  3. If you customized the existing legacy template, you may want to paste the markup in a separate file as a backup.
  4. Select the Enable modern template option.

    The markup for the new template replaces the old markup.

  5. Click Save to start using the new template with your emails, or customize it first. See Changing the appearance of HTML emails.

Editing the text template

The text template is used when the user elects not to read email messages in HTML format. To edit the text template, open the Email channel settings page and scroll down to Email Templates. Make sure to click Save when you're done.

The text email template consists of two system placeholders:

{{content}}

{{footer}}

The {{content}} placeholder inserts the text delimiter, the ticket title, the text that is generated from business rules (triggers, automations, or macros), and the ticket comments. The {{footer}} placeholder is optional. You can remove it if you want. For more information, see Understanding the system placeholders.

Note:The {{delimiter}} placeholder is not required in the text template. The {{content}} placeholder contains the delimiter text.

If you'd like to add a line to your emails, simply add it to the template.

Thanks for contacting MondoCam Support!

{{content}}

{{footer}}

Showing user profile photos in HTML emails

To show user profile photos next to ticket comments in HTML emails, select the Show User Profile Photos in Emails option on the Channels/Email page.

Be aware of the costs and benefits of displaying profile photos. On the positive side, pictures lead to a more personal experience for your customers. On the negative side, most email clients don't display images by default.

The emails display the photos from Zendesk account profiles or from Gravatar. If you want to display your company logo next to ticket comments, upload it to Zendesk as your profile photo. Make sure the image size ratio is 1:1. The recommended size is 200x200px.
Note: The various rendering engines used by mail clients and web browsers may affect the quality of the images.

Adding or removing ticket links in emails

Your email notifications can provide a link back to the ticket being discussed. Example:

This type of link is defined in a trigger or automation, not in the template. For example, most of the default triggers have an action that sends an email notification with a link to a ticket. If you provide support with email only, you don't want customers to see a link to a ticket that would prompt them to log in. In this case, you must edit your triggers or any other business rules that generate email notifications.

To add or remove a ticket link in a notification trigger or automation
  1. Click the Manage icon () in the sidebar, then select Triggers or Automations.
  2. Locate the notification trigger or automation and select Edit.
  3. Modify the action or actions as needed.

    The following placeholders insert ticket links in the email body: {{ticket.url}} or {{ticket.id}}.

  4. Click Update.
For more information on editing triggers to remove ticket links, see Removing placeholders that contain URLs from your notification triggers.

If you provide support through email only, see Setting up to provide email-only support. The article describes how to remove links back to your Web portal that would prompt your end-users to attempt to log in.

Editing the delimiter text and supporting other languages

The text in the email delimiter is used to inform the email recipient that any text entered into a reply must be above a certain line in the email.

When the recipient's reply is received in Zendesk, the delimiter is used to separate old content from new. The new content is added to the ticket as a comment. Without the delimiter, each ticket comment would contain the entire content of the email.

You can change the delimiter text. The setting is located on the same Email channel settings page as the email template, under Mail Delimiter. The text must be between 20 to 65 characters long.

If you support multiple languages in your Zendesk, replace the delimiter text with the {{txt.email.delimiter}} placeholder.

When you use this placeholder, the text in the delimiter is drawn from the translations that are provided for the languages supported in Zendesk. The language shown in the email message is based on each user's language preference. This is a convenient way to support different language versions in your email template. However, it also means that you have no control over the words in the translated versions of the delimiter. The default text string and the translated versions should suffice.

Note: If your users don't have a language preference selected, as is the case with unverified users in a Zendesk set up for email-only support (see Setting up to provide email-only support), the delimiter is displayed in your primary (default) language.

Using Liquid markup

Liquid markup does not work in the email templates. It only works in the business rules (triggers, automations) that generate the email notifications.

If you want to use Liquid markup to have more control over the content of email notifications, see Using Liquid markup to customize comments and email notifications.

Understanding the system placeholders

Most of the content in notification emails is generated dynamically by the Zendesk system. The dynamically generated content is represented by placeholders in the email templates. The placeholders are enclosed in double curly quotes, such as {{footer}}.

The placeholders insert delimiter text, the email contents, and a footer.

{{delimiter}}
Displays the line "##- Please type your reply above this line -##". The delimiter is used by the system to separate old content from new. When a person replies to an email, the new content in the reply is added to the ticket as a comment. This placeholder is required in the HTML template. For more information, see Editing the text in the mail delimiter and supporting other languages.
{{content}}
Displays the email content, which can include ticket comments and user profile photos. The content is defined in the trigger, automation, or anything else that sends email from your account. See Streamlining workflow with ticket updates and triggers.
{{footer}}
Optional. Displays the line "This email is a service from YourZendeskName." It also displays ticket properties, such as status and requester, in emails sent to agents. The properties are not displayed in emails sent to end-users. The list of properties can't be customized at this time.
 

Comments

User photo
Pedro

Hi there!

Is there any way to change this particular default text to something else?

"...
Your request (xx) has been received, and is being reviewed by our support staff.

To add additional comments, reply to this email or follow the link below:
..."

March 14, 2012 05:17
User photo
Pedro

Also for the "first" user notification email:

"...

A ticket (xx) by USERNAME has been received. It is unassigned.

Review it by following the link below: 

 ..."

March 14, 2012 05:25
User photo
Pedro

Scrap that.
It's so easy!


Go to "Manage" > "Triggers & mail notifications" > edit "Notify requester of received request"

That's it! Now you can edit the email body to your liking.

The same applies to the "Notify all agents of received request" trigger.


Ok, so it may not sound that clear, but hey, that's the beauty of it!


I'm excited about the possibilities that Zendesk withholds and I hope that the team adds some nice tweaks so that we can further improve the user experience and customization of our zendesks.

Hope we cover this on Zendesk's Barcelona Bootcamp! :)

March 14, 2012 05:58
User photo
Simon Topliss
agilitymultichannel

Is there a way to add a placeholder in the header text to include the organization name?

 

i.e. <Organization>: Ticket #672: Adding customer name to email

April 26, 2012 12:07
User photo
Arnaud de Theux
Zendesk

Hi Anton,

Apparently you changed the design of Zendesk Support email notifications?!

Is is possible to have the same on my own notifications? I like the icon of the users, new font etc, looks better :)

May 02, 2012 03:27
User photo
Anton de Young
Zendesk

Arnaud, 

Yes we're experimenting with a new design. It's not complete yet though and is not available at this time. Watch the What's new in Zendesk forum for a future announcement about this. 

May 03, 2012 10:56
User photo
Shawn Wallace

Question: in your "Editing the text in the mail delimiter and supporting other languages" section, the "Ticket #53 Auto ISO problem" link text is blue. I'm getting this, too, on my tickets, but want to change it to white. I've also gotten tickets from other orgs using Zendesk that have this same blue link. It appears to be styled white but comes through blue in every browser I try. How can I fix this so it's properly styled white?

May 11, 2012 12:48
User photo
Anton de Young
Zendesk

Shawn,

As I noted in Editing the HTML template, you can't change the hyperlink color in the HTML template. The cause of this is something deep under the hood. However, I'll ask Engineering about it. 

May 11, 2012 14:07
User photo
Sébastien
sherpato

Why there is no translation with "Your request (xx) has been solved. To reopen this request, reply to this email or click the link below:" when I use automatic translation.

What's going to happen if I translate this in French and an english user use the helpdesk.

Thanks!

Harsan 

May 16, 2012 12:04
User photo
pablo tisker

Can I customize the font size on ticket fields, I could not find the answer to that, but it's provably me

Thank you

June 13, 2012 15:05
User photo
Lisa-Anne Chung
intuitappcentersupport

Hi Anton, 

Were you able to learn anything from Engineering about that?  I'm having the same difficulties with the links.

Thanks,

Lisa-Anne

June 14, 2012 22:18
User photo
Gary Sargent
expertinternetmarketing

As with Lisa-Anne... ditto for us.

June 28, 2012 06:50
User photo
S R

Hi, quick question- how do i remove agent name from an email that the requester receives? 

July 15, 2012 11:02
User photo
Anton de Young
Zendesk

Shawn, Lisa-Anne, Gary

RE the hyperlink color in the email template. You will eventually be able to apply more customization to your email templates via CSS and then you'll be able to set the hyperlink color. It's on our list of enhancements but this is not ready yet and I don't have a release date for you yet. For now, the links are blue I'm afraid. 

July 17, 2012 16:12
User photo
Anton de Young
Zendesk

Harsan, 

Sorry for the delayed response. That text is contained in the Notify requester of solved request trigger. If you use dynamic content, you can create email notification text in each language you support and it will automatically be added to email notifications based on the user's language. See Using dynamic content to provide multiple language support.

.

July 17, 2012 16:18
User photo
Andreas Urban

Hi Anton,

We are testing the new "modern email template" which is available now. We really do like the new template style!

Due to our coporate design guidelines we would need to change the font used in the {{content}} section. It seems like it doesn't change the whole content section. Text added via a trigger does change, the commet thread doesn't. 

Could you help us with this? Thanks,

Andreas

July 18, 2012 02:09
User photo
Joe Mizzi
schoolofrock

The color of the link back to the ticket in the {{header}} placeholder cannot be changed in gmail, because it strips out any CSS that is not inline. So doing <style>.zd_link { color: #ABC }</style>{{header}} still shows a blue link in gmail.

July 20, 2012 12:36
User photo
Marie-Josée Brault
herdwisdom

I have a question about modifying an email notification. Right now, when a ticket is created by an agent, the email acknowledgement that is sent is the same as if the requester had created the ticket. I would like to make a distinct email for the case where an agent enters a ticket for a requester, but I don't know how to differentiate the "ticket creator". Help!

September 25, 2012 07:16
User photo
Adam L.
Zendesk

Marie -

I believe this can be done by creating a trigger with the following conditions under 'meet all of the following':
'ticket is...'+'created'
'requester'+'is not'+'(current user)'
'ticket channel is...'+'web form'

Then, under perform these actions, you can set it to email the requester and put it whatever text you would like! Also, to avoid 2 notifications, if you'd like, you can even add a tag to this ticket (so you would put (for example) 'add tags'+'no_received' under perform these actions). Then, in your other received request trigger, you would add the condition (under 'meet all of the following') 'tags'+'contain none of the following'+'no_received'. This way only one or the other would fire.

This trigger, when set up, will send a notification anytime an agent enters a ticket on behalf of the customer via the web portal. You can change the conditions and actions as needed, of course, but this should accomplish the basic goal you laid out.

September 25, 2012 10:05
User photo
Mona Caro
shopzillaeu

Would it be possible to embed a hyperlink within the text in a macro?  It looks like it may be able within the Dynamic Content section creating a placeholder, however I'm not entirely sure.  I'm not a big fan of including long URLs to direct customers so this would be greatly appreciated.

October 02, 2012 04:06
User photo
Justin Seymour
Zendesk

Hey Mona: 

It's currently not possible to embed a hyperlink in a macro. All ticket comments are plain text. The link will render appropriately for your end-users when they receive the email notification, though it will be a full length, clickable target. We're working on rich text formatting for ticket comments. You can however embed and format hyper links in the actual HTML email template. 

October 02, 2012 07:40
User photo
Erin Frey

Hi, is it possible to edit this text?  I can't figure out how to do it:

##- Please type your reply above this line -##

Your request (#) has been updated. Reply to this email or click the link below:
[link to zendesk ticket]

October 10, 2012 15:41
User photo
Justin Seymour
Zendesk

Hey Erin: 

Head over to Settings > Channels > Email and look for the Mail Delimiter field. 

October 15, 2012 08:10
User photo
Annie

How can I delete the line that reads "This email is a service from Paint the Moon?" Thanks! 

November 08, 2012 13:56
User photo
Chip Roberson
brandle

The HTML I see in this help is different from the HTML I see in Channels > Email > HTML Template. For example, there are no table tags. Am I looking in the right place or has the email format changed?

November 17, 2012 16:17
User photo
Justin Seymour
Zendesk

Annie: Remove the {{footer}} placeholder. 

Chip: You might be looking at the new email template: https://support.zendesk.com/entries/21723211-introducing-an-all-new...

November 19, 2012 05:13
User photo
Ben Lucier
tucows

Hi folks,

I struggled getting our email templates right and I've finally ended up with something I'm happy with. I wrote about it on my blog, along with instructions on how to modify the template. Here's the link: http://benlucier.com/blog/a-better-email-template-for-zendesk/ (I hope it's helpful!).

December 30, 2012 15:42
User photo
Justin Seymour
Zendesk

Awesome post, Ben! Thanks for sharing! 

December 31, 2012 05:30
User photo
Jennifer Rowe
Zendesk

Ben, this is awesome! Thanks for posting. I would LOVE it if you would create a tip in our Community Tips forum with the info in your comment. That will make it easier for people to find. Also, I will add a link to your blog post in this article itself as a community tip. I love this--thanks!!

January 03, 2013 16:42
User photo
Ben Lucier
tucows

Hi Jennifer, I did a complete post for the convenience of your customers. Of course, I'd really appreciate any referrals to my blog. Here it is: https://support.zendesk.com/entries/22868368-a-better-email-templat...

January 04, 2013 05:37
User photo
Jennifer Rowe
Zendesk

That's perfect, thanks, Ben! Exactly what I wanted, but didn't want to ask you to do too much extra work! :) I did update the article above with a community tip. I'll update the link to the new ZD forums post. I will probably also put this on our Twitter and Facebook page one day next week. Thanks again!

January 04, 2013 09:50
User photo
John

In my dashboard > channels > emails > email templates it says "If you run an email-only help desk, remove the {{header}} placeholder" but there is no {{header}} in the template anywhere?
So the email sent include this " ... or click the link below: [link to desk and ticket] "

How do I get rid of that, I only want an email-only help desk ?

January 08, 2013 05:06
User photo
Justin Seymour
Zendesk

Hey John: 

You just need to remove those placeholders from the triggers. Take a look at any trigger with Notify requester in the title. You'll see a few placeholders like ticket.id and ticket.url that need to be removed.

https://support.zendesk.com/entries/20032793-setting-up-to-provide-...

January 08, 2013 05:23
User photo
John

I just found the answer to my post of 30 minutes ago,.
I need to change the "triggers".

Thanks for listening anyway :)

January 08, 2013 05:40
User photo
John

Thanks Justin, I should have refreshed the page before I replied to myself :)

January 08, 2013 05:40
User photo
Justin Seymour
Zendesk

Cheers! 

January 22, 2013 06:09
User photo
Régis Pennel
lexception

Hi there,

We are a young company (www.lexception.com), just starting to use Zendesk and I have to say I am completely thrilled by this experience. It is changing our whole organisation for customer service.

Anyway, I have tweaked a lot the HTML to suit our design, but I have one issue. If the customer answers to the email, it shows inside the answer the tags of the answer of Gmail such as:

 

ANSWER bla bla bla

________________________________ 
De : "Pennel Régis, Fondateur" <notifications-serviceclient@lexception.zendesk.com
À : Régis <pennelxxx@gmail.com>
Envoyé le : Samedi 2 février 2013 19h46 
Objet : [L'Exception] Objet : Au sujet d'un article 

Le Service Client de L'Exception

 

And they are quoted on and on on all the answers.

Is there anyway Zendesk can strip the previous message history ?

Régis

February 02, 2013 11:12
User photo
Justin Seymour
Zendesk

Hey Régis: 

It sounds like the end-user is including the original comments with their reply above the mail delimiter line, or they're breaking the line and replying, which would lead to that additional mess. Replies above that line should not include previous message history. Make sure they're placing their comments in the right section of the email! 

February 04, 2013 11:22
User photo
Régis Pennel
lexception

Sure, but I can't prevent the users to click on reply, keeping the previous content, right ?

So in 99% of the tests we are having right now, it is a bit messy due to the presence of the answer tag of the email. Most of the customers will just click on reply without caring about deleting previous history... I'm surprised no one had this issue before, or maybe something I still didn't understand. Is there a way to get a technical support by email ?

February 09, 2013 11:47
User photo
Justin Seymour
Zendesk

You bet! Send an email to support@zendesk.com 

They shouldn't need to delete any previous message history if they're replying above the mail delimiter line. If the line is broken when they reply, all of the previous correspondence will be included with their newest reply. 

February 10, 2013 06:02
User photo
Joseph Rossi
pearsonerpi

If you are interested in email template customization, I provided an example of what I did in this post: https://support.zendesk.com/entries/22868368-A-better-email-templat...

You can see how Markdown elements look like when displayed in different email clients.

April 02, 2013 08:49
User photo
James Palmer
omniis

Hi,

I notice that after changing the url of the heldpesk to support.companyname.com, its still showing int he email as companyname.zendesk.com, where can I change this please?

 

thanks

April 19, 2013 05:53
User photo
Brandon K.
Zendesk

Hello Jpalmer,

You can change the email address the your end users will see when you reply to their tickets by going to Channels > Email and editing the default reply address. Be sure to forward all emails from the address you change it to an internal .zendesk.com domain as our system needs to receive the email at this address to process your user's replies. You can learn more about this here: https://support.zendesk.com/entries/20518663-forwarding-email-from-...

April 22, 2013 12:36
User photo
sperez
mansfieldpowergas

When a customer replies to one of our tickets via email it'll always place a "null" at the bottom of their reply.  How do I change this?  The replies display as follows:

 

Hello,

Replying to your ticket

null

July 26, 2013 06:35
User photo
Arnaud de Theux
Zendesk

Hi sperez,

Can you give me a ticket number from your account as example, so I can see what caused the null to appear? Thanks.

July 26, 2013 06:56
User photo
sperez
mansfieldpowergas

From my account, its ticket #9.

July 26, 2013 07:02
User photo
Arnaud de Theux
Zendesk

Actually it seems the null is part of the comments on each of your test end-user replies. You are replying from your @gmx email address to the ticket, correct? Do you have any specific signature on the email address? I'm happy to dive into this one in details by opening a ticket for you, if you want.

July 26, 2013 07:42
User photo
sperez
mansfieldpowergas

Correct, I'm using a gmx account as a test account for customer replies.  I'd greatly appreciate if you would open a ticket for this.  Thanks!

July 26, 2013 08:02
User photo
Arnaud de Theux
Zendesk

Sure thing, we'll continue the investigation in a ticket. Expect an email from Zendesk Support very soon. Thanks.

July 26, 2013 08:07
User photo
Wayne Theisinger
mowdirect

Hi Guys,

We'd really like to use the profile pictures but your template doesn't appear to follow your own advise, you say that you should give pictures dimensions so that their alt tags don't overrun into other text when the pictures aren't displayed, but as you can see in the attached screen shot the unloaded profile photos look ugly. Can image dimensions be added to the code so that they are limited to their own size. Secondly if a grey background colour was added using css this would also aid the design before images were loaded.

Many thanks

Wayne Theisinger

August 05, 2013 09:19
User photo
Nico Colangiuli
Zendesk

Hello Wayne,
We have fixed this problem. We now limit the alt text to 10 characters only.

- Nico

October 02, 2013 02:20
User photo
Azfar Hashmi

 

 

Hi everyone,

I have switched from text email template to html (markdown) and now I have noticed that emails are not showing  ticket header (which appear in colored bar as displayed in attached file). How can I put this in html tempelate? I have checked that both text and html templates only using two place holders i-e{{content}} and{{footer}} so I am not sure from where it is coming in text template. Any ideas.Azfar

November 05, 2013 10:14
User photo
Azfar Hashmi

Found it. I put following code below the {{delimiter}}

##############################

<div style="margin:0px auto;text-align:center;font-size:12px;color:#A2A2A2;padding-bottom:6px">
 
</div>
<table cellspacing="0" cellpadding="0" width="100%">
<tr>
  <td>
    <table width="100%">
      <tr>
        <td style="font-size: 12px; font-weight: bold; color: #fff; line-height: 1.5em;font-family: Helvetica, Arial, sans-serif; width: 100%;text-align: center;background: #98c332; padding:8px; margin:4px">
          <style>.zd_link {color:#FFF;}</style>{{header}}
        </td>
      </tr>
    </table>
  </td>
</tr>

################################

 

But the new issue is that this header is appearing below lines.

 

#####################

# Please type your reply above this line #

Your request (#12345) has been updated. Reply to this email or follow the link below:
http://support.abc.com/requests/12345

#######################

 

And I want this header to appear on top of it.

November 05, 2013 10:49
User photo
Laura D.
Zendesk

Hi Azfar, 

I'm a bit confused about what you're trying to do and I'm unable to locate your account based on the email address you're using so I can't look directly at your setup. If you can post another screenshot of what you're seeing or let me know what your subdomain is, I'll look again. One thing, I think once you've enabled the modern email template to support Markdown formatting, the colored bars go away as they were part of the older template. 

November 05, 2013 11:37
User photo
Azfar Hashmi

Hi Laura,

I was posting from my personal address and our subdomain is cloudwayssupport. Anyway atm I have fixed the primary issue and I will let you know if require further assistance.

Azfar

 

November 05, 2013 15:45
User photo
Laura D.
Zendesk

Sounds good Azfar, glad you were able to work it out!

November 05, 2013 16:41
User photo
Kristofer Åberg

Hi!

I wonder how to style the output of what the system placeholder {{content}} shows.

In my template, I for instance use the fonts "Arial, sans-serif" – but the output for the {{content}} is: "'Lucida Sans Unicode','Lucida Grande','Tahoma',Verdana,sans-serif".

Also, I wonder if it's possible to change the way the date is shown. Now it says for instance "nov-15 16:37 (CET)", and this is not the appropriate way to display dates in all countries. It would be great if you could choose from all the possibilites that are in PHP Date (this is the way you do it in CMS's like Drupal for instance): http://php.net/manual/en/function.date.php

Best wishes,
Kristofer

November 15, 2013 08:49
User photo
Maurizio Busatti

We too are trying to style the content of the {{content}} placeholder.

too rigid.

M.

November 15, 2013 17:44
User photo
Bob Novak
Zendesk

@Kristofer and @Maurizio, you can modify the font in {content} with code similar to the following (you will want to replace the font-stack in this example with your own):

{% if content contains "font-family: 'Lucida Sans Unicode', 'Lucida Grande', 'Tahoma', Verdana, sans-serif;" %}
  {{content | replace: "font-family: 'Lucida Sans Unicode', 'Lucida Grande', 'Tahoma', Verdana, sans-serif;", "font-family: Georgia, Times, 'Times New Roman', serif;"}}
{% else %}
  {{content}}
{% endif %}

 

It is more difficult to modify the format of a date in your email. One thing you can do is use Liquid Markup to modify the placeholders in specific notification triggers - however Liquid Markup does not work in your email template. More information about this option is available here: https://support.zendesk.com/entries/25111471

I agree that this would be a useful feature to be able to control the date format in your email notifications. We do have an existing feedback post about this, and I have added my support by clicking "Me too!": https://support.zendesk.com/entries/8573-ISO-or-configurable-date-f...

I encourage you to support this for future development by adding your support and adding a comment with your specific use-case and any additional information you think will be helpful. Our developers use these posts to prioritize our projects, so the more support this request gets the sooner it will be addressed.

December 03, 2013 07:45
User photo
Jonathan SAYEB
fakaravapearl

Hello Bob,

I'm new to all the coding stuffs and i would like to know where to past the code in your last post. Is it in my HTML template or in the the Triggers?

 

Thank you.

January 24, 2014 22:44
User photo
Bob Novak
Zendesk

Hi Jonathan - that code is for the HTML template for email notifications.

January 27, 2014 06:29
User photo
Jonathan SAYEB
fakaravapearl

Sorry Bob but it doesn't seem to work. just to give you an idea here is the part of the code that was suppose to fix the font issue:

</table>

<table width="600" border="0" cellpadding="5" cellspacing="0" style="margin: auto;">
<tr>
<td style="padding-bottom: 15px; font-size: 12px; color: #777; font-family: Raleway, 'Helvetica Neue', Helvetica, Arial;">
{% if content contains "font-family: 'Lucida Sans Unicode', 'Lucida Grande', 'Tahoma', Verdana, sans-serif;" %}
{{content | replace: "font-family: 'Lucida Sans Unicode', 'Lucida Grande', 'Tahoma', Verdana, sans-serif;", "font-family: Raleway, 'Helvetica Neue', Helvetica, Arial;"}}
{% else %}
{{content}}
{% endif %}
</td>
</tr>
</table>

January 27, 2014 08:52
User photo
Bob Novak
Zendesk

Hi Jonathan - I'd like to gather some more information about what you are trying to do for this, so I've created a ticket. If others have specific questions like this please send an email to support@zendesk.com. We can help determine the issue and update our notes in this document if necessary. Thanks!

January 28, 2014 11:21
User photo
Support

Thanks Pedro, your tip in 2012 with the steps to customize content by going to "manage trigger and email notifications" was exactly what I was looking for.

March 05, 2014 12:32