Comment obtenir des icônes de favoris personnalisées dans Safari 8 sur Yosemite?

Je souhaite ajouter des icônes de favoris personnalisées (c'est-à-dire une nouvelle page d'onglet) pour mon site Web dans Safari 8 sur Yosemite. J'ai essayé la balise graphique ouverte og:imageavec les formats png et jpg. J'ai également examiné la source de plusieurs sites qui avaient les icônes personnalisées dans ma page de favoris, y compris un site qui semblait mettre à jour son icône, et je ne trouve toujours pas la bonne façon d'inclure ces icônes. De l'aide? Merci.

safari yosemite

— preahkumpii
source

Vous parlez de favicon?

— StrawHara

Non. Je fais référence aux icônes de favoris dans la nouvelle page à onglet de Safari.

— preahkumpii

Vous avez essayé de supprimer le fichier associé dans /Users/USER_NAME/Library/Safari/LocalStorage/http.yourwebsite.localstorage avant d'ajouter votre site Web dans Favoris?

— StrawHara

Oui. Il ne se passe rien. L'icône personnalisée ne s'est jamais affichée. Seule l'icône par défaut est affichée, ce qui me fait croire que je n'implémente pas correctement l'utilisation de l'icône.

— preahkumpii

@MrMojoRisin C'est pour la mise en page Safari personnelle de l'utilisateur. C'est vraiment le bon endroit ici. Et maintenant je me demande sérieusement comment faire ça ..

— Rob

Réponses:

Ce n'est pas lié à OS X, je vais donc laisser le modérateur déplacer cette question vers un autre réseau. Mais je vais quand même répondre à cela. Celui dont vous parlez est Apple Touch Icon qui peut être implémenté en utilisant le balisage ci-dessous:

<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">

Il existe plusieurs tailles car il doit prendre en charge l'affichage Retina et non Retina.

Source: Astuces CSS

— sayzlim
source

Ca ne fonctionne pas. Je les ai ajoutés aux tailles 57, 120 et 152 (selon le site Web d'Apple) et les favoris ne répondent pas.

— preahkumpii

Quel est votre site web?

— sayzlim

pintsizedtreasures.com

— preahkumpii

J'ai ouvert votre site et je n'ai pas trouvé les icônes tactiles mentionnées. L'avez-vous inséré?

— sayzlim

Je les ai insérés, mais les icônes ne s'affichent pas, je les ai donc supprimés. Maintenant, cependant, les icônes préférées s'affichent maintenant dans Safari. Je ne sais pas pourquoi. Allez comprendre.

— preahkumpii

Safari (au moins la version 9.0.2 sur Yosemite) n'affiche pas de favicon dans les onglets. Pour une solution côté client, je recommande SafariStand . Il s'agit d'un plug-in SIMBL qui ajoute de nombreuses fonctionnalités supplémentaires à Safari telles que le favicon sur les onglets et la barre de signets, le panneau de téléchargement et de signets séparé et d'autres ajustements.

— Hamid Rohani
source