For times when MMS is too expensive, you can have live links in SMS to images that can be viewed on the mobile web. With this simple tutorial we will show you how to setup and optimise a full screen image. This gives the same full screen experience as MMS, but with only the cost of an SMS. Web images are a visually impactful way to deliver coupons as well, either by showing them at point of purchase or you can tap them to generate an email or SMS with a code that can be used to trigger a redemption process.
The challenge is that different phones and operating systems handle images a bit differently.
What we really want is a link to a nice full screen image like the image at the top.
What we need to do is create a web page to host your image, re-size it, hide the location bar and then link to it.
You will need to be able to host this small HTML file and your image on a web server somewhere.
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Burst SMS Coupon</title>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<style>
html,body {margin: 0 auto; padding: 0; text-align:center;}
#container{
width: 100%;
margin: 0 auto;
}
img {
width:100%;
height: auto;
max-width: 100%;
}
/* iphone */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
img { max-width: 100%; }
}
/* ipad */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
img { max-width: 100%; }
}
</style>
</head>
<body>
<div id="container">
<a href="mailto:coupon@burstsms.com?subject=Coupon AU $30"><img src="burst30coupon.jpg"></a>
</div> <!-- end of container div -->
</body>
</html>
You just need to change the code where indicated. You will notice we have included a basic tap to email redemption process here. It is optional.
Once you have your file and the associated URL, shorten it via the track link feature in our service.
For best results we use an image of 320 pixels in width.
If you have any comments, or if this doesn't work as expected, let us know and we will be happy to help.