[TUT] How to install a Favicon in vBulletin

Status
Not open for further replies.

Flash

Active Member
1,463
2008
191
0
In this tutorial I am going to teach you how to install a Favicon to your website in vBulletin.


First off what is a Favicon?

  • A favicon (short for favorites icon), also known as a website icon, shortcut icon, url icon, or bookmark icon is a 16x16 pixel square icon associated with a particular website or webpage.
More info:
Code:
http://en.wikipedia.org/wiki/Favicon
Lets get started:

What you will need:

  • vBulletin fully installed
  • A favicon (in .ICO format)
  • A FTP client (if you don't have one google FileZilla, its free)
  • Common sense
1st. Make sure you have a Favicon that is 16x16 pixels, more importantly make sure you have it saved as a .ICO file or you're fucked and it won't work. Well not really, if you have a 16x16 image but its not in a .ICO file format you can visit this site and convert your image to a .ICO file:
Code:
http://www.chami.com/html-kit/services/favicon/
2nd. Log in to your FTP account using Filezilla (or your preferred FTP client), make sure you enter all your details including the user name and password provided by your host or you won't log in successfully. Now locate the public_HTML folder (should be on the "Remote Site" section on your FTP) and open it. Now within the folder locate the folder where you installed vBulletin. Once located, drag and drop your favicon into that folder. Now refresh your public_HTML folder by double clicking it and you should be done. Your Favicon should now show on your website.

**If for some reason that didn't work try the following:
(Make sure you have your Favicon in your vBulletin folder or else it will fail!)
1st. Log in into your vBulletin AdminCP.
2nd. Now navigate to Styles and Templates - Style Manger
3rd. Now select which style you would like to add the favicon and select Common Templates from the drop down menu, here is a picture to guide you:

2lij1jr.png


Once there, navigate to headinclude and find the following: <!-- CSS Stylesheet -->

Once found, make a space on the bottom of that line and insert this:

Code:
<link REL="SHORTCUT ICON" HREF="favicon.ico">
In the part where it says "favicon.ico" rename it to the file name of your favicon. If you didn't rename your favicon and left it as favicon.ico then don't change nothing and leave it alone. Here is a picture for a guide:

5mg8lc.png


Finally, scroll down and click on the save button and that should be it. Hope this helps :)
 
6 comments
To add to phpbb3, upload the favicon to the root of the site i.e where index.php is located.

Then go into your style folder, and open up overall_header.html
PHP:
//Find
<meta name="description" content="" />

//Add After
<link rel="shortcut icon" href="http://YOURSITE.COM/favicon.ico" type="image/x-icon" />
<link rel="icon" href="http://YOURSITE.COM/favicon.ico" type="image/x-icon" /> 

//Change 'YOURSITE.COM' to the link to your favicon.ico

Cheers
 
vBulletin shouldn't need this adding as I'm positive it already picks up a favicon by default since when you install it, it installs it with vb's default favicon so all you need to do is replace that one with your own.
 
vBulletin shouldn't need this adding as I'm positive it already picks up a favicon by default since when you install it, it installs it with vb's default favicon so all you need to do is replace that one with your own.

Exactly and what I wrote shows you how to install your own over the vb one lawl.
 
hmm okay, but doesn't this seem to be a lot of trouble when you can just upload another favicon named favicon.ico to your forum directory and then just click replace/overwrite when uploading it?
 
Status
Not open for further replies.
Back
Top