web-dev-qa-db-fra.com

Ajouter une image dans la barre de titre

Comment ajouter une image dans la barre de titre?

J'ai le titre "Webnet"

La fusion avec les images d'icônes d'un FontAwesome Glyphicon

<title><i class="icon-user icon-black"></i>Webnet</title>

Et j'ai essayé de le remplacer par une image source-

<title><img src="assests/img/user-Hermosillo.png" ></img>Webnet</title>

Mais le titre affiche innerHTML au lieu d’y afficher une image.

De l'aide?

43
Manoz

Cette méthode ne fonctionnera pas. Le <title> ne prend en charge que le texte brut. Vous devrez créer une image .ico avec le nom de fichier favicon.ico et l'enregistrer dans le dossier racine de votre site (où se trouve votre page par défaut).

Vous pouvez également enregistrer l'icône où vous le souhaitez et l'appeler comme vous le souhaitez, mais insérez simplement le code suivant dans la section <head> de votre code HTML et référencez votre icône:

<link rel="shortcut icon" href="your_image_path_and_name.ico" />

Vous pouvez utiliser Photoshop (avec un plug-in) ou GIMP (gratuit) pour créer un fichier .ico, ou vous pouvez simplement utiliser IcoFX , qui est mon préféré, car il est très facile de utilise et fait un excellent travail (vous pouvez obtenir gratuitement une ancienne version du logiciel auprès de download.com ).

Mise à jour 1: Vous pouvez également utiliser plusieurs outils en ligne pour créer des favicons tels que ConvertIcon , que j'ai utilisé avec succès. . Il existe également d’autres outils en ligne gratuits, qui font de même (accessibles par une simple recherche sur Google), mais génèrent également d’autres icônes telles que les icônes du menu Démarrer de Windows 8/10 et les icônes d’application iOS.

Mise à jour 2: Vous pouvez également utiliser .png images en tant qu'icônes à condition que IE11 soit la seule version de IE vous devez soutenir . Vous avez juste besoin de les référencer en utilisant le code HTML ci-dessus. Notez que IE10 et les versions antérieures nécessitent toujours des fichiers .ico.

69

vous devriez chercher à savoir comment ajouter favicon.ico. Vous pouvez essayer d’ajouter favicon.ico directement dans vos pages HTML comme ceci

<link rel="shortcut icon" href="/favicon.png" type="image/png">
<link rel="shortcut icon" type="image/png" href="http://www.example.com/favicon.png" />

Ou vous pouvez mettre à jour cela dans votre webserver. Il est conseillé d’ajouter dans votre webserver car vous n’avez pas besoin de l’ajouter dans chacune de vos pages html (en supposant que non includes).

Pour ajouter dans votre Apache placez le favicon.ico dans votre directeur de site Web racine et ajoutez-le dans httpd.conf

AddType image/x-icon .ico
18
nandu

Ajoutez ceci dans la section head de votre html

<link rel="icon" type="image/gif/png" href="mouse_select_left.png">
16
karthick

Vous devrez utiliser un favicon pour votre page. mettez ceci dans la balise head: <link rel="shortcut icon" href="/favicon.png" type="image/png">

où favicon.png est de préférence une image png de 16x16.

source: Ajout d'un favicon à une page HTML statique

11
errieman