Website beautification: Add a nice favicon to your site

Source: Internet
Author: User
Keywords What the

Intermediary transaction http://www.aliyun.com/zixun/aggregation/6858.html ">seo diagnose Taobao guest cloud host technology Hall

"What is Favicon?" We see it almost every day, but not many people notice them. But in my experience, I can tell you that when you build a website for your users, adding your Favicon will be the last step of the project, and users will find this change easy.

  

About two years ago, I built a website for a friend. When I first showed her the site, she was most impressed by: "You still put such a small icon in the browser, how to do it ah?" The designers who gave him 6 sites didn't do that. So she thinks this is very advanced, want big website to have something.

What is Favicon? Favicon is the abbreviation of Favorites icon, or disambiguator icon, website icon, URL icon, or bookmark icon, is a 16x16 or 32x32 square icon. Different sites have different icons. Appears on the left side of the browser tab, like our Tower t.tt.

  

There are several ways to add favicon-to a Web site, add code to a theme file, and use Plug-ins. More commonly, make an icon locally and upload it to space for use.

How to create a Favicon that belongs to me

Now there are a lot of online generated Favicon website, you just need to upload your own pictures on it. For example:

Dynamic Drive–favicon Generator

Favicon Generator

favicon.cc

Favico

Favicon Generator & Gallery

The last site has a picture library, you can see the other site Favicon is how, and then can give you some inspiration. Favicon is an icon with a width of 16 pixels, and you have only 256 pixel authoring space. So your Favicon can not be too complicated, otherwise it is not recognized. In fact, the simpler the better, the more simple it is to look at the icons that generate Favicon websites.

Add Favicon without using Plug-ins

Let's say you've done a Favicon now, how do you put him on your website?

In fact, without the use of plug-ins can also be very simple to render Favicon to the site's visitors. There are many tutorials on the web that let you add the following code to the section:

<link rel= "disambiguator icon" href= "Http://www.domain.com/favicon.ico" type= "Image/x-icon"/>


<link rel= "icon" href= "Http://www.domain.com/favicon.ico" type= "Image/x-icon"/>

But in fact this is a bit superfluous, now the browser will ignore the "disambiguator" entries, and "icon" entries instead. So what you need to add to it is actually just the second line:

<link rel= "icon" href= "Http://www.favicon.co.uk/favicon.ico" type= "Image/x-icon"/>

Add a "Favicon" with a plugin

Once again assume that you have done a Favicon, and you are not very familiar with the code, then you have other options?

In fact, you can use Plug-ins to achieve the goal.

First of all, make sure that your site's theme is what framework, because there may be a corresponding plug-in. It's like the Genesis framework has its own plugin Genesis Favicon plugin. If your theme is Wootheme, then the topic already contains the upload Favicon function.

If your subject frame does not support Favicon direct upload and there is no relevant plug-ins, then you can try this plugin: all in one Favicon. After installing the activation plugin, go to the Setup interface and upload your own Favicon or post the network address. After saving refresh the site should be able to see the new Favicon (if you manually clear the browser cache or do not set the cache).

Use Plug-ins to create and add Favicon

If you still feel a bit of trouble with the method mentioned above, you can consider using the plugin Favicon generator plugin to create and add one step.

When you upload this plugin to your site and then activate it, you need to change the permissions on several directories to 777:

/wp-content/plugins/favicon-generator

/wp-content/plugins/favicon-generator/uploads

Then we go back to the Favicon Generator menu (which will appear in the options after installing the plugin), and you'll see the interface shown in the following image:

  

Here, you can upload one or more images and convert them to Favicon for use. In the plugin description you can use JPG, JPEG, GIF, and PNG files, but I have tried not to successfully convert PNG files to Favicon files, JPG is OK. In addition, this requires you to configure the GD2 library in your PHP application, and ask your hosting provider if you are unsure.

One advantage of this plugin is that you can periodically change your Favicon icon if you want to.

Randomly replace your Favicon image

This is just to make your site more interesting or personal. The periodic replacement Favicon mentioned above is only replaced manually when you need to replace them. If you think the branding of your site can be enhanced with Favicon changes, or you think it's cool. You can consider this plugin: Favicon rotator. This plugin allows you to upload multiple Favicon at once and then randomly replace them. But I'm not going to do that, and I don't think it's a good idea.

After reading this article to find their own blog or Web site has not Favicon hurriedly to add a bar.

Original: Add and use A Favicon on Your WordPress Website to Easy branding

This article compiles by Cloudcheung, reprint please indicate the source address in the form of the clickable hyperlink: http://t.tt/49/

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.