T-Shirt Forums banner

1 - 2 of 2 Posts

·
Registered
Joined
·
16 Posts
Discussion Starter #1
Long time lurker, first time poster.

So, how does one create a favicon for a website?

I asked myself this question when I was setting up my Spreadshirt shop and wondered if it was possible to do this on the site (and override the exisiting Spreadshirt favicon) It turns out it is possible to add this to your storefront.

Some of you may be old hands at this, however if you've never done this before for your site then here is a quick guide below.

1) Decide what image you want to display in the browser window.

2) Go to html-kit.com and upload a small image. I recommend you re-size your image beforehand in your favourite imaging software and crop your image down to around 32x32px. By making an image this small, it will give you a good idea of how your favicon will look when it appears on your browser window. Not all images will work at such a small size.

3) From this site mentioned above you can animate your favicon. I did this on my site, however I didn't opt for the word animation. Not my cup of tea really.

4) Once your done, press the 'Generate favicon.ico' button and your all set. The site will create a preview of your new icon, and then you can hit the download button and the site will quickly zip up a file containing the files you'll need to apply to your store.

5) Open the zip file and check out the contents. You'll find
a readme.txt file, plus two favicon files animated_favicon1.gif (for the animated version) and favicon.ico (plain old icon). You can ignore the .png file.

6) Now login to your Spreadshirt account and go to the graphics section (the one that allows you to upload your own pix)
The cool thing about Spreadshirt is that once these files are loaded they will create the
tags so that all you need to do is cut and paste into your headers.

7) So do that now. Copy each of these image URLS and paste them into a notepad for easy retrieval.

8) Now visit your Header & Footer pages and paste the two image URLs into the header. It is recommended that you paste in between the tags.

9) By the way, if you paste both, then the animated gif takes preference. In fact you only really need to paste one of the addresses. So choose which one you want after testing them out.

I hope this helps someone. I've learnt some much from t-shirtforum so time for some payback.

Also there are plenty of other favicon generators and some of them are listed in older posts on other forums.

See links below:

https://www.t-shirtforums.com/ecommerce-site-design/t32913.html

http://www.t-shirtforums.com/p272019-post2.html

over and out.
 

·
Registered
Joined
·
13 Posts
That just adds the icon to the top of my shop...

using standard way like this:

<link href='/users/613000/612859/226884/img/226884_favicon.ico' rel='shortcut icon' type='image/vnd.microsoft.icon'/>
<link href='/users/613000/612859/226884/img/226884_favicon.ico' rel='icon' type='image/vnd.microsoft.icon'/>


doesn't work for me either, any ideas?
 
1 - 2 of 2 Posts
Top