电子pp卡好用吗

書名： WordPress 2.7 Cookbook
作者名： Jean-Baptiste Jung
本章字?jǐn)?shù)： 437字
更新時(shí)間： 2021-04-01 13:55:49

Creating and integrating a favicon

A favicon is a small icon (16 x16 pixel) associated with a web site. The favicon is displayed by modern web browsers in the address bar, tabs, and bookmarks.

Nowadays, almost all the web sites and blogs have their own favicon. The following screenshot shows a favicon displayed in Mozilla Firefox:

Getting ready

You'll need a 16 x 16 pixels image to serve as a favicon. Due to the very small display size of the favicon, the image should be very simple.

Tip

I always tend to use a background color that fits my web site color scheme, and a simplified logo.

Basically, you can use .jpg, .png, .gif, or even .mng and .apng files to display a favicon. Unfortunately, the Internet Explorer (6 and 7) recognizes only the Windows .ico file format named favicon.ico.

Therefore, if you want to have an IE-compatible favicon, you'll have to convert your image file from png, gif, or jpg to Windows .ico.

Many imaging software applications can convert an image into a Windows icon file. Personally, I use an online service called ConvertIcon (available at the link http://converticon.com/) in order to convert my png image into Windows .ico file. The ConvertIcon application will also resize your image if needed. Therefore, there's no need to worry about your image width and height.

How to do it...

Once you have your favicon ready, upload it on your server under the directory of your choice. Personally, I prefer putting it in wp-content/themes/mytheme/. However, the choice is yours.
Open the header.php file from your theme. We now have to place a line of code to specify the location of our favicon. This line can be placed anywhere within the <head> and </head> tags.
Here's the code that we shall use in order to define an Internet Explorer compliant favicon:
```
<link rel="shortcut icon" type="image/x-icon" href="/path/to/your/favicon.ico" />
```
The preceding line of code is the standard code to integrate a favicon on a web site. Using the .ico format, you can make sure that your favicon will be displayed by Internet Explorer, which doesn’t happen when using the .png version.
If you uploaded your favicon into your wp-content/themes/yourtheme directory, we can use the bloginfo() function in order to automatically retrieve the template path as follows:
```
<link rel="shortcut icon" type="image/x-icon" href="<?php bloginfo('template_url'); ?>/favicon.ico" />
```
If you chose to use a file format, such as .gif, .png, or .jpg, you can add your favicon with the following code; however, Internet Explorer will not recognize it:
```
<link rel="icon" type="image/png" href="favicon.png" />
```
Once you have saved your header.php file, your favicon will be displayed.

How it works...

The following line of code is the standard code used to integrate a favicon on a web site:

<link rel="shortcut icon" type="image/x-icon" href="/path/to/your/favicon.ico" />

官术网_书友最值得收藏!

WordPress 2.7 Cookbook

Creating and integrating a favicon

Getting ready

Tip

How to do it...

How it works...