Ask the Web Pro 10-Minute Solutions

Enable Users to Set Home Pages with a Single Click
By Charles C. Caison

Works in: Internet Explorer 5

Have you ever wanted users to return to your site? Of course you have—we all want site "stickiness". We want our users to find our site valuable, and we want them to return to our sites often.

You can encourage users to return to your site often be making it easy for them to make your site their browser home page. If you do so, your site will be the first one they see every time they open their browser.

Microsoft Internet Explorer 5 provides functionality to make it easy for your users to set their home page with just a click. The secret to making this happen is in the following line of code:


this.setHomePage("XXXXXXXX.htm")

The setHomePage method accepts a path and/or a page name to make the appropriate change to their browser. IE will display a conformation dialog box to ensure that the user really wants to do this. If the user selects "Yes" from the confirmation box, the change is made and their new home page is set. If the user selects "No", the change is not made.

There are a couple of things to remember when using this method. First of all, since this is an IE5-specific method, you'll want to check the UserAgent before allowing the user to attempt to execute the method. You can use the following line of code for that:


if(navigator.userAgent.indexOf("IE 5")>-1 && 
navigator.platform.indexOf("Win16") == -1) 
{
// It's the correct browser...proceed
}

;Second, you'll want to hide the "Set Home Page" option if the browser does not support that functionality. A simple way is to create a hyperlink "placeholder" in the following way


<a href="" id=makehome></a>   /* Initially, not visible */
Then, alter it if the correct browser is being used. We might use the following lines of code for that

newlink = "<a href=setAsDefault2.htm onClick=\"this.style.behavior=
'url(#default#homepage)';"
newlink += "this.setHomePage(new_homepage);\">Set your new home page</a>"
makehome.outerHTML = newlink;

In all, this is a rather easy way to add a bit of convenience and stickiness to your site. It is easy to implement and adds a bit of professionalism to your site.

To see an example in action, go here. You can find the source code for this example here.

 
Other 10-Minute Solutions
 Write Text Files to a Drive on a Web Server
 Create Clickable Image Hotspots
 Programmatically Convert Excel Spreadsheets to HTML
 Detecting Browser Type and Client Settings
 Create a Cool Color-Changing Rollover Effect
 Launch a Window From a Listbox Using JavaScript
 Add User-Interface Elements to Your Web Pages
 Provide Online Help Using Layers in Netscape
 Build an HTML-Based Color Picker
 Manipulate Browser Windows Using JavaScript
 Control Scriptlets With JavaScript
 Extract Data From a Web Site
 Create Lightning-Fast Tabbed Windows in IE
 Add Context-Sensitive Help to Your IE Applications
 Add Dramatic Transition Effects to Your Web Pages
 Create Cross-Browser Scrolling Hyperlinks
 Enable Users to Set Home Pages with a Single Click
 A Painless Introduction to the Wonderful World of XML


Ask the Web Pro | Who is the Pro? | Usage Policies | Search | Feedback


Sponsored Links


Advertising Info  |   Member Services  |   Contact Us  |   Help  |   Feedback  |   Site Map
Jupiterweb networks

internet.comearthweb.comDevx.comClickZ

Search Jupiterweb:

Jupitermedia Corporation has four divisions:
JupiterWeb, JupiterResearch, JupiterEvents, and JupiterImages

Copyright 2004 Jupitermedia Corporation All Rights Reserved.
Legal Notices, Licensing, Reprints, & Permissions, Privacy Policy.

Jupitermedia Corporate Info | Newsletters | Tech Jobs | E-mail Offers