Where to from here...?

Now that you have made your buttons with the QuickStart Wizard you may want to make some adjustments and add your buttons to a web-page. The following describes how to customize your buttons and upload them to your web-server.

Customising your menu

Whilst the QuickStart Wizard is incredibly fast at making your menu - it is somewhat limited in what you can achieve. The real flexibility comes from using the 1 Cool Button Tool application in which you can create far more interactive menus, navigation and even interactive ads.

The following will show you how to make some simple changes to your menu and get used to the way 1 Cool Button Tool works. We will cover the following:

  • Changing the background
    The QuickStart Wizard automatically selects a background that best suits the button you choose in the button gallery. You can, however, select any colour
  • or even an image for your menu background.
  • Changing button fonts
    You can change the font, font size, colour and position of the text on your buttons that were made in the QuickStart Wizard. Each button can have their own settings (you can even change the font settings on each button-state).

  • Changing button sounds
    Each button can have it own individual sound effects for each button state.
  • Adjusting the animation
    You can simply adjust the timing of the animation created in the QuickStart Wizard.
Changing the background

A simple thing to edit first is the background colour. Make sure you are on the general properties tab and click on the coloured square (just under our logo) and select a new colour. You will see the background behind the buttons change. Any colour can be select and you can use the hex numbers to match any web colours - you can also use an image which can be scaled, tiled or centred.

For more information see topic: General Properties: Background

Changing your buttons

All 1 Cool Button Tool buttons have three states:

  • Up State. How the button looks and behaves when it is in the "up " position.
  • Mouse-Over. How the button looks and behaves when the cursor is over the button.
  • Down State. How the button looks and behaves when it is pressed.

You can change any other following on each of the button states. For more information see topic: Button States

Changing button fonts

In many cases it is effective to have different font styles on each button state or even different font styles on different buttons. This is very simple to achieve, simply select the Button Properties tab, then the Button and Button State you want to change in the editor and make your change. You will see the immediate effect in the editor window.

For more information see topic: Button States: Font Settings

Changing button sounds

Rather than having the same sound effects for all of your buttons you can set each button individually. If you really want to go crazy you can set each button state with a different sound effect.

For more information see topic: Button States: Sound

Adjusting the animation

Animation is achieved through the use of Actions. They are the key to creating interesting navigation and menu systems such as expandable menus, animated navigation schemes and more interesting interactive applets and Flash files.

Basically an action just allows one button to control the appearance or position of other buttons (including itself). You can specify actions to be performed when a designated event occurs such as when a button is pressed or mouse-over occurs.

In the case of animations created by the QuickStart Wizard, animations are initiated on startup and are listed on the General Properties Tab (on the bottom right).

You have the following Action available: Show, Hide, Up, Over, Down, Wait, Call, Move, Size, Xform, SetText, RetoreText, Play, Fade (Flash only) and Rotate (Flash only).

Example:
Move sunflower: 100+, 50+, 100
will move the button named "sunflower" to a position 100 pixels to the right and 50 pixel down the screen. This will occur over 100 frames.

The simplest thing to try is to change the animation timing. The last number on each line indicates the number of frames that is used to create the effect. Making the number larger will slow the animation down, making it smaller will speed it up. Note: When you build a Flash menu you will note that the animation timing is slightly different to what is displayed in the

For more information see topic: Actions and Animation

Adding your buttons to a web-page

To add your menu to an existing web-page you will need to do two things.

1. Add 1CBT HTML to your page
The first thing you will need to decide is whether you want Flash or Java buttons. In either case click on the 'Build Flash' or 'Build Java' and click on the 'Copy HTML to clipboard'. Then, in your HTML editor, locate where you would like your buttons and paste the HTML code. Make sure you paste 'as HTML' and not as text.

2. Put Java or Flash 'build' files in the same folder as your page
1 Cool Button Tool creates a build folder and puts everything you need in the file. If you have made changes to your buttons make sure you Build the project again and then just copy the files in the Build folder to the same location as your HTML page.

For more information see topic: Build Applet and Build Flash

Other Resources

Guide Tour
(5-7 minutes)

In order for you to get a feel for 1CBT, we put together two Guided Tours which cover a basic overview of the main features and functions of 1CBT as well as explaining how to build your project, add it to another HTML file and upload it to your web server.

Introductory Tutorials
(8-10 minutes each)

The following tutorials walk you through the basics of using 1CBT. We recommend that you have a look through the Quick Introduction before proceeding with the tutorial.