Project Management

Extend Microsoft FrontPage 2002

Many of the add-ons that Microsoft lists for FrontPage aren't updated for version 2002. Check out this list of add-ons, and learn how to use them.

By Kim Wimpsett
(7/10/01)

If you use Microsoft FrontPage, you know that this Web editor automates many development tasks. At its most basic, you can format text in the Normal view by using standard Office toolbar buttons, and FrontPage adds the appropriate HTML code that corresponds to your keystrokes. But it goes much further than that. FrontPage helps you add interactivity to your pages without knowing any scripting languages. For instance, you can apply a mouseover effect to text by merely selecting it, choosing Format › Dynamic HTML Effects, then specifying the settings.

These types of features are what make FrontPage and other WYSIWYG Web editors so helpful to those who code all day long. But what if you want to add a dynamic effect that FrontPage doesn't include? What if you want to insert some functionality that isn't in FrontPage's Web Components list?

In that case, you can probably find a third-party product that extends the capabilities of FrontPage. These add-ons (or add-ins, as Microsoft calls them) are especially useful if you repeat a certain development task over and over again. The installation process varies, but most add-ons integrate right into FrontPage; in other words, once you install the third-party product, you can launch it from a FrontPage menu item, and it operates completely within the familiar FrontPage environment.

Microsoft maintains a list of FrontPage add-ons; unfortunately, many of them have not been updated for version 2002. Instead of downloading these products only to find that they don't work in the newest version, we've found several others that will help you automate different tasks in FrontPage 2002. We'll show you how to use them and how to get the most out of their functionality.

Set your page margins

Page Margins 2002
Manufacturer: Jimco
Price: Free

FrontPage may make it easy for beginners to create entire Web sites, but it doesn't automate every pesky coding task. Page Margins 2002 is a FrontPage add-in that helps you apply page margins to your entire Web site all at once, using attributes of the <body> tag. The code applied is supported by both Netscape and Internet Explorer, so it's a nice way to add white space around the inside edge of the browser without having to resort to tables.

Once you install Page Margins 2002, a Jimco menu is automatically added to FrontPage. To use the tool, you must have a page open that is saved to a FrontPage site. Then, select Jimco › Page Margins 2002 to open the Page Margins dialog box, where you can fill in the Top Margin and Left Margin fields. The default option is to apply these settings to all of the pages in the current site. However, even if you choose Selected Pages, you won't see the site's pages listed in the Files area. To apply your margin settings to only certain pages in your site, you must first load the site. Choose the Selected Pages radio button, then click Edit Queue. The Web site will be loaded, and you can highlight the pages that you want to change. At this point, don't forget to click "Add selected to queue." Each selected file will appear in the Files In Queue area, as shown here:

 

Next, click OK. But you're not done yet. If you've already set your margins and your pages are listed in this dialog box, then click the OK button, as shown here:

 

If you've done this correctly, a message will tell you that your page margins were applied successfully. Click OK and open one of the pages. (Page Margins 2002 will close any pages that were open.) If you chose to add a top and a left margin of 5 pixels, you'll see that the following attributes have been added to your <body> tag:

<body topmargin="5" marginheight="5" leftmargin="5" marginwidth="5">

But here's the catch: Page Margins 2002 will take out these attributes if you run the add-on without specifying the margin settings. Therefore, be careful if you apply the top margin in a separate step from the left margin's. When you run it the second time, you'll want to make sure that both settings are listed, or you'll be undoing your previous work.

Add JavaScript without coding

J-Bots 2002
Manufacturer: Webs Unlimited
Price: $49.95 (J-Bots); $99.95 (J-Bots Plus)
Free demo

Many of FrontPage's own components allow you to add interactivity to your pages without knowing JavaScript. However, the Web editor ships with a limited number of components and dynamic effects. If you want to have a quiz on your page to test your users' knowledge but don't know how to create one, you're out of luck—unless you extend FrontPage's functionality by installing J-Bots 2002.

J-Bots adds 40 components to FrontPage, allowing you to add functionality to your pages, including everything from designing an interactive quiz to detecting a user's screen height, width, and color-depth settings. Once you download and install J-Bots, you'll see the J-Bots toolbar appear in FrontPage (once you restart). You can also access each component by choosing Insert › J-Bot Components. J-Bots Plus contains a total of 87 components. It includes J-Bots's 40 general components, as well as 47 others in the following categories: Cookie, Form, Image, and Navigation.

