Using Favicons on Blogger Blog
Favicons activation for the blogger using Blogger platform is easy as well. However, the old method of getting a custom Favicon to display in a Blogger blog no longer works, as of October 2008. If you had your Favicons before that, and they suddenly disappeared, you will just have to reinsert the code in a different area of your Blogger template. If you never had them before, the following instructions will work for you.
The process will take two simple steps, taking that you already found or created your Favicon (review earlier publication).
Step 1: Upload your Favicon file to the Host
Any free images hosting will work for you, if it answers two major questions: reliability and support for ICO format. The easiest way for the Blogger users is taking advantage of the Google Page Creator. You just need to copy the ICO file to a host server so you can link to it.
Go to Google Page Creator and login using your Google account details (use the same details you use for Blogger login). The first time you login to Page Creator you will be given the option of creating a site based on your Gmail address. You might not worry about the look of your new website, as for now you are using it just for your Favicon icons secure storage. When icon has been uploaded, record its web address, as you will need it at the step 2.
Step 2: Add the Favicon HTML to your Blogger site
Go into the Blogger Layout Editor and choose the "Edit HTML" option. As always, before doing any modifications to your template, make sure to save a backup copy to a secure location at your hard drive.
Insert the following code between the]]></b:skin>and </head> tags in your Blogger template:
<link href=’http://YOUR_GMAIL_ADDRESS.googlepages.com/YOUR_ICO_FILENAME.ico’ rel=’shortcut icon’ type=’image/x-icon’/>
Don’t forget to change the URL so it points to the .ico file on your Google Page Creator site (code elements highlighted in red font). Now save your template and view your blog. If your new Favicon doesn’t show up straight away you may need to clear your browser cache.
Note, that the Favicons might not be visible on some browsers. For example, browser I use most often, Maxthon (IE-driver based), did not show them right away. While other browsers, I tried, showed them instantly: Firefox, Chrome, and Flock. Yes, if you use Internet Explorer, the Favicon will not appear unless you have bookmarked your blog and refreshed your browser.
Additional Information:
http://www.thebeginnersbloggingguide.com/2008/05/how-to-add-favicon-to-your-blogger-blog.html
http://www.bloggerbuster.com/2008/04/favicons-made-easy.html
http://www.bloggertipsandtricks.com/2008/10/fix-for-missing-favicon.html
Showing posts with label favicon. Show all posts
Showing posts with label favicon. Show all posts
06 April 2009
02 April 2009
Using Favicon for your Blog or Website (Part 2)
The Best 5 Free WordPress Plugins to Enable Favicon on your Blog
In our previous publication we explained how you can create custom Favicons to be used as your trademark for you blog. The next step would be activating it. The related action plan will be different for various blogging platforms. In this post, we will present several plugins to enable Favicon for your WordPress blog.
As a first step of your activation process, you have to upload Favicon you generated earlier to your blog directory, for example, http://localhost/blog/, or you can keep it in one of your free image storage location, when the link to the image is handy for the further processes. As the next step, you can use one of the free Wordpress plugins to create a link to it from the header of the Wordpress blog pages and administrative console.
faVicon is a simple and easy to use plugin, creating a new options menu. After downloading faVicon.zip, unzip the contents and upload them to your wp-content/plugins Wordpress directory (you do not need to upload all images file - they provided only for examples). Then, navigate to the plugins page in the Wordpress administrative console and press Activate.
As plugin is activated, in the top navigation bar of your administrative console, click on Options. Then, in the sub menu thatappears, click on faVicon. An options page will then appear. In the text boxes labeled Favicon URL, Animated Favicon (GIF) URL, Admin Panel Favicon (GIF) URL, enter the web address of your desired favicons.
Favicon Head is a simple way to automatically include correct tags for linking to your favicon in the head of every page in your blog. No file editing is required, you only have to upload the file to the plugin directory and activate it. The default favicon location is favicon.ico, but can be changed through the options page.
Installation Steps:
This plugin creates a new options menu. Just navigate to “Settings.” Then, in the sub menu that appears, click on “Admin Favicon”. An options page will then appear. In the text box labeled “Favicon URL”, enter the web address of your desired favicon. If you uploaded the sample wpfavicon.ico, enter it’s location on your server here. Otherwise, use your own favicon image. Typically, this will be an ico file that you’ve created and uploaded to your server. For example, if you’ve uploaded favicon.ico to your main website address, you would enter http://www.MyMainWebsiteAddress.com/favicon.ico
Favicon Manager Wordpress Plugin is a small plugin that allows you to manage the favicon image for your WordPress installation. You can specify any arbitrary file, either locally within your installation, or at an arbitrary url. You can also optionally have the image included in either your RSS2 or your Atom feeds, or both. All options can be set from the new options menu in the administration panel. There is no editing of any files required.
Installation steps:
This is a drop in plugin, there are no additional files to set because it’s all done through the administration panel under Options->Favicons. Once you set your favicon location, it will display below the input field. This helps you determine quickly whether or not you entered your favicon location correctly without having to go refresh other browser windows or tabs to see if it worked. Note that this plugin will only work with WordPress 2.0 and above.
MaxBlogPress Favicon Wordpress Plugin allows you use the preset collection of the embedded favicons, or gives option to link to the image in the blog directory or on the external website. Installation can be completed in three easy steps.
Step 1: Install the plugin and go to: Options >> MBP Favicon
Step 2: Click on the icon which you want to use as favicon:
Step 3: Click on save
Note that when you first activate the plugin you will be asked to register it, which signs you up to an email list which you then have to confirm your subscription to. Upon clicking the confirmation link you are then directed to a page that is trying to sell you some blog traffic package. You’ll need to scroll all the way down to the bottom of the page to select “no thanks”.
On the following video, Caroline Middlebrook gives a nice video presentation of the plugin installation:
MaxBlogPress WordPress Plugin to install Favicon
In our previous publication we explained how you can create custom Favicons to be used as your trademark for you blog. The next step would be activating it. The related action plan will be different for various blogging platforms. In this post, we will present several plugins to enable Favicon for your WordPress blog.
As a first step of your activation process, you have to upload Favicon you generated earlier to your blog directory, for example, http://localhost/blog/, or you can keep it in one of your free image storage location, when the link to the image is handy for the further processes. As the next step, you can use one of the free Wordpress plugins to create a link to it from the header of the Wordpress blog pages and administrative console.
faVicon is a simple and easy to use plugin, creating a new options menu. After downloading faVicon.zip, unzip the contents and upload them to your wp-content/plugins Wordpress directory (you do not need to upload all images file - they provided only for examples). Then, navigate to the plugins page in the Wordpress administrative console and press Activate.
As plugin is activated, in the top navigation bar of your administrative console, click on Options. Then, in the sub menu thatappears, click on faVicon. An options page will then appear. In the text boxes labeled Favicon URL, Animated Favicon (GIF) URL, Admin Panel Favicon (GIF) URL, enter the web address of your desired favicons.
Favicon Head is a simple way to automatically include correct tags for linking to your favicon in the head of every page in your blog. No file editing is required, you only have to upload the file to the plugin directory and activate it. The default favicon location is favicon.ico, but can be changed through the options page.
Installation Steps:
- Download Favicon Head 1.1.
- Unzip the file and upload it to wp-content/plugins/.
- Click the “Plugins” tab in the WP admin panel and activate Favicon Head.
- Go to the “Options” tab and click the “Favicon Head” sub-page in order to change the favicon location from /favicon.ico.
- Animated favicon support
- Custom favicon location
- Works in WordPress 1.5 and 2.
This plugin creates a new options menu. Just navigate to “Settings.” Then, in the sub menu that appears, click on “Admin Favicon”. An options page will then appear. In the text box labeled “Favicon URL”, enter the web address of your desired favicon. If you uploaded the sample wpfavicon.ico, enter it’s location on your server here. Otherwise, use your own favicon image. Typically, this will be an ico file that you’ve created and uploaded to your server. For example, if you’ve uploaded favicon.ico to your main website address, you would enter http://www.MyMainWebsiteAddress.com/favicon.ico
Favicon Manager Wordpress Plugin is a small plugin that allows you to manage the favicon image for your WordPress installation. You can specify any arbitrary file, either locally within your installation, or at an arbitrary url. You can also optionally have the image included in either your RSS2 or your Atom feeds, or both. All options can be set from the new options menu in the administration panel. There is no editing of any files required.
Installation steps:
- Download the zipped file to your plugins directory and unpack. You should have a new directory containing the favicon manager files now.
- Activate the plugin from the Plugins panel.
- Set your favicon location and your feed options from the Options->Favicons menu of the Administration panel.
This is a drop in plugin, there are no additional files to set because it’s all done through the administration panel under Options->Favicons. Once you set your favicon location, it will display below the input field. This helps you determine quickly whether or not you entered your favicon location correctly without having to go refresh other browser windows or tabs to see if it worked. Note that this plugin will only work with WordPress 2.0 and above.
MaxBlogPress Favicon Wordpress Plugin allows you use the preset collection of the embedded favicons, or gives option to link to the image in the blog directory or on the external website. Installation can be completed in three easy steps.
Step 1: Install the plugin and go to: Options >> MBP Favicon
Step 2: Click on the icon which you want to use as favicon:
Note that when you first activate the plugin you will be asked to register it, which signs you up to an email list which you then have to confirm your subscription to. Upon clicking the confirmation link you are then directed to a page that is trying to sell you some blog traffic package. You’ll need to scroll all the way down to the bottom of the page to select “no thanks”.
On the following video, Caroline Middlebrook gives a nice video presentation of the plugin installation:
MaxBlogPress WordPress Plugin to install Favicon
30 March 2009
Using Favicon for your Blog or Website (Part 1)
What is Favicon and how it can help you Blog?
A ‘favicon’ is the little graphic you sometimes see next to a website address in your browser. See example below:
When you have a site to your favorites folder, you will also notice the same little icon graphic displayed next to the bookmark. A favicon graphic can help make your web page stand out amongst all the over bookmarks fighting for attention…plus it also looks cool!
In this post we will discuss the opportunities on how to generate the Favicon, you would be able to use as your trademark later. The following post will present the opportunities of activating it in different blogging platforms (Blogger users should follow a different approach than WordPress users).
So, you would first need to have an icon which you would like to use, bearing the extension .ico format. If you search your hard disk, you might find some icons which are generic. I would suggest that you create one to represent your own unique identity. There is quite a number of free icon editor software which you can download from the net.
Before getting to the point of Favicon generation - conversion to the accepted format and size - you need to have a source image. Note that the image you plan to use should be royalty-free and not copyrighted (meaning, you cannot use Coca-Cola’s corporate logo as you favicon).
There are multiple utilities that will help you in the conversion process. Note that you can create icons in 2 sizes: 16x16 and 32x32. To satisfy the visibility in the bigger set of browsers, I would recommend using a 16x16 icon.
Freeware Favicon Creators
Imagicon is a graphics utility designed to convert multiple image files from BMP, JPG or PNG image formats into any of the following image formats (24-bit):
Adsen FavIcon is a simple favion freeware creator that lets people make a fav icon for their website, which shows up in IE`s favorites. It can use either bmp or jpg files, and will convert them to ico format using the size and color quality you choose. Not only can you create fav icons, but it can also be used for creating icons for programs. Adsen FavIcon comes with notes on what settings to use for making fav icons and how to install them.
This software is freeware as well and supports most of the Windows OS platforms: Windows 95/98/2000/ME/NT/XP.
Png2ico - simple PNG to ICO converter with no graphic interface, easy to use. To create favicon.ico that contains your logo in the resolutions 16x16 and 32x32, you should use the following command line: png2ico favicon.ico logo16x16.png logo32x32.png.
Note that this is a console application without GUI. You may run it through console or Start/Run only. Double-clicking on the file will not execute it.
The software is freeware and supports the folloing platforms: Windows, Linux, Unix, GNU, etc.
Online Favicon Generators
If you do not wish to download any software, you may also try creating an icon online. Just enter the keywords “online icon generator” into your Google search bar, and you should be able to find several programs that you can try. These online software sites now make it incredibly easy for anyone to convert normal graphics into favicons. In most cases, you just browse to the file on your PC and click ‘generate icon’. After your favicon is created you can download it on your Hard Drive for future use.
Selected sites that can be used for online favicons and icons generation:
http://www.favicon.co.uk/
http://www.htmlkit.com/services/favicon/
http://www.favicongenerator.com/
http://www.freefavicon.com/
http://www.degraeve.com/favicon/
http://www.favicongenerator.org/
http://www.genfavicon.com/
http://freefavicons.org/
A ‘favicon’ is the little graphic you sometimes see next to a website address in your browser. See example below:
In this post we will discuss the opportunities on how to generate the Favicon, you would be able to use as your trademark later. The following post will present the opportunities of activating it in different blogging platforms (Blogger users should follow a different approach than WordPress users).
So, you would first need to have an icon which you would like to use, bearing the extension .ico format. If you search your hard disk, you might find some icons which are generic. I would suggest that you create one to represent your own unique identity. There is quite a number of free icon editor software which you can download from the net.
Before getting to the point of Favicon generation - conversion to the accepted format and size - you need to have a source image. Note that the image you plan to use should be royalty-free and not copyrighted (meaning, you cannot use Coca-Cola’s corporate logo as you favicon).
There are multiple utilities that will help you in the conversion process. Note that you can create icons in 2 sizes: 16x16 and 32x32. To satisfy the visibility in the bigger set of browsers, I would recommend using a 16x16 icon.
Freeware Favicon Creators
Imagicon is a graphics utility designed to convert multiple image files from BMP, JPG or PNG image formats into any of the following image formats (24-bit):
- Windows or OS/2 Bitmap (BMP)
- Independent JPEG Group (JPG)
- Portable Network Graphics (PNG)
- Windows Icon (ICO)
Adsen FavIcon is a simple favion freeware creator that lets people make a fav icon for their website, which shows up in IE`s favorites. It can use either bmp or jpg files, and will convert them to ico format using the size and color quality you choose. Not only can you create fav icons, but it can also be used for creating icons for programs. Adsen FavIcon comes with notes on what settings to use for making fav icons and how to install them.
This software is freeware as well and supports most of the Windows OS platforms: Windows 95/98/2000/ME/NT/XP.
Png2ico - simple PNG to ICO converter with no graphic interface, easy to use. To create favicon.ico that contains your logo in the resolutions 16x16 and 32x32, you should use the following command line: png2ico favicon.ico logo16x16.png logo32x32.png.
Note that this is a console application without GUI. You may run it through console or Start/Run only. Double-clicking on the file will not execute it.
The software is freeware and supports the folloing platforms: Windows, Linux, Unix, GNU, etc.
Online Favicon Generators
If you do not wish to download any software, you may also try creating an icon online. Just enter the keywords “online icon generator” into your Google search bar, and you should be able to find several programs that you can try. These online software sites now make it incredibly easy for anyone to convert normal graphics into favicons. In most cases, you just browse to the file on your PC and click ‘generate icon’. After your favicon is created you can download it on your Hard Drive for future use.
Selected sites that can be used for online favicons and icons generation:
http://www.favicon.co.uk/
http://www.htmlkit.com/services/favicon/
http://www.favicongenerator.com/
http://www.freefavicon.com/
http://www.degraeve.com/favicon/
http://www.favicongenerator.org/
http://www.genfavicon.com/
http://freefavicons.org/
Subscribe to:
Posts (Atom)
LinkWithin
