Setting iOS home screen icon for Onswipe with wordpress.org installation

  • geekboy_x

    (@geekboy_x)


    15 years, 2 months ago

    If you are using the very cool new Onswipe plug-in you may be stressed about setting up your iOS home screen icon. This is because Onswipe uses your “blavitar” as the home screen icon and there is no place in your wordpress.org to SET a blavitar. What to do?

    Solution A:
    Use your Onswipe “custom logo” as your iOS home screen icon. After you set up Onswipe with a custom logo (even if you are not using the “cover display” option) the logo will EVENTUALLY populate to the home screen of any iPad that has your site saved to the home screen.

    NOTE: This doesn’t happen right away. When the iPad user first saves your site to their home screen, it will show an image pulled from the most recent display of your site. DON’T PANIC. After a couple of page swipes the icon will update to show your custom logo as set in Onswipe.

    The disadvantage of Solution A is that you have to use the same icon for your custom logo and your iOS icon. If you need something different (and you probably should, since the logo and icon have two very different functions) use:

    Solution B:
    Make your own iOS icon and give Onswipe the code it needs to tell iOS that the icon is there. Make an appropriate 128×128 pixel icon (.jpg or .png). Upload it to the /wp-content/uploads/ directory on your server. Then open this file in your wordpress install:

    /wp-content/plugins/onswipe/themes/warp/views/layouts/default.php

    Add this line (edited to reflect the name of YOUR icon file):

    <link rel=”apple-touch-icon” href=”wp-content/uploads/YOURICON.png” />

    to the <head> section. REMEMBER TO REPLCE “YOURICON” WITH THE NAME OF THE FILE YOU ARE USING. Add it right after the line that contains the “<meta charset=”UTF-8″>” entry. The first few lines of your file should now look like this:

    <head>
    <title><?php bloginfo(‘name’) ?></title>
    <meta charset=”UTF-8″>
    <link rel=”apple-touch-icon” href=”wp-content/uploads/YOURICON.png” />
    <link rel=”stylesheet” href=”<?php bloginfo(‘stylesheet_url’) ?>” type=”text/css” media=”screen” title=”no title” charset=”utf-8″>
    <?php include(PADPRESS_THEME_DIR.”/views/_fontstyles.php”);?>

    And guess what? You are done! Now when someone adds your page to their screen when you are running Onswipe they get the logo you want.

    Have fun!

The topic ‘Setting iOS home screen icon for Onswipe with wordpress.org installation’ is closed to new replies.