The General components include pop-up windows, scrolling text messages, and redirects based on the time or the day. The Cookie components include settings that let you track users and display pages based on cookie values. The Form components help you create and validate form fields. The Image components create certain functionality based on images on your pages, such as preloading images or creating slide shows. The Navigation components help you create menus, hyperlinks, and other types of navigation. The MenuWeaver component (which wasn't ready in the beta release that we reviewed) creates an entire hierarchical menu system with unlimited submenus.

Using J-Bots is pretty easy. To insert the current time into your Web page, for example, just position your cursor where you'd like the time to appear, then choose Insert › J-Bot Components › General › Current Date. In the subsequent dialog box, you must specify the format of how the time should appear. Enter %H:%M %P in the "Format of time displayed" field, as shown here, if you'd like the time to display in the format of 10:39 a.m., for example:

 

When you're satisfied with your formatting choices, click the Generate button. The current time will be inserted into your FrontPage document. If you switch to the HTML view, you'll see that the code inserted into your page is in the form of other FrontPage components:

<!—webbot bot="TIMEFORMAT" WIP="yes" startspan Preview="10:39 AM" s-timeformat="%H:%M %p" tag="p" b-twoplaces="1" clientside —>
   <script language="JavaScript"><!—TimeFormat('%H:%M %p',1);//—></script>
<!—webbot bot="TIMEFORMAT" endspan i-checksum="59134" —>

The code that J-Bots inserts works in Internet Explorer 3 and higher and Netscape 3 and higher. (Some components work in only one or the other; for instance, Netscape does not support the Add To Favorites component.)

Tweak your themes

FrontLook Theme Chameleon
Manufacturer: DPA Software
Price: $39.95 (bundled)
Purchase
Free demo

One of FrontPage's strengths is all of the predesigned themes that it ships with. You can apply a sitewide look and feel to your pages with just a few clicks of your mouse. But sometimes one of these themes just doesn't cut it. You may like the theme but wish that the background image was just a slightly different color. FrontLook Theme Chameleon lets you make changes such as this without even leaving FrontPage. And you don't even need to have an image editor or a design background to tweak the FrontPage themes.

Once you install Theme Chameleon, it integrates with FrontPage automatically. You launch the program by selecting the Format › Theme Chameleon menu item. However, if you want to edit a theme, you must first open a page that is saved in the current FrontPage site. (If you've just applied a new theme to the page, check whether an asterisk appears next to the filename on the page tab; if so, you must save the file before launching Theme Chameleon.)

When Theme Chameleon opens, you'll probably want to maximize the window so that you can see all of its options clearly. Otherwise, you'll miss out on some of the buttons at the bottom of the screen. Next, choose the theme that you want to tweak in the upper left theme drop-down list. You'll see a preview of the theme in the main area with all of its elements selected; the standard Willow theme is shown here:

 

At this point, you can use the slider bars to adjust the brightness, the saturation, and the hue of the theme. Have fun playing around with these; the Undo button is multilevel, and the Reset button lets you revert to the theme's original state if you get too carried away. For instance, the standard Willow theme has been tweaked quite a bit, as shown here:

 

Now, if you want to change only the background image of the entire theme, the easiest way to do this is to first load the theme into the Theme Chameleon. All of the theme's elements will be selected by default, so click Select None to deselect them all. Next, select the Global/Background-Image check box, which is usually at the bottom of the list. Any tweaks that you make will now affect only the background image of the theme. When you've finished, click Save As to give this theme a new name. (Many themes are read-only, so you'll be prompted to give it a new name even if you choose Save instead of Save As.) Check the Apply To Web check box to have your changes automatically take effect when you close the Theme Chameleon.

Edit images without an image editor

FrontLook Image Chameleon
Manufacturer: DPA Software
Price: $39.95 (bundled)
Purchase
Free demo

Do you find it a pain to have several programs open at once when you're working on your Web site? Want to make a quick tweak to a graphics file without launching your full-blown image editor? Programs such as Photoshop can take several minutes to launch, which can be irritating when you want to do only a few seconds of work. The FrontLook Image Chameleon lets you tweak your GIF and JPEG files without leaving FrontPage.

Once you install Image Chameleon, it integrates with FrontPage automatically. You can launch the program by either selecting the Format › Image Chameleon menu item or by clicking the Pictures/Image Chameleon toolbar button. Once the Image Chameleon dialog box launches, click Open to navigate to the image that you want to tweak. An easier way to do this, however, is to select the image in the page that you want to adjust, then select the Format › Image Chameleon menu item. The Image Chameleon dialog box will open, and this time the image will already be loaded for you to work on, as shown here:

 

At this point, use the slider bars to adjust the brightness, the saturation, and the hue of the image file. Feel free to play around with these because if you screw up, you can hit the Reset button to begin again; the preview image will revert to its original settings. The Quality Factor setting, which applies only to JPEG files, can range from 1 to 100. You may want to keep this setting at its default of 75 so that the quality of your image is not degraded any further when you save it.

When you're ready to save your image, always click Save As and enter a new filename. Then when you click Close, you can update your page to display this new image. If you click Save in the Image Chameleon, your page will be automatically updated when you return to FrontPage; however, your new file will overwrite your original image file. Make sure that you like your changes if you choose this option!

Insert metadata automatically

TagGen
Manufacturer: HiSoftware
Price: $99.99
Purchase
Free demo

The saying "If you build it, they will come" doesn't necessarily apply to Web sites. You must promote your site if you want any visitors, and the easiest (and cheapest!) way to do this is to submit it to the hundreds of search engines on the Web. But filling out all of the requisite metadata tags can be a time-consuming ordeal. TagGen helps you add this data automatically—without ever looking at the HTML code. The tool also gives you analysis reports on the content of your metadata and lets you manage all of your page's metadata from one central place. (TagGen 4.5 says it works with FrontPage 2000 and 98, but it also works with FrontPage 2002.)

You can launch the program by going to Start › Programs, but if you launch it from within FrontPage (Custom › Run TagGen), many of the settings are automatically filled in. The program is easy to use; just follow the three steps in the dialog box that opens. Fill out the options in Step 1, as shown here:

 

Fill out Step 2, then move on to Step 3. Click the Check Tags button at the bottom to display a critique of your tags, as shown here:

 

Now, go back and fix anything that you'd like. Once you're all set, click the Update button to automatically add the tags to your open document. Click over to the HTML View, and you'll see the code added. In this example, you'll see these were added:

<meta name="Microsoft Theme" content="blends 011">
<meta name="language" content="en-us">
<meta name="robots" content="ALL">
<meta name="rating" content="GENERAL">
<meta name="distribution" content="GLOBAL">
<meta name="classification" content="Tourism">
<meta name="copyright" content="Copyright Kim 2001">
<meta name="author" content="Kim">

Unfortunately, TagGen doesn't automatically save this page after adding the tags, so save each time you update your pages. (Just check whether there's an asterisk next to the filename on the page tab to see whether you need to save the file.) This is a nice way to add metadata to your pages automatically, but the best part of TagGen is that you can automatically apply the metadata to all of the files in a FrontPage site.

Once you've completed the steps, click the Batch button and select each file that you want to add the metadata to. Click Update Files, then Update Complete. Although it's not documented as such, in FrontPage 2002, this batch feature opens the files that you selected, adds the tags, then closes the pages. Open any of the files to see your changes.

Sell products online for free

bCentral Commerce Manager Add-in
Manufacturer: Microsoft
Price: $12.95 per month or $99.95 per year
Purchase

Microsoft offers the bCentral Commerce Manager Add-In so that you can integrate your FrontPage site with its Commerce Manager service, which helps you sell your products online. You can also use Commerce Manager to sell your products in various Internet venues such as MSN Auctions and MSN Marketplace. You need to download and install the add-in (which is then accessible via Tools › E-commerce), then sign up for a bCentral account. But if you sign up now, you'll get three months free.

When you select Tools › E-commerce, your first step is to add products. (Make sure that you're connected to the Internet when you select this.) You'll be taken to a page where you must first select the category that the product should be associated with, as shown here:

 

Although this is a required step, you can more accurately specify the categories later, once you have all of your products entered. At this point, you may want to classify them into one main category of your business, such as Pottery & Ceramics, and choose the subcategories later. Once you've added all of your products, click Done. Now, you'd think that your products would automatically be listed; however, you must go to the Seller Console and activate each product so that it appears in the "My FrontPage-based Web site" list and is associated with a department. Only once you've done this can you add an e-commerce component to your existing site or create a new e-commerce site with the wizard that has been added to FrontPage.

SalesCart Pro
Manufacturer: ComCity
Price: $279.99
Free demo

If you'd rather buy a standalone product instead of paying a monthly fee at bCentral, you can try ComCity's SalesCart Pro, which also works with FrontPage 2002. It includes a FrontPage component and an order database, and a wizard walks you through setting up e-commerce for your FrontPage site.

Kim Wimpsett is a frequent contributor to CNET Builder.com.

Editor's Picks

Free Newsletters, In your Inbox