# Change Default apple-touch-icon

**URL:** https://forums.knack.com/t/change-default-apple-touch-icon/10229
**Category:** API & Custom Code
**Created:** [October 9, 2015, 8:07pm UTC](https://forums.knack.com/t/change-default-apple-touch-icon/10229 "2015-10-09T20:07:38Z")
**Posts on this page:** 5
**Page:** 1

<div class="post-metadata">

### Author: ![jason](https://avatars.discourse-cdn.com/v4/letter/j/dc4da7/32.png) [@jason](https://forums.knack.com/u/jason)
#### Post date: [October 9, 2015, 8:07pm UTC](https://forums.knack.com/t/change-default-apple-touch-icon/10229/1 "2015-10-09T20:07:38Z")

</div>

Is there a way to change my app's "apple-touch-icon"?

I have used to have the following javascript code in my app:

(function changeMobileIcon() {

&nbsp; var y = document.createElement('link');

&nbsp; y.type = 'image/x-icon';

&nbsp; y.rel = 'apple-touch-icon';

&nbsp; y.href = '[http://xxxxxxxxxx.com/apple-touch-icon.png](http://xxxxxxxxxx.com/apple-touch-icon.png)';

&nbsp; document.getElementsByTagName('head')[0].appendChild(y);

}());

But it no longer works. &nbsp;Anytime the app is added as a home screen bookmark to an Android or iOS device, the icon is now replaced by the default Knack icon. &nbsp;Any suggestions?

---

<div class="post-metadata">

### Author: ![DeanBozzan62116](https://avatars.discourse-cdn.com/v4/letter/d/ad7895/32.png) [@DeanBozzan62116](https://forums.knack.com/u/DeanBozzan62116)
#### Post date: [April 21, 2020, 5:48am UTC](https://forums.knack.com/t/change-default-apple-touch-icon/10229/2 "2020-04-21T05:48:32Z")

</div>

/\* Change Icon \*/  
ChangeFavicon();

function ChangeFavicon() {  
var link = document.querySelector("link[rel\*='icon']") || document.createElement('link');  
link.type = 'image/x-icon';  
link.rel = 'shortcut icon';  
link.href = 'https://YOURURL/favicon.ico'; //path to your icon  
document.getElementsByTagName('head')[0].appendChild(link);  
}  
  
  
/\* Add to Home Screen icons. \*/  
$("head").append("\<link rel='apple-touch-icon-precomposed' sizes='57x57' href='https://YourURL/apple-touch-icon-57x57.png' /\>");  
$("head").append("\<link rel='apple-touch-icon-precomposed' sizes='72x72' href='[https://Y](https://YourURL)ourURL/apple-touch-icon-72x72.png' /\>");  
$("head").append("\<link rel='apple-touch-icon-precomposed' sizes='114x114' href='https://YourURL/apple-touch-icon-114x114.png' /\>");  
$("head").append("\<link rel='apple-touch-icon-precomposed' sizes='144x144' href='https://YourURL/apple-touch-icon-144x144.png' /\>");

&nbsp;

---

<div class="post-metadata">

### Author: ![RyanCarter86691](https://sea2.discourse-cdn.com/flex020/user_avatar/forums.knack.com/ryancarter86691/32/345_2.png) [@RyanCarter86691](https://forums.knack.com/u/RyanCarter86691)
#### Post date: [April 20, 2020, 1:39pm UTC](https://forums.knack.com/t/change-default-apple-touch-icon/10229/3 "2020-04-20T13:39:30Z")

</div>

Did anyone ever work out how to do this?&nbsp;

&nbsp;

---

<div class="post-metadata">

### Author: ![DeanBozzan62116](https://avatars.discourse-cdn.com/v4/letter/d/ad7895/32.png) [@DeanBozzan62116](https://forums.knack.com/u/DeanBozzan62116)
#### Post date: [September 27, 2016, 10:59pm UTC](https://forums.knack.com/t/change-default-apple-touch-icon/10229/4 "2016-09-27T22:59:40Z")

</div>

Given that a web app has a fairly long URL for typing into a phone browser and the fact that it is likely password protected as well, any way to shortcut the loading process would be great.&nbsp; So getting clients to add the app to their home screen is key to adoption and usage but that being said having a custom icon for the home screen should be a setting option in Knack.  

&nbsp;

---

<div class="post-metadata">

### Author: ![HollySchul61915](https://avatars.discourse-cdn.com/v4/letter/h/858c86/32.png) [@HollySchul61915](https://forums.knack.com/u/HollySchul61915)
#### Post date: [March 7, 2016, 6:36pm UTC](https://forums.knack.com/t/change-default-apple-touch-icon/10229/5 "2016-03-07T18:36:55Z")

</div>

I'm trying to figure out how to make the favicon / shelf icon / smart device icon our company or event logo, would love to know if/when there is a solution.&nbsp;