My Programming Tricks

Caveman Blogger

Favorite Icon (favicon.ico) can help boost the professional look of your website.

But somehow different browsers support it differently. Here are the codes I use for maximum compatibility:


<head>
<link rel="icon" href="/favicon48.ico" type="image/ico"> <!-- for Mozilla based browsers --> 
<meta name="msapplication-task" content="name=YOUR_ICON_NAME;action-uri=./favicon32.ico"> <!-- for IE9  --> 
<link rel="SHORTCUT ICON" href="./favicon32.ico" type="image/x-icon"> <!-- for IE8  --> 
</head>

Besides you also need to place a 16x16 small icon named favicon.ico in the root path of your server to be compatible with IE5/6.

Size? I would say make each of those sizes: 16x16, 24x24, 32x32, 48x48, ... just in case future IEs can use them.

What software to make them? I use Photoshop with plugin to export .ico file.

Caveman Blogger

Update on 18/12/2014: The latest version has been updated here.

This could be something a lots of new web developers wanted to know as Facebook is gaining substantial popularity each day.

If one can share its web content to Facebook, it could mean a big help to the marketing of the website.

The link you need to put the Facebook link (<fb-share>) to your website or blog:


<HEAD>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>

<meta property="og:title" content="Your Title" />
<meta property="og:type" content="website" />
<meta property="og:image" content="Your Thumbnail Image Link" />
<meta property="og:url" content="Your URL" />
<meta name="description" content="Your Description" />

<HEAD>


<a name="fb_share" type="button_count" href="http://www.facebook.com/sharer.php">Share</a>

You can also configure the font for the "Share" text.

IMPORTANT Note: If you make a mistake somewhere in your code, you need to go to Facebook URL Linter to refresh the fb-share information of your page. If not, it will be stuck at your first submission as it is cached in Facebook server for future use until you run this Linter. I also heard it will be rerun 24 hours later. I did not take this chance to wait for another 12 hours to do another round of debug. Going to this lint link should be the easiest way to debug your fb-share link:

http://developers.facebook.com/tools/lint

My Programming Tricks

Labels

Wednesday, May 25, 2011

My Best Way to Place favicon.ico for All Browsers Type

Sunday, May 22, 2011

How to Configure Facebook Share (fb-sahre) Thumbnail & Texts?