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

10

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.

preahkumpii
la 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
1
@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:

3

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
la 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
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
0

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
la source