Copyright: ® Preferred Customer


Help Contents
Contents

Introduction

Overview

System Requirements

Installing Hot Buttons

Starting Hot Buttons

Features of Hot Buttons

Buttons

Overview

To Select the Button's Style, Size, and Color

Saving the Button

Rules

Overview

To Select the Rule's Style, Size, and Color

Saving the Rule

Bullets

Overview

To Select the Bullet's Style, Size, and Color

Saving the Bullet

Headings

Overview

To Select the Heading's Style, Size, and Color

Saving the Heading

Images

Overview

To Choose Which Image to Work With

Saving Images in Files

Overview

Steps to Save Your Image for Use in a Web Page

Opening Previously Saved Files

MBI Files vs. GIF Files

Opening MBI Files

Customizing Colors in Color Boxes

Overview

Displaying the Colors Dialog

Technical Support

Before You Call Technical Support

Technical Support Policies

New Extended Hours

Technical Support Contact Information


Introduction - Overview
Overview

Jalapeño Hot Buttons allows you to create buttons, as well as banners, bullets, and rules for your Web page. In addition, it will allow you to import graphic images in a variety of formats and save them as transparent GIFs, the standard format for Internet images.

You can create navigational buttons for the links in your Web page. The button creator lets you quickly design buttons, and helps you keep the buttons on your page looking uniform. Hot Buttons automatically converts the button to a .GIF file before saving it.


System Requirements

Before you can install Hot Buttons, please make sure that your computer meets the following system requirements:

•	Windows 3.1 or later, or Windows 95

•	A 386/33 or better CPU

•	At least 4 megabytes of RAM (8 megabytes recommended for Windows 95)

•	At least 3 megabytes of hard disk space.


Installing Hot Buttons

To Install in Windows 3.1

To Install in Windows 95


To Install in Windows 3.1

1. 	With Windows running, insert the CD or Disk 1 into your CD-ROM or disk drive.

2. 	From the Program Manager, choose Run from the File menu.

3. 	In the Run dialog, type D:SETUP (if the CD or diskette is in a drive other than "D," then replace the "D" with the correct drive letter. For example A:SETUP).

4. 	Click OK.

5. 	Follow the on-screen instructions to finish installing Hot Buttons.


To Install in Windows 95

1. 	Insert the Hot Buttons CD into your CD-ROM drive.

2. 	Click the Windows 95 Start button and select Settings>Control Panel.

3. 	Double click on the Add/Remove Programs icon.

4. 	Click the Install button.

5. 	Follow the on-screen instructions to finish installing Hot Buttons.


Starting Hot Buttons

To open Hot Button, do one of the following:

•	In Windows 95, click the Start button, choose Programs, Jalapeño Software, and finally Hot Buttons.

•	In Windows 3.1, open the Jalapeño Software program group, and click Hot Buttons.

The program will then start.


Features of Hot Buttons

When the program starts, you will see the Buttons tab, which allows you to create custom navigational buttons for your Web page. To create rules, bullets, headings, or to convert an image to transparent .GIF format, click on the corresponding tab at the top of the window.


Buttons - Overview
Overview

The Buttons tab gives you all the options you need to create great looking, customized, navigational buttons for your Web page. These buttons will allow you create good looking links to anywhere on your Web site, or anywhere else on the Internet's World Wide Web.


To Select the Button's Style, Size, and Color

Button Style

Button Size

Button Color

Button Text and Fonts

Button Pictures

Changing the Pictures that Appear in the Image Box

Modifying the Selected Picture


Button Style

Select the type of button you want to create by clicking on one of the Style selections:

The button style is displayed in the preview.


Button Size

Adjust the height and width of the button by editing the boxes in the Size box, or by clicking on the arrow buttons.

The button's dimensions are measured in pixels.


Button Color

Click on a Color box to select the button's color.

See the section Overview Overview for more information about using colors.


Button Text and Fonts

Type the text you want on the button in the Text box.

