Como obter ícones favoritos personalizados no Safari 8 no Yosemite?

Desejo adicionar ícones favoritos personalizados (ou seja, nova página da guia) ao meu site no Safari 8 no Yosemite. Eu tentei a tag de gráfico aberto og:imagecom os formatos png e jpg. Também examinei a fonte de vários sites que tinham os ícones personalizados na minha página de favoritos, incluindo um site que parecia atualizar seu ícone, e ainda não consigo encontrar a maneira correta de incluir esses ícones. Qualquer ajuda? Obrigado.

safari yosemite

— preahkumpii
fonte

Você fala sobre favicon?

— StrawHara 22/10

Não. Estou me referindo aos ícones favoritos na nova página da guia no Safari.

— preahkumpii

Você tentou excluir o arquivo associado em /Users/USER_NAME/Library/Safari/LocalStorage/http.yourwebsite.localstorage antes de adicionar seu site ao Favorito?

— 22914 StrawHara

Sim. Nada acontece. O ícone personalizado nunca foi exibido. Apenas o ícone padrão foi exibido, fazendo-me acreditar que não estou implementando o uso do ícone corretamente.

— preahkumpii

@MrMojoRisin É para o layout pessoal do Safari. Este é definitivamente o lugar certo aqui. E agora eu me pergunto seriamente como fazer isso ..

— Rob

Respostas:

Isso não está relacionado ao OS X, então deixarei o moderador mover essa pergunta para outra rede. Mas ainda vou responder isso. O que você está falando é o Apple Touch Icon, que pode ser implementado usando a marcação abaixo:

<link rel="apple-touch-icon" sizes="57x57" href="/apple//apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="114x114" href="/apple//apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="72x72" href="/apple//apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="144x144" href="/apple//apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="60x60" href="/apple//apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="120x120" href="/apple//apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="76x76" href="/apple//apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="152x152" href="/apple//apple-touch-icon-152x152.png">

Existem vários tamanhos, pois ele precisa suportar telas Retina e não Retina.

Fonte: Truques CSS

— sayzlim
fonte

Não está funcionando. Eu os adicionei nos tamanhos 57, 120 e 152 (conforme o site da apple) e os favoritos não estão respondendo.

— preahkumpii

Qual é o seu site?

— sayzlim

pintsizedtreasures.com

— preahkumpii

Abri o site e não encontrei os ícones de toque mencionados. Você o inseriu?

— sayzlim

Eu os inseri, mas os ícones não apareceram, então os removi. Agora, no entanto, os ícones favoritos estão sendo exibidos no Safari. Eu não tenho ideia do porquê. Vai saber.

— preahkumpii

O Safari (pelo menos a versão 9.0.2 no Yosemite) não mostra favicon nas guias. Para uma solução do lado do cliente, recomendo o SafariStand . É um plug-in SIMBL que adiciona muitos recursos extras ao Safari, como o favicon nas guias e na barra de favoritos, o painel separado de downloads e favoritos e outros ajustes.

— Hamid Rohani
fonte