my own icon on ipad - Support | Kriesi.at

Viewing 8 posts - 1 through 8 (of 8 total)

Author

Posts

November 24, 2016 at 11:00 am #716343

teotaban

Participant

Hi,
how can I have my own icon on ipad/smartphone browser favourites? Look at the picture I have attached
Thank you

November 25, 2016 at 12:02 pm #716776

Vinay

Inactive Moderator

Hey teotaban!

Please give these plugins a try
https://wordpress.org/plugins/very-simple-favicon-manager/screenshots/
or
https://wordpress.org/plugins/add-to-home-screen-wp/

If you like to do it manually add the below code to your functions.php
NOTE: Please update the icon path in the below code where it say’s href=”/path/to/my/icon/192X192.ico”

function blog_favicon() {
echo '<link rel=”shortcut icon” href=”/path/to/my/icon/192X192.ico”>
<link rel=”apple-touch-icon-precomposed” href=”/path/to/my/icon.png”>';
}
add_action('wp_head', 'blog_favicon');

Regards,
Vinay

November 25, 2016 at 2:33 pm #716852

teotaban

Participant

Thank you but I am not speaking about adding an icon on my iPad screen…I want to have my own icon on safari favourites… Those plugins are great but I want my icon on favourite. In this moment, if you add my webpage on favourite (on ipad or iphone) wil see an icon with C inside…can this changed with my own logo?
Thanks

November 26, 2016 at 12:22 pm #717198

teotaban

Participant

I just want to have the same like you. See the img. attached: first icon it´s yours Kriesi, the second in the right side is mine but it´s just the first capital letter C and I need to have there my logo. I am not talking about how to add icon on homepage…I am talking about how to add an website in favourites/ipad and to have my logo not the first letter C

Thank you

November 28, 2016 at 4:26 pm #717859

Andy

Inactive Moderator

Hi,

if you want your icon on favourites of your browser, you need to work with a “favicon”. So follow the instructions of Vinay.

Best regards,
Andy

November 28, 2016 at 4:41 pm #717873

Guenni007

Participant

well there is a unique site which can help the most of your desired things.
http://web-stuebchen.de/

you can upload there a square image best and correct only the 310x150png for Windows10.
after generating you can download one zip file with all you need.

i uploaded on my part allways to wp-content/uploads/icons

the path can be set in here on that dialog:

Preview

the insertion you can do via child-theme functions.php – the downloaded snippet.html contains the code you need:

add_action('wp_head', 'ava_add_customicons');
function ava_add_customicons() {
    ?>

<link rel="shortcut icon" type="image/x-icon" href="/wp-content/uploads/icons/favicon.ico">
<link rel="icon" type="image/x-icon" href="/wp-content/uploads/icons/favicon.ico">
<link rel="icon" type="image/gif" href="/wp-content/uploads/icons/favicon.gif">
<link rel="icon" type="image/png" href="/wp-content/uploads/icons/favicon.png">
<link rel="apple-touch-icon" href="/wp-content/uploads/icons/apple-touch-icon.png">
<link rel="apple-touch-icon" href="/wp-content/uploads/icons/apple-touch-icon-57x57.png" sizes="57x57">
<link rel="apple-touch-icon" href="/wp-content/uploads/icons/apple-touch-icon-60x60.png" sizes="60x60">
<link rel="apple-touch-icon" href="/wp-content/uploads/icons/apple-touch-icon-72x72.png" sizes="72x72">
<link rel="apple-touch-icon" href="/wp-content/uploads/icons/apple-touch-icon-76x76.png" sizes="76x76">
<link rel="apple-touch-icon" href="/wp-content/uploads/icons/apple-touch-icon-114x114.png" sizes="114x114">
<link rel="apple-touch-icon" href="/wp-content/uploads/icons/apple-touch-icon-120x120.png" sizes="120x120">
<link rel="apple-touch-icon" href="/wp-content/uploads/icons/apple-touch-icon-128x128.png" sizes="128x128">
<link rel="apple-touch-icon" href="/wp-content/uploads/icons/apple-touch-icon-144x144.png" sizes="144x144">
<link rel="apple-touch-icon" href="/wp-content/uploads/icons/apple-touch-icon-152x152.png" sizes="152x152">
<link rel="apple-touch-icon" href="/wp-content/uploads/icons/apple-touch-icon-180x180.png" sizes="180x180">
<link rel="apple-touch-icon" href="/wp-content/uploads/icons/apple-touch-icon-precomposed.png">
<link rel="icon" type="image/png" href="/wp-content/uploads/icons/favicon-16x16.png" sizes="16x16">
<link rel="icon" type="image/png" href="/wp-content/uploads/icons/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="/wp-content/uploads/icons/favicon-96x96.png" sizes="96x96">
<link rel="icon" type="image/png" href="/wp-content/uploads/icons/favicon-160x160.png" sizes="160x160">
<link rel="icon" type="image/png" href="/wp-content/uploads/icons/favicon-192x192.png" sizes="192x192">
<link rel="icon" type="image/png" href="/wp-content/uploads/icons/favicon-196x196.png" sizes="196x196">
<meta name="msapplication-TileImage" content="/wp-content/uploads/icons/win8-tile-144x144.png"> 
<meta name="msapplication-TileColor" content="#ffffff"> 
<meta name="msapplication-navbutton-color" content="#ffffff"> 
<meta name="application-name" content="bonnzeit.de"/> 
<meta name="msapplication-tooltip" content="bonnzeit.de"/> 
<meta name="apple-mobile-web-app-title" content="bonnzeit.de"/> 
<meta name="msapplication-square70x70logo" content="/wp-content/uploads/icons/win8-tile-70x70.png"> 
<meta name="msapplication-square144x144logo" content="/wp-content/uploads/icons/win8-tile-144x144.png"> 
<meta name="msapplication-square150x150logo" content="/wp-content/uploads/icons/win8-tile-150x150.png"> 
<meta name="msapplication-wide310x150logo" content="/wp-content/uploads/icons/win8-tile-310x150.png"> 
<meta name="msapplication-square310x310logo" content="/wp-content/uploads/icons/win8-tile-310x310.png"> 

    <?php
}