The text is displayed in the preview. You may enter as many lines of text as can fit on your button by pressing ENTER at the end of lines. If you add many lines of text, you may need to make the button taller by changing the size of the button in the Size box.

Click on the Position arrow buttons to move the text left and right on the button.

Click the Font button.

The Font dialog opens.

Select the font you want from the Font list.

A preview of your selection is displayed in the Sample box.

Select the color, underline, or strike-out effects from the Effects box.

Click OK to return to the main Hot Buttons tab.


Button Pictures

The images available to be placed on your button are displayed in the Image preview window. Select a picture from the Image box by clicking on it.

The selected picture is then placed on the button.


Changing the Pictures that Appear in the Image Box

The Image box shows all the images in the default directory (which is the Hot Buttons directory.)

You can use any image you have on your hard drive or CD-ROM. Hot Buttons has images (in addition to those displayed) on the program CD-ROM.

If you want to change this directory, for example to browse images stored on a Clip-art CD-ROM, click the Browse button. The browse dialog opens allowing you to change the directory associated with the Image box:

After you browse to the directory which contains the images you are interested in, click the Open button, and these images will be displayed in the Image box.


Modifying the Selected Picture

Click on the Size buttons to adjust the picture to fit inside the button.

Click on the Position buttons to move the picture left or right, to avoid overlapping with any text you have entered.

To remove the image from the button, click the Clear button.


Saving the Button

To save your button, click Save at the bottom of the Buttons tab or choose File…Save As on the main menu. See the section Overview Overview for more information.


Rules - Overview
Overview

The Rules tab gives you all the options you need to create nifty separators for your Web pages which have more than one section. These rules will be much more visually appealing than the standardized rules, and you can make them match the buttons and bullet points on the rest of your Web page.


To Select the Rule's Style, Size, and Color

Rule Style

Rule Size

Rule Color


Rule Style

Select the type of rule you want to create from the Style selections:

The rule's style is displayed in the preview.


Rule Size

Adjust the height and width of the rule by editing the boxes in the Size box.

The rule's dimensions are measured in pixels.


Rule Color

Click on a Color box to select the rule's color.

See the section Overview Overview for more information about using colors.


Saving the Rule

To save your rule, click Save at the bottom of the Rules tab or choose File…Save As on the main menu. See the section Overview Overview for more information.


Bullets - Overview
Overview

Hot Buttons will also allow you to easily create bullets for your Web page. These will give the lists in your page a snappier look.

Click the Bullets tab to create a bullet.


To Select the Bullet's Style, Size, and Color

Bullet Style

Bullet Size

Bullet Color


Bullet Style

Select the type of bullet you want to create from the Style selections:

The bullet style is displayed in the preview.


Bullet Size

Adjust the overall size of the bullet by editing the boxes in the Size box.

The bullet's dimensions are measured in pixels. Because bullets should be symmetric, there are no separate controls for height and width.


Bullet Color

Click on a color box to select the bullet's color.

See the section Overview Overview for more information about using colors.


Saving the Bullet

To save your bullet, click Save at the bottom of the Bullets tab or choose File…Save As on the main menu. See the section Overview Overview for more information.


Headings - Overview
Overview

Headings allow you to put a fancy masthead, banner, or other display at the top of your Web page. Most professionally designed Web pages have some sort of graphical heading as a lead-in.

Hot Buttons' Headings tab allows you to use one text element and one image. For more complex headings, try Jalapeño's Hot Banners.


To Select the Heading's Style, Size, and Color

Heading Style

Heading Size

Heading Colors

Heading Text and Font

Heading Picture


Heading Style

Select the type of heading you want to create among the Style selections:

The heading's style is displayed in the preview.


Heading Size

Adjust the height and width of the heading by editing the boxes in the Size box.

The heading's dimensions are measured in pixels.


Heading Colors

Click on a Color box to select the heading's color.

If you want the background of your Web page to show through the heading, so that the text and graphic on the heading appear to "float" above the background, click on the Transparent checkbox. If the Transparent checkbox is clicked on, then the color selection will have no effect, since there will be no background color.

