HOW CAN I DO THAT?

Followers

Thursday, July 14, 2011

Adding A Favicon To Your URL

Alrighty then! A bunch of you have asked...and I have shown...how to add a favicon to your blog URL. If you look up at mine on this page, it's a gun and magnifying glass. It goes along with my website http://bonniescalhoun.com, where I am going to integrate this page like the rest of my blogs.

(Update: this is still a valid method for your website, but Blogger has now added the ability to your Page Elements page. At the top left corner of the Page Elements layout, click the edit button on the Favicon element, and upload your image...Viola! If you are using a customized template that doesn't have Page Elements, you may still need this method for your blog!)

LOL...the favicon is that little itty bitty image. They are only 16 pixels by 16 pixels. So when you are creating one use a square image so that it reduces correctly.

First you are going to decide on what image you want, and using your favorite imaging software I's say reduce it to at least 50px X 50px then you will get an idea of how it is going to look small. Take that image and go over here to Dynamic Drive-Favicon Generator and input the image. It will create a favicon for you.

Now if you are uploading it to your website (not blog) just follow the directions on the lower portion of the Dynamic Rive page. (no sense rewriting what they have). If you want to use the favicon on your blog in place of Bloggers Orange B, follow these directions.

Upload the favicon to a blog post, label the post as "Favicon" and save it as a draft. You are doing that to get the image onto the Blogger (Picasa) servers. Now you are going to create the code that you need. Copy this code:

<link href='http://3.bp.blogspot.com/-eO5-qj5k9V0/TfJs66ovG3I/AAAAAAAAD64/OlazI7MKM/s1600/favicon.bmp' rel='icon' type='image/x-icon'/>
<link href='http://3.bp.blogspot.com/-eO5-qj5k9V0/TfJs66ovG3I/AAAAAAAAD64/OlazI7MKM/s1600/favicon.bmp' rel='shortcut icon' type='image/x-icon'/>

The red links are the part that you are going to replace with your own image link from Blogger. It may be an .ico or a .bmp, that's all right. The one thing that you have to watch for when creating this code is that if you create it in Word.com it will add a bunch of funky coding to it, and even "smart quotes" Blogger...nor the rest of the world like smart quotes, so be sure to create the code in NotePad, and check all the quote marks or apostrophes to be sure that they look like the ones I have in the picture :-) Click on the picture and it will open larger so you can see it clearly.

Now we are going to add them to your template code. Click the Design Tab, then the Edit HTML link. It will open up the box of code for your template.

Now right here I must stop you and say, before messing with your template... "BACKUP A COPY" of your template to your computer. Right click on the code box and "select all", then open a NotePad doc (NOT Word.doc) and paste the template into NotePad and save it on your computer where you can find it in case you have a catastrophic failure of your brain connecting with your fingers on the keyboard :-).

Okay...now that we have that out of the way...use Ctrl-F to open a Find box at the bottom of your screen like in the picture to the right. You are going to type </head> into the find box and click "next". It will light up the word just like it does in the image, Then you are going paste in the code you just created.

Now...another important point...Click the PREVIEW button to see the change. If the preview shows the Share buttons at the bottom of the post, then close the preview and click Save Template. As long as it gives you a preview of your blog the favicon will show up in a while if it doesn't immediately. So close the Preview and click Save Template!

If the preview does not open...or the buttons are not there when the preview does open...click DISCARD Edits.

And start again. If you get stuck...email me.

Sig

