Smartphone last opened pages preview icon how to set it up in code?

Question

the last opened pages got a shortcut in chrome and safari on smartphone. but my page not.

how do I set up the picture for this?

for example ikea and bild works

favicon is set

<link rel="shortcut icon" href="include/designs/wirte/favicon.ico">
<link rel="shortcut icon" href="include/designs/design/images/favicon.png" type="image/x-icon">
<link rel="icon" href="include/designs/design/images/favicon.png" type="image/x-icon">

Possible duplicate of [Creating a favicon](http://stackoverflow.com/questions/1547150/creating-a-favicon) — Faegy, Dec 21 '16 at 11:21
[See this answer](http://stackoverflow.com/a/29904926/7094618). — Faegy, Dec 21 '16 at 11:22

score 1 · Accepted Answer · answered Dec 21 '16 at 14:32

iOS Safari uses the Apple Touch icon for this purpose and also bookmarks and home screen icons. You definitely want to declare this one.

Android Chrome is similar, it reuses the icon it already takes for bookmarks and home screen icons:

A high resolution icon declared in a Web App manifest.
Else, a high resolution PNG icon.
Else, the classic Apple Touch icon.

As an alternative to the classic, manual creation, you can use this online favicon generator. It allows you to design your icons platform per platform and creates the icons and HTML you need to get the job done. Full disclosure: I'm the author of this site.

score 0 · Answer 2 · answered Dec 21 '16 at 11:24

0

Add this code with your favicon.

 <link rel="SHORTCUT ICON" HREF="/favicon.png">

answered Dec 21 '16 at 11:24

Anna Jeanine

3,975
10
40
74

Smartphone last opened pages preview icon how to set it up in code?

2 Answers2