What can I do to prevent iPhone 4 from cutting off my title when adding to home screen?

Question

I have long web page title and when adding to home screen in iPhone older versions the whole title is visible in the confirmation dialog. When I add to home screen in iPhone 4 t

Answer 1

Use a short Page Title with this code:

<script type="text/javascript">
  if( navigator.userAgent.match(/iPhone/i) || 
      navigator.userAgent.match(/iPod/i) || 
      navigator.userAgent.match(/iPad/i)
    ) {
         document.title = "Short title";
      }
</script>

But you cannot use the full title.

Answer 2

You can change the title for iOS devices as woodleader has answered but this will change it in normal mobile safari. Only the user can change the title of the webapp. It's not possible to do it with meta tags or programmatically. So you just need to choose a shorter title or leave it up to the user, who will likely change it, if it is too long.

Answer 3

Apparently there will be a undocumented meta tag

<meta name="apple-mobile-web-app-title" content="Title">

in iOS 6 to solve that issue.

Answer 4

No, there is no way to prevent that. Application names on the home screen are limited to a maximum of 12 characters. Anything beyond that will be truncated by placing an ellipsis in the middle of the name.

You will need to keep the title of your website under 13 characters on the iPhone if you want to prevent it from being cut off. See the other answers for possible ways of doing that.

Update: As of iOS 6, you can use a meta tag to set the name of your application as displayed on the home screen. Full details and instructions are available here.