Choices

A peeve of mine is when browsing by mobile device, a website determines for you that you are only going to see their mobile site without any options.

If you visit this blog on a mobile device, you will see it as anyone from a desktop/laptop would see it unless you are on an iPhone/iPod Touch or certain BlackBerry smartphones. But, you have the option to view it normally with the flick of a switch (located at the bottom of the page). WordPress makes this very easy with a variety of plug ins.

Okay, now that I have that off my chest, I will explain an easy way to do something similar with your webpages even if you don’t have access to server side functions. If you visit our Service page with a desktop computer or laptop, you will see a normal site with a sprinkle of flash (more on that later). If you visit with a mobile device such as an iPhone/iPod Touch and some BlackBerry smartphones you will see a section at the very top of the page (you could put this just about anywhere you wanted) that tells you of the option to visit a mobile edition. This is done by using a little javascript and an empty div. You then call the javascript function on load so the user doesn’t need to click on anything. When the javascript function is called, it puts a link and message in the empty div. You could obviously use this script to open or close a div with a special message or link for other reasons too.

Below is the code and description on were to put it.

Put this in the opening body tag:

<body id="page1" onLoad="init()">
 </div>
Now put the following script inside the body somewhere
<script type="application/x-javascript">
// I use userAgent instead of platform on the Apple device so I don't have to put in two different statements (navigator.platform.match(/iPod/i)) ||
 
function init() {
	if (((navigator.userAgent.match(/iPhone/i)) ||  (navigator.platform.match(/BlackBerry/i))) ) {
		var o = document.getElementById( 'iphone-ipod-notify' );
		o.innerHTML = "<h1 style='text-align:center;border: 2px solid #a23e14; -webkit-border-radius: 10px;'><a href='http://www.bickford.net/m'>Tap here if you would like to visit our mobile portal!</a><br /><br />Otherwise, enjoy your visit. Clicking on the following perfomance image will toggle the flash container.</h1>";
		}
	}
 
</script>
Now, put the empty div where you want it (usually at the top)

<div id="iphone-ipod-notify"> </div>

Now the user has a choice!

I have an App for that


Revision 12/24

It’s live! I submitted on Saturday and it was under review by Monday morning, I got the e-mail yesterday saying it was approved and this morning it was live on iTunes! Check it out! Here is the link on iTunes.

Wow, that was fun. I got an e-mail from Apple today saying my app had been approved. Just waiting on it to go live in the store (iTunes). You can see some screen shots at www.bickford.net/service/iphone.html.

I am told that it should go live within 24hrs (keeping my fingers crossed). Here is the link in the iTunes store

I built the app to make it convenient to view our inventory on display(via: webcam), send an e-mail, make an appointment, see our latest SVT projects etc. Please try it and let me know what you think.

bms

Return top