See the section Overview Overview for more information about using colors.


Heading Text and Font

Type the text you want on the heading in the Text box.

You may move the text on the heading left or right by clicking the Position buttons.

The text is displayed in the preview. You may enter as many lines of text as you wish by typing ENTER at the end of lines. If you add many lines of text, you may need to make the heading taller by changing the size of the button in the Size box.

Click the Font button.

The Font dialog opens.

Select the font you want from the Font list.

A preview of your selection is displayed in the Sample box.

Select the color, or other effects from the Effects box.

Click OK to return to the Headings tab.


Heading Picture

Select a picture from the Image box by clicking on it.

The selected picture is then placed on the heading.

Click on the Size buttons to adjust the picture to fit inside the heading.

Click on the Position buttons to move the picture left or right, or to avoid overlapping with any text you have entered.

To remove the image from the heading, click the Clear button.

See the section Changing the Pictures that Appear in the Image Box Changing the Pictures that Appear in the Image Box for more information about the Image Box gallery.


Saving the Heading

To save your Heading, click Save at the bottom of the Headings tab or choose File…Save As on the main menu. See the section Overview Overview for more information.


Images - Overview
Overview

The Images tab gives you the ability to convert your image from most image formats into transparent GIF format. This is the standard image format used on the Web.

In addition, you can adjust the "transparent area" around the graphic images so that you can control the margin area around the image when it is displayed in a Web browser. This is useful, because with no extra transparent area, most browsers will leave only a minimal amount of space between the image and any text in your Web page.


To Choose Which Image to Work With

Image Box

Changing the Images that Appear in the Image Box

Modifying Your Selected Image


Image Box

Select a picture from the Image box by clicking on it.

The selected picture is then displayed in the preview.


Changing the Images that Appear in the Image Box

The Image box shows all the images in the default directory (which is the Hot Buttons directory.) If you want to change this directory, for example to browse images stored on a Clip-art CD-ROM, click the Browse button. The browse dialog opens to allow you to change the directory associated with the Image box:

After you browse to the directory which contains the images you are interested in, click the Open button, and these images will be displayed in the Image box.


Modifying Your Selected Image

Click on the Size buttons to scale the size of your image as desired.

Click on the Position buttons to move the picture left or right within the transparent area (shown as a white background). If you plan to have the image on the left hand side of your Web page, and flow text to the right, you may want to position your image on the left edge of the transparent area.


Saving Images in Files - Overview
Overview

After you have your Button or other image looking the way you want it to, you need to save it. Take the following steps to save your image, and you will then be ready to import it into your favorite Web page editor program, such as HoTMetaL, MyInternetBusinessPage, Hot Dog, Pacifica Personal Web Page Designer, etc.


Steps to Save Your Image for Use in a Web Page

Choose Save from the File menu, or click on the Save button at the bottom of the Hot Buttons window.

The Save dialog opens.

Select the folder where you want to save your button file from the Save in pull-down list. You will need to remember this location so that you can find the file when you want to bring it into your Web editing program.

Enter the name you want to give your button file in the File name box.

Choose GIF files (*.gif) from the Save as type list box if you plan to use this image in a Web page.

Click Save.

You are now back in the main Hot Buttons window. You can create and save more buttons before exiting the program.

Click the Exit button in the top right corner of Hot Buttons to close it, or choose File…Exit from the menu.


MBI Files vs. GIF Files

An important thing to understand is that when Hot Buttons saves images, it really saves two files: The image itself, usually with a .GIF extension, and a file that Hot Buttons used to create that image, which has an extension of MBI.

When you want to edit an image you have saved before, you must load the MBI file, not the GIF file. You will then see the image, as you have last saved it.


Opening MBI Files

To open an image you have saved before, open the MBI file with the same root name as the GIF (or BMP) file you originally saved. For example, if you created a button and named it Button.GIF, and want to reopen it to edit it some more, take the following steps:

