I asked Support and they have informed me that the platform does not support what we would like to do so, I thought that I would reach to the Community to see if anyone has faced a similar issue and if they found a solution.
The background is that we have a survey that goes out in 30 languages. In the Graphics Library we have 5 images that we use as banners for the invitation and reminder e-mails. At the moment these are pictures only and without text. We would like to for example overlay the words "Customer Survey" on the banner in the Invitation Email and "Gentle Reminder" on the banner in the Reminder Email in each of the 30 languages. Has anyone successfully applied text on top of images/graphics inside Qualtrics Email Messages using HTML (or other programming language)? It would save us having to upload 5 x 30 banners (for each of 30 languages and each of 5 banners) into the File Library. We would simply have to customise each email message for each language with the appropriate words in that language for use on top of the banner. Thanks in advance.
Page 1 / 1
Text over an image is perfectly fine and recommended on the web. Email, however, has its own set of rules.
Each email provider interprets HTML _very_ differently. Also, a lot of email providers still ask users to download images instead of doing it automatically. This is partially because images are the way that open tracking works in email, and partially for ancient security reasons.
So, the plus side of doing text over a graphic in an email is that it will remain accessible even if images aren't downloaded. The downside is that CSS/overlaying in an email is very tricky.
If this question was asking about a background image that was beneath most of the email, I would say go for it. Given that you are trying to create a header and the placement of the text within the background matters, I think you might be better off uploading 150 images and referencing them by ID for each language.
Here are some resources on overlaying text on an image:
* https://litmus.com/blog/the-ultimate-guide-to-background-images-in-email
* https://backgrounds.cm/
Each email provider interprets HTML _very_ differently. Also, a lot of email providers still ask users to download images instead of doing it automatically. This is partially because images are the way that open tracking works in email, and partially for ancient security reasons.
So, the plus side of doing text over a graphic in an email is that it will remain accessible even if images aren't downloaded. The downside is that CSS/overlaying in an email is very tricky.
If this question was asking about a background image that was beneath most of the email, I would say go for it. Given that you are trying to create a header and the placement of the text within the background matters, I think you might be better off uploading 150 images and referencing them by ID for each language.
Here are some resources on overlaying text on an image:
* https://litmus.com/blog/the-ultimate-guide-to-background-images-in-email
* https://backgrounds.cm/
@mattyb513 - Thank you for the response and the links above. As a result of your recommendation we are now considering implementing a background image that would sit underneath most of the e-mail instead of the banner idea. However, is it possible to implement an animated background for survey invitations and reminders on the Qualtrics platform? Or, would this be prone to whether our contacts' email providers allows their users to download the animation? Would implementing a static image be better? Thanks in advance.
@mattyb513 - Thank you for the advice a few months back. We attempted to implement a (non-animated) background image that sits underneath most of the e-mail as you described above.
However, we kept having issues with the way that the e-mails were rendering and received the following response from Qualtrics Support: "Qualtrics does not support the addition of scripting within the email message editor. This capability is reserved for within survey questions themselves. Therefore, we would advise removing the !DOCTYPE, and any other scripting from your message code. Instead, you will need to use HTML code with styling elements only. This "static" code, as opposed to one that gets a specific element dynamically, will be sufficient to pass validation. "
Two questions I have are:
1. How have you previously been able to overcome this shortcoming of the Qualtrics platform?
2. What types of HTML codes have you used to produce your survey invitations and reminders?
Many thanks in advance.
However, we kept having issues with the way that the e-mails were rendering and received the following response from Qualtrics Support: "Qualtrics does not support the addition of scripting within the email message editor. This capability is reserved for within survey questions themselves. Therefore, we would advise removing the !DOCTYPE, and any other scripting from your message code. Instead, you will need to use HTML code with styling elements only. This "static" code, as opposed to one that gets a specific element dynamically, will be sufficient to pass validation. "
Two questions I have are:
1. How have you previously been able to overcome this shortcoming of the Qualtrics platform?
2. What types of HTML codes have you used to produce your survey invitations and reminders?
Many thanks in advance.
@RachelW I'm not sure what you mean by scripting.
No emailer would support using JavaScript.
If you are just using embedded data, Qualtrics definitely supports that.
If I were trying to change the image dynamically based off who it's being sent to, I would put the reference to the image file (the URL) in the person's metadata in Contacts. Then, in the email, I would reference that field within the `src` of the image, like so:
```html
<img src="${e://Field/imageUrl}">
```
No emailer would support using JavaScript.
If you are just using embedded data, Qualtrics definitely supports that.
If I were trying to change the image dynamically based off who it's being sent to, I would put the reference to the image file (the URL) in the person's metadata in Contacts. Then, in the email, I would reference that field within the `src` of the image, like so:
```html
<img src="${e://Field/imageUrl}">
```
@mattyb513 Thank you for the reply.
We did not realise that the e-mailer functionality on the platform was so basic.We wanted to make the e-mails dynamic so that the image sizes would adapt according to the e-mail client and the size of screen on which e-mail was being viewed, hence the agency using !DOCTYPE scripting.
Qualtrics Support has advised us that everything in the design has to be static instead: "The agency will likely [need to make] a table with 1 column and 4 rows, and drop each element into their spots." After discussing with the agency, this is now our workaround plan to avoid reverting to text-laden e-mails. Thanks again.
We did not realise that the e-mailer functionality on the platform was so basic.We wanted to make the e-mails dynamic so that the image sizes would adapt according to the e-mail client and the size of screen on which e-mail was being viewed, hence the agency using !DOCTYPE scripting.
Qualtrics Support has advised us that everything in the design has to be static instead: "The agency will likely [need to make] a table with 1 column and 4 rows, and drop each element into their spots." After discussing with the agency, this is now our workaround plan to avoid reverting to text-laden e-mails. Thanks again.
Leave a Reply
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.