66 Comments:

  1. maydavid said...
    This image pixel is so good .
    Sewa Bus Jogja said...
    Thanks for sharing
    Sewa Bus Jogja said...
    The information is very complete. Thank you very much.
    Sewa Bus Jogja said...
    Thanks for sharing
    Sewa Bus Jogja said...
    The information is very complete. Thank you very much.
    Sewa Bus Jogja said...
    Thanks for sharing
    Sewa Bus Jogja said...
    The information is very complete. Thank you very much.
    Sewa Bus Jogja said...
    Thanks for sharing
    Sewa Bus Jogja said...
    The information is very complete. Thank you very much.
    Sewa Bus Jogja said...
    Thanks for sharing
    Paket Wisata Murah Jogja said...
    Thank you for your information
    Paket Wisata Di Jogja said...
    Thank you for your information
    Paket Tour Jogja said...
    Thank you for your information
    Paket Tour Jogja Murah said...
    Thank you for your information
    Paket Tour Yogyakarta said...
    Thank you for your information
    Paket Wisata said...
    Thank you for your information
    Rental Hiace Jogja said...
    Thanks for sharing
    Hiace Jogja said...
    Thanks for sharing
    Sewa Hiace Di Jogja said...
    Thanks for sharing
    Sewa Hiace Jogja said...
    Thanks for sharing
    Sewa Hiace Solo said...
    Thanks for sharing
    Hiace Jogja said...
    Thanks for sharing
    Sewa Hiace said...
    Thanks for sharing
    Sewa Hiace Klaten said...
    Thanks for sharing
    Sewa Hiace Solo said...
    Thanks for sharing
    عبده العمراوى said...
    Sewa Bus Jogja said...
    Nice article
    Sewa Bus Jogja Murah said...
    Nice article
    Sewa Bus Pariwisata Jogja said...
    Nice article
    Sewa Bus Klaten said...
    Nice article
    Rental Bus Jogja said...
    Nice article
    Sewa Bus Non AC Jogja said...
    Nice article
    Sewa Bus Di Jogja said...
    Nice article
    Sewa Bus Jogja said...
    Nice article
    Bus Pariwisata Jogja said...
    Nice article
    Sewa Bus Pariwisata Jogja said...
    Nice article
    Sewa Hiace Jogja said...
    The information is very complete. Thank you very much.
    Sewa Hiace Magelang said...
    The information is very complete. Thank you very much.
    Sewa Hiace Klaten said...
    The information is very complete. Thank you very much.
    Sewa Hiace Solo said...
    The information is very complete. Thank you very much.
    Rental Hiace Jogja said...
    The information is very complete. Thank you very much.
    Sewa Hiace Jogja Murah said...
    The information is very complete. Thank you very much.
    Sewa Hiace Jogja said...
    The information is very complete. Thank you very much.
    Hiace Jogja said...
    The information is very complete. Thank you very much.
    Sewa Hiace said...
    The information is very complete. Thank you very much.
    Sewa Hiace Jogja said...
    The information is very complete. Thank you very much.
    Sewa Hiace Magelang said...
    The information is very complete. Thank you very much.
    Sewa Hiace Klaten said...
    The information is very complete. Thank you very much.
    Sewa Hiace Solo said...
    The information is very complete. Thank you very much.
    Rental Hiace Jogja said...
    The information is very complete. Thank you very much.
    Sewa Hiace said...
    The information is very complete. Thank you very much.
    Rental Mobil Di Jogja said...
    Nice tutorial
    Sewa Mobil Jogja said...
    Nice tutorial
    Sewa Mobil Di Jogja said...
    Nice tutorial
    Rental Hiace Jogja said...
    Nice tutorial
    Rental Mobil Di Jogja said...
    Nice tutorial
    Sewa Elf Klaten said...
    Nice tutorial
    Sewa Mobil Di Jogja said...
    Nice tutorial
    Rental Mobil Di Jogja said...
    Nice tutorial
    Sewa Mobil Murah Di Jogja said...
    Nice tutorial
    Sewa Mobil Di Jogja said...
    Nice tutorial
    Rental Mobil Di Jogja said...
    Nice tutorial
    Sewa Mobil Murah Di Jogja said...
    Nice tutorial
    Sewa Elf Klaten said...
    Nice tutorial
    new india by sara said...
    New India’ is quite interesting as it generates a new hope among the people. India is transforming, powered by the strength of each and every citizen of india.
    Gaurav said...
    Hi there, I discovered your blog by way of Google whilst looking for a similar matter, your website got here up, it seems good. I have bookmarked it in my google bookmarks.
    Eassy Writing Examples
    Effective Studying Habits

Post a Comment