Removing top URL bar and bottom bar

Discussion in 'Mobile Web Development' started by Brute, Jan 1, 2010.

  1. Brute

    Brute New Member

    Joined:
    Jan 1, 2010
    Messages:
    2
    Likes Received:
    0
    Device:
    3G iPod touch
    Hello everyone! I'm a PHP/MySQL deveolper, and I just recently started developing an iTouch/iPhone compatible web-based RPG. My question is: is there a way to remove the top and bottom bar on the browser to give my web based game a more "application" feel, so the user feels as though they are using an application, instead of browsing a website. Since I don't have a Mac computer, I can't make it into an actual "application", so is there any other way?

    Thanks!
  2. Shawa

    Shawa Super Moderator

    Joined:
    Jan 31, 2009
    Messages:
    3,188
    Likes Received:
    22
    Device:
    Nexus 4
    Add this to the header:

    Code:
    <meta name="apple-mobile-web-app-capable" content="yes" />
  3. Brute

    Brute New Member

    Joined:
    Jan 1, 2010
    Messages:
    2
    Likes Received:
    0
    Device:
    3G iPod touch
    Hey thanks, that works great. Just a note for people who use this: it only works if the web-page is saved to you homescreen.


    Edit: as soon as you click a link it opens up the browser, defeating the purpose.
  4. deeboy55

    deeboy55 New Member

    Joined:
    Feb 2, 2009
    Messages:
    297
    Likes Received:
    0
    Device:
    iPad
    Be sure to add:
    to EVERY page you link too

    Please Register or Log in to view images

  5. Shawa

    Shawa Super Moderator

    Joined:
    Jan 31, 2009
    Messages:
    3,188
    Likes Received:
    22
    Device:
    Nexus 4
    Yes, ideally you'd have the header as a PHP include file, so you change 1 file, and the header in every page gets modified.

    PHP:
    <?php include 'header.php'>
    Put your header in a file called header.php (or whatever you want to call it), then in the case of each webpage, replace your header with the above PHP snippet.

Share This Page