From the main menu, choose File…Open.

The Open dialog appears:

Select the MBI file with the same root name as the image you originally saved (in this case Button.MBI)

Click the Open button.

You will then see the image you originally saved. You may then edit and save it as before.


Customizing Colors in Color Boxes - Overview
Overview

When you are choosing a color, you are given eight choices. If none of these colors are what you want, you can replace any of the standard eight selections with any color.

The Color Box is available in the Buttons, Bullets, Headings and Rules tabs. Each tab has its own color box, so that a change in one will not effect the colors available in the other tabs.


Displaying the Colors Dialog

To replace a particular color, double click one of the colors that you don't want.

This will then show the Colors Dialog:

More:

Face Color

Drop Shadow

Sample

What the Numbers Mean


Face Color

This is the main color selection. It allows you to choose the color of the face of the button, bullet, rule or heading you are editing. This takes up the majority of the image's area.


Drop Shadow

This selection will have an effect on any image to which you have given a 3D style. It will have no effect on any image which you have given a rounded or flat style.


Sample

The sample shows what a button with the chosen color scheme will look like.


What the Numbers Mean

Each of the selections for Red, Green, and Blue indicate the relative intensity of that color. Each is allowed a value between zero and 255. A value of zero means that that color will not appear at all in the overall color, while 255 means that the maximum amount of that color will appear in the overall color.

You can get intermediate colors by combing more than one of the basic red, green, and blue. For example, you can get the following colors with these values:

	Red Value	Green Value	Blue Value
Bright White	255	255	255
Black	0	0	0
Brown	128	64	0
Bright Yellow	255	255	0
Hot Pink	255	0	128
Dark Gray	128	128	128
Light Gray	192	192	192
Maroon	192	64	64
Teal	64	192	64
Lime	64	255	64
Purple	128	0	128


Before You Call Technical Support

Before you call technical support, please look in the on-line help for answers you cannot find in this manual. The on-line help system may include last minute information not included in this manual.

If you can't find the answer to your questions in either the on-line help or the manual, you have the following support options:


Technical Support Policies

Technical support is free for the first call. A free second call is available if you have registered your product. After two calls, support is available for an additional cost. Two options are available:

(a) 	Annual Contract - For an annual fee of $49.00 for one product or $95.00 for two or more Jalapeño software products, members receive unlimited technical support, automatic revision updates, and notification of Jalapeño specials. Send a check or credit card number and the serial number of the product you would like to register.

(b) 	Pay Per Call -- $7.00 for a single call or $25.00 for a package of five calls. To receive technical support when you call, your credit card number and serial number (from the CD slip cover or installation diskette) are required.

Jalapeño Software's goal is to provide low-cost software solutions to home office and small business users. We have chosen not to include technical support costs in the price of our software, since doing so would penalize the majority of customers who do not use our services. We believe our policy has advantages over the Paid Support or Time-Limited support policies of other companies:

1. 	Free getting started assistance is available to users unfamiliar with our software.

2. 	Any additional software problems can be fixed without additional cost.

3. 	Customers may save calls until help is really needed, not just during a short time after purchase.

While we do not profit from your calls, charging for support helps offset the costs of expanding our support hours and staff in order to better serve customers who do need assistance.

For technical support, call us at our voice number, which is (970) 522-3804, or visit our Web page at: http://www.jalapenosoftware.com.


New Extended Hours

Hours are 6 AM to 5 PM Pacific time Monday through Friday, and Saturday 9 AM to 3 PM (holidays excluded). Before calling, please have your computer on, the program running, and your serial number available (it is located on the original disk label or on the CD case). Sorry, we cannot accept collect calls, or calls form other than registered owners.


Technical Support Contact Information

Call us at our voice number, which is (970) 522-3804, or visit our Web page at: http://www.jalapenosoftware.com.


Glossary of Terms

BMP

Drop Shadow

GIF

home page

HTML

hypertext

Internet

Jalapeño Software

link

MBI Files

