1. Flash

    Flash New Member Member

    Feb 16, 2008
    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:
    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:
    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:


    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:

    <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:


    Finally, scroll down and click on the save button and that should be it. Hope this helps :)
  2. snowmanrene

    snowmanrene New Member Member

    Dec 17, 2008
    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
    <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 
  3. sherwood

    sherwood New Member Member

    Dec 23, 2008
    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.
  4. Flash

    Flash New Member Member

    Feb 16, 2008
    Exactly and what I wrote shows you how to install your own over the vb one lawl.
  5. sherwood

    sherwood New Member Member

    Dec 23, 2008
    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?
  6. Flash

    Flash New Member Member

    Feb 16, 2008
    That's part 1 of the tutorial ;)
  7. Curtis129

    Curtis129 New Member Member

    Mar 8, 2009
    you can make a favicon in, '*.jpg', '*.jpeg', '*.png', or '*.gif'.
    Once on your server, rename it to '*.ico'

Share This Page