HTML e-mail templates can contain photos. This article explains how you can add an attachments and photos in an e-mail template. Every e-mail based on this template contains the photo(s) and attachment(s).
Add attachment to an e-mail
To automatically add attachments with an e-mail template, there are two possibilies;
- Use an attachment from a file. Add an copy of that attachment to the e-mail. Par example for a brochure. So that you with every introduction e-mail automatically an brochure is send with the e-mail.
- Use a file template. The attachment will be created - on basis of a file template - exactely on the moment the e-mail is created. Par exmple for an CVV; such that with every e-mail a 'fresh' CV will be send along.
Attachment based upon an existing attachment
Let us say that you send regularly introduction e-mails to - potential - new relations. Besides an text you want that the e-mail contains also an attachment with a standard brochure of your company. For such an introduction e-mail, you make use of e-mail templates. You will take care that this e-mail template contains both CxScript instructions to automatically add the brochure as attachment of the e-mail.
In order to automatically add a brochure as an attachment to the e-mail:
- Add the brochure file as an attachment as an office file in your Carerix system. Do you have multiple offices? Then add the attachment to every office.
- Give the attachment an description. Use hereby only letters and numbers. No spaces or other signs. In our example we could name the brochure Brochure.
- Create an e-mail template and call this Introduction.
- Insert the next piece of CxScript in the e-mail template 'Introduction':
Replace the previous instruction Brochure by a description that you gave to your attachment.
With the previous CxScript instructions in the e-mail template the attachment will automatically be a part of every Introduction e-mail which you will send.
- Do you not want to send the attachment in some cases? That is also possible. When the e-mail is created, the e-mail screen appears (as usual). Click in this e-mail screen on the tab Attachment' and erase the checkbox with the concerning attachment.
- Automatically add multiple attachments? No problem, Copy and paste the previous CxScript instructions as many times as you like.
- If the system cannot find the attachment (par exmple, if the description is different than the name which uses the CxScript instruction). Then no error appears when you are creating the e-mail. The e-mail will be sent without attachment. So you have to properly test if the attachment is send along the e-mail and you have to make sure that the attachment in the file will not be deleted or description of the file changes.
Attachment on basis of a document template
Adding an attachment to an e-mail based upon another (document) template goes as follows:
<cx:fetch entity="CRTemplateReference" limit="1" qualifier="targetEntityName = 'CRInvoice' and isDefault = 1" >
<cx:attachment name="factuur.html"><cx:include template="$item.url.urlContents" /></cx:attachment>
In the foregoing example an invoice is created (based upon a file template) which will be the attachment of the e-mail.
- The cx:fetch only collects ( limit=1 ) file-template ( entiteit CRTemplateReference ) that fulfill the next requirements :
targetEntityName = 'CRInvoice' : The template is (in this case) available for invoices
isDefault = 1 : The template is the standard template. When the user clicks on the button Print, this is standard applied.
- The cx:attachment element creates the contact of the attachment for the e-mail.
Name is the filename of the attachment.
- The cx:include element produces the content of the attachment as follows:
$item contains the template;
$item will be filled by the cx:fetch instruction
$item.url is the URL of the template; every template is namely online available and can be collected via an HTTP request.
$item.url.urlContents collects the content of the templates; this content is thus (CxScript) the text of the template;
The cx:include instruction will via the template perform the received CxScript and insert the result in the current template.
- Avoid using whitespaces between the cx:attachment and cx:include tags. These will be visible in the attachment. This is the reason why the cx:attachmentand cx:include are located on 1 line. A Rulefuss will also be visible in the attachment.
Do you already know the online location of the file template? Then you can add the attachment as follows:
<cx:let name="url" value="http://templates.carerix.com/cx/example.html">
<cx:attachment name="factuur.html"><cx:include template="$url.urlContents"/></cx:attachment>
Photo in e-mail
There are two ways to add photos to an e-mail :
- Online: The photo is located on a server, and in the e-mail a link is inserted
+ Easy to realize
+ E-mail messages will stay small because the photo is not part of the e-mail self.
- Some e-mail programs don't show the photo correctely. The receiver must choose to "Show pictures in this message".(par example in MS-Outlook).
- Inline: The photo is an attachment of the e-mail
+ The photo will always be shown, the receiver do not have to click on something
- This is a little bit harder to create
- Message is larger because the picture (as attachment) is part of the message.
Watch for the filetype of the file. The most used filtypes are:
Image.bmp - Windows bitmap. Avoid the use of BMP files! These are not readable on not Windows systems.But more important, a BMP file is very large and therefore less usefull.
Image.gif - GIF files are at least twice as small as BMP files, and there is no quality loss, but there is a con; GIF files have a maximum of 256 colors.
Image.png - PNG is smaller than a GIF file, there is no quality loss and there is no maximum amount of colors that can be used.
Image.jpg - JPG are the smallest files, but there is a small quality loss: The larger the loss is acceptable, the smaller the filesize.
Files can easily be converted into other types with a program such as "Irfanview" (http://irfanview.com).
Online photo in e-mail
In order to insert an online available photo in an e-mail, you have to do the following:
- Upload the photo to an web-server, so that it is online available. The address of such an picture could look like this:http://yourname.carerix.com/images/companylogo.gif
- Insert in your e-mail template the next CxScript instructions :
<img alt="logo" src="http://yourname.carerix.com/images/companylogo.gif">
- Do you work with a standard style with a logo? Insert to following CxScript instructions on your header or footer for e-mails (see Maintenance| Settings | Template parts). Then you know for sure that the logo appears in every e-mail.
Add an online photo
To make an online photo online available on
- Use an FTP client, par example FileZilla (free download via: http://filezilla-project.org/)
- Create a connection with ftp://uwnaam.carerix.com
The username and password are received when Carerix is delivered to the contact. If this information is lost, the contact can request this information back to firstname.lastname@example.org
- Open the folder httpdocs/images/
Remark that with a connection via FTP explicitily the httpdocs must be mentioned. The template works via HTTP, whereby this is implicit.
- Put your photo companylogo.gif in the folder httpdocs/images/ by uploading your logo.
- Check if the photo is visible by filling in this address in the addressbar of your browser:http://uwnaam.carerix.com/images/companylogo.gif
Standard inline photo in e-mail
The photo's can be added inline. The photo will be send as an attachment. Inline photo's will be included with the following CxScript code
Insert an inline logo in e-mails :
- Make sure that the photos are available as attachment in all office files. Give the attachment an description (only letters, no spaces or other symbols). Let us say we give the logo the following description: companylogo.
- Take the next piece of CxScript and add this in de e-mailFooter or in the e-mail template itself:<cx:attachment content="$activity.owner.agency.attachmentsByLabel.[omschrijving].content" cid="[omschrijving]"/><img src="cid:[omschrijving]">With companylogo if [description] this will be:<cx:attachment content="$activity.owner.agency.attachmentsByLabel.companylogo.content" cid="companylogo"/><img src="cid:companylogo">
On the place of
<img> now there will be the photo.
- For other photo's you can do the same Make sure that the descriptions for these different logo's are unique.
- Insert the CxScript instruction in the e-mailfooter. Than are can be certain that this will be inserted in every e-mail.
Per user a different inline photo
It is possible to use for every user a different signature picture (e.g. with logo and contactdetails). In practice this means that, depend on the person who is log on, the picture of that person appears in outgoing e-mails. With use of Cx codes in the e-mailfooter this can be realised.
Below an example whereby different users have a different picture. The userID's are automatically created by Carerix.
In this example there are 3 users with each a different pictures which are uploaded on forehand in Offices, with the next descriptions:
- Picture 1 intended for userID1 with the description User1EmailLogo
- Picture 2 intended for useriD2 with the description User2EmailLogo
- Picture 3 intended for userID3 with the description User3EmailLogo
The code below can be used for 3 different users.
With kind regards,<br>
<img src="cid:User1EmailLogo" alt="footer"/>
<cx:attachment content="$activity.owner.agency.attachmentsByLabel.User2emailLogo.content" cid="User2EmailLogo"/>
<img src="cid:User2EmailLogo" alt="footer"/>
<cx:attachment content="$activity.owner.agency.attachmentsByLabel.User3EmailLogo.content" cid="User3EmailLogo"/>
<img src="cid:User3EmailLogo" alt="footer"/>
- Choose Setting under the tab Maintenance
- Click on template parts
- Enlarge the "emailFooter" by clicking on the 'pencil'
- Type the wished CxScript code