Microsoft

pixel

tag

URL

Web

World Wide Web


BMP

Short for Bit Map, this is a standard Windows graphic format. It is the format used by Microsoft Paint and many other graphic image editing programs, but is not supported by most Web browsers.


Drop Shadow

The Drop Shadow is the raised 3-D part of the button or image you are creating with. You may change its color in the Colors dialog.


GIF

Short for Graphics Interchange Format, this is a file format commonly used with graphics or photos displayed in Web pages.


home page

This is usually the first screen a visitor sees when visiting a Web site. If you point a browser to a site without specifying a page name, the browser will open to the home page for that site. The file name for a home page is usually index.htm or index.html.


HTML

HyperText Markup Language, the set of commands used to format documents with standard elements so they can be displayed and read on the World Wide Web by different browsers on different computers.


hypertext

Text that is not constrained to a particular sequence. For example, links in Web pages allow you to jump to other sites that may interest you, without having to browse through other pages; another visitor to the site may read the pages in a different order. Web-based hypertext is not constrained to a single site or server.


Internet

The cooperatively run, globally distributed collection of computer networks that exchange information via the Internet protocol. The World Wide Web is part of the Internet.


Jalapeño Software

Small, cool Web software company in San Francisco, California.


link

A connection between one hypertext document and another. Links can also be used to jump to another area within the same document or to different types of URLs (such as FTP sites).


MBI Files

The file format used internally by Hot Buttons. When Hot Buttons saves an image file, it also saves a file with the same root name with an MBI extension. It is this MBI file that needs to be loaded to re-open and further edit the file.


Microsoft

Large computer software company in Redmond, Washington.


pixel

The basic unit of a computer graphic image. Each 'dot' that makes up the image is one pixel. Typical computer screens are 640 or 800 pixels wide by 480 or 600 pixels high.


tag

In HTML, the codes used to define different parts (text elements, lists, e.g.) or different styles (bold, centered) in the HTML file.


URL

The Uniform Resource Locator. Basically, this is an address for a Web site. It is made up of four parts: the protocol (usually this is http://), the server or "host" name (such as www.jalapenosoftware.com/), the directory path (such as mysite/), and the file name (such as index.htm/). If the file name is omitted, browsers will generally open the home page of the site.


Web

Short term for the Internet's World Wide Web.


World Wide Web

Also known simply as "the Web" or "WWW," it is a subset of the Internet. Its main function is the storage of hypertext and graphical information. This information can be accessed using Web browsers, such as Netscape Navigator or Microsoft Internet Explorer.


Hot Buttons starts in button view when first started. Click on one of the other tabs to create rules, bullets, headings, or to convert images to transparent GIFs.


The dimensions of a button or other image must be between 5 and 500 pixels.


In Windows version 3.1, the directory browse dialog will appear differently.


The rules that Hot Buttons generates, as with all of Hot Buttons output, are actually graphic images in the GIF format. This will result in a better appearance than rules offered by standard Web browsers. Browsers will display plain rules using HTML tags, such as <HR SIZE = "2" WIDTH = "100%" ALIGN = "LEFT">


If you need to create a bullet with height different from its width, or need to add text or graphics, you can use the Buttons tab to create such a bullet.


For more elaborate headings, try Jalapeño Software's Hot Banners product, available where you purchased Hot Buttons.


Make your heading font big and bold. Unlike fonts that may appear on buttons, you should have lots of room to make a statement on your Web page headings!


In Windows version 3.1, the directory browse dialog will appear differently.


The Save dialog will look differently in Windows version 3.1.


Alternatively, you may save your file as a Windows bitmap by choosing BMP files (*.bmp) from the Save as type list box, if you want to edit the image in another editing program, such as Microsoft Paint. You may then load this image back into Hot Buttons and use the Images tab to convert it to a transparent GIF.


When you load a file in Hot Button, you load a file with an MBI extension, not the file with the GIF extension that was originally saved.


The Open dialog will appear differently in Windows version 3.1.