socialgo
Feb 3rd

Make a Favicon

By ezra vancil

Update

I don't know if I just missed it or they added this feature in the last few days. Anyhow, you can now upload your favicon directly into SG in the account details area. Well, now if you have another site, you'll know how to do it. 

You've worked hard on your network, creating it unique to you and your vision, but there is one small detail I bet, at least some of you, have over-looked. In the url bar of your browser is a neat little icon of your logo (well it will be once you get your favicon in there). Right now, if you havn't set your favicon it's socialgo's icon your sport'n to all your members. This icon shows up in the url bar, tabs and bookmarks.

socialgo favicon

socialgo favicon

socialgo favicon

Now you can use any format of an image file you want, but the proper way to do this would be to define the profile in your head tag, which we can't do since we don't have access to the head tag, and then to define the "type" inside of the link. This is what it will look like: 

type="image/gif"
HREF="http://www.networklogic.net/prosocial/favicon.gif"/>

Another way would be to use a ICO file and skip defining the TYPE:

Now all we need to do is make a ICO, png or gif file. Here is the plug-in you will need for an ICO file format in Photoshop.

ICO Photoshop Plugin This is also tested to work in Paint shop Pro and Photoshop Elements. Instal the plugin by putting it in your Photoshop Foler > Plugins > File Format. Then close and restart Photoshop.

The size of a Favicon is 16x16 and we will transform and optimize our image using photoshop. 

1) create a blank 16x16px file in photoshop

2) copy and paste your logo into this document, before you click enter, resize the image to fit the 16x16px.

3) aply filter "unsharpen mask" to image (filter>Sharpen>unsharpmask). I really crunch it because it's so small and blurry - my settings are:
  • Amount - 40
  • Radius - 1.8
  • Threshhold - 3
4) save file as ICO

5) upload to you server

6) insert Code above into the head of your Ads/HTML area of Admin, Make sure to replace the url with the Url of your image. Tada!

One Problem I've found:

Once you set up your own URL, it seems to work seamlessly.

If you have not set-up your own url and pointed it at the socialgo servers you will have a flicker of the socialgo favicon when a page first loads. Once you set up your URL though, it seems to work seamlessly.

1 Comments