1

I'm trying to show email content based on the user-agent/screen size, so that i can show an image on mobile phones i.e. if this email is opened on a desktop - don't show this content, if the same email is opened on a mobile phone - show this content.

does anyone know if this is possible with exact target ampscript?

3 Answers 3

2

Short answer is no.

AMP script is read right before the email is sent. As this is well before the email arrives at the email client, it is impossible to include any differentiation of display based off client/screen variables. "The ExactTarget application handles all AMPscript calls at the end of the email send" (AMP Script Process)

My recommendation is to look into media queries for responsive emails (more complex and has many eccentricities due to email clients render and read differently) as well as scalable email design (recommended for those with beginner to moderate level html/css abilities) for mobile. (Litmus - Difference between Responsive and Scalable)

1

It is certainly possible to hide or show content in an email using simple media queries. No AMPScript is required. It's not supported in all of the email platforms.

Here are some really good responsive email templates developed by Brian Graves from DEG. I've implemented variations of several of these templates in ExactTarget.

EDIT: Here's a sample the drops off Nav elements based on the browser width. It's adapted from the first template on the GitHub page I mentioned above:

<style type="text/css" media="screen">
@media only screen and (max-width: 400px) {
    td[class="nav3"] { display: none; }
    td[class="nav4"] { display: none; }
    td[class="nav5"] { display: none; }
    td[class="nav6"] { display: none; }
}
</style>
...
<body style="background: #fff;font-family:Arial, Helvetica, sans-serif; font-size:12px;">
  <table cellpadding="0" cellspacing="0" width="100%">
      <tr>
          <td align="center" style="padding: 15px 10px; font-size: 12px;">
              <a href="#" style="text-decoration: none;">Navigation 1</a>
          </td>
          <td align="center" style="padding: 15px 10px; font-size: 12px;">
            <a href="#" style="text-decoration: none;">Navigation 2</a>
          </td>
          <td class="nav3" align="center" style="padding: 15px 10px; font-size: 12px;">
            <a href="#" style="text-decoration: none;">Navigation 3</a>
          </td>
          <td class="nav4" align="center" style="padding: 15px 10px; font-size: 12px;">
            <a href="#" style="text-decoration: none;">Navigation 4</a>
          </td>
          <td class="nav5" align="center" style="padding: 15px 10px; font-size: 12px;">
            <a href="#" style="text-decoration: none;">Navigation 5</a>
          </td>
          <td class="nav6" align="center" style="padding: 15px 10px; font-size: 12px;">
            <a href="#" style="text-decoration: none;">Navigation 6</a>
          </td>
      </tr>
  </table>
</body>
1
  • Please post an example as part of your answer.
    – Jay Walker
    Mar 8, 2013 at 15:51
0

There is no way to detect using ampscript. The closest thing you will get to this is using responsive email design techniques. Check out this link:

http://coding.smashingmagazine.com/2011/08/10/techniques-for-gracefully-degrading-media-queries/

1
  • Email markup, in general, doesn't always support anything beyond CSS 1.0. In fact ExactTarget's own documents says to not use anything beyond CSS 1.0, therefore media queries aren't going to work where you need them most of all, like in Outlook.
    – TravisO
    Sep 19, 2013 at 13:58

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.