Home Website Promotion Tips & Tricks How to make a favicon.ico for Wordpress, Html or PhpBB
How to make a favicon.ico for Wordpress, Html or PhpBB PDF Print E-mail
User Rating: / 0
PoorBest 
Website Promotion - Tips & Tricks
Written by André de Groot   
Wednesday, 30 April 2008 22:57

Having a favicon.ico can make your website slightly more attractive(and thus promote your website...!)

 

See the ''S'' in the top left corner of this Wordpress blog? That's a favicon.ico!

I'll show you how to make one in a few steps:

 

1) Create a new document in your favorite editor, like Photoshop, Paintshop, MS Paint, etc.

Make the dimensions of the new document, width and height the same, for example 100 pixels x 100 pixels or bigger so that you have enough space to draw on.

 

2) Paste an image from Google, Flickr, Creative commons or stock photo's on the canvas or draw something yourself. When you are satisfied with the results save your piece of art as <nameofart>.jpg (.gif, .bmp, .png also supported)

 

3) Now visit the website: http://tools.dynamicdrive.com/favicon/

Press ''browse" and select the file you just saved and press ''open''. - Press "Create Icon" - Scroll a little bit down and press "Download FavIcon" - ''Save as'' and save the favicon.ico on your desktop.

 

4) Depending on which application(Html, Phpbb, Wordpress) you run you can put the following piece of code into your index.html document. (marked red)

Wordpress users may skip this step. !Before you begin make a backup of the files you are going to edit!

 

For PhpBB forums browse with your FTP program to: /styles/subsilver(or other styles name)/template/overall_header.html

Add the following html code(marked red) in the index.htm(l) or overall_header.html:

<head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <LINK REL="shortcut icon" HREF="http://yourdomainname.com/favicon.ico" TYPE="image/x-icon"> <title>WEBSITE PROMOTION AND SEO › Create New Post — WordPress</title>

...

</head>

 

Just place it near the <meta> and <title> tags near the top of your document bewteen the <head> and </head> tags.

When you are done re-upload the index.htm(l) or overall_header.html

 

5) Now upload the favicon.ico into the root directory(/) of your website with your favorite FTP program. If you decide that you want the favicon.ico into another directory then change the html code into:

<LINK REL="shortcut icon" HREF="http://yourdomainname.com/newdirectoryname/favicon.ico" TYPE="image/x-icon">

 

6) Refresh your browser and you should see your favicon.ico. For Wordpress users(who have their own domain)

 

7) Download the favicon.ico plugin from this website:

http://simply-basic.com/posts/194178

 

8) upload the plugin into the /wp-content/plugins/ directory of your website.

 

9) Activate this plugin in Wordpress.

 

10) Go to “Settings” à Admin Favicon and enter the URL location of your favicon.ico: http://yourdomainname.com/favicon.ico

Press “Update”
 
11) Ready! If you have any questions, please leave me a message:-)
AddThis Social Bookmark Button
Comments
Add New Search RSS
Write comment
Name:
Email:
 
Website:
Title:
UBBCode:
[b] [i] [u] [url] [quote] [code] [img] 
 
 
:angry::0:confused::cheer:B):evil::silly::dry::lol::kiss::D:pinch:
:(:shock::X:side::):P:unsure::woohoo::huh::whistle:;):s
:!::?::idea::arrow:
 
Please input the anti-spam code that you can read in the image.

3.22 Copyright (C) 2007 Alain Georgette / Copyright (C) 2006 Frantisek Hliva. All rights reserved."

Last Updated ( Wednesday, 30 April 2008 23:17 )
 

Sponsored Links

Powered by Joomla!. Valid XHTML and CSS.