CodeCharge Studio

Command Area

The title bar contains the name of the application (i.e., CodeCharge Studio) and the open project. The right end of the title bar contains buttons to minimize, maximize, or close the application window.

The menu bar features seven drop-down menus (i.e., File, Edit, Project, View, Table, Tools and Help). These menus contain a series of options for various functions. Notice that the main menu names and some of the sub-menus have an underlined letter. This is indication that that menu can be executed using a short-cut key combination by pressing the Ctrl key together with the underlined letter.

Menu Bar and Title Bar

The toolbar provides quick access to many of the frequently used commands that are available in the menu bar. If you are concerned about screen space you can use the View menu in the menu bar to hide some or all of the toolbars. Each of the toolbars can be dragged and docked on the top, left or right sides of the application window.

You can also drag the toolbars away from the sides of the application window and in so doing create a floating toolbar.

Toolbar

Standard Dialog Functions

Command	Description	Short-cut
	Create a new Page	Ctrl + N
	Open an existing Page	Ctrl + O
	Save the current page	Ctrl + S
	Save all changes made in multiple documents
	Undo the last action	Ctrl + Z
	Redo the last action that was undone	Ctrl + Shift + Z
	Cut the current selection and place it in the clipboard	Ctrl + X
	Copy the current selection to the clipboard	Ctrl + C
	Paste the current contents of the clipboard	Ctrl + P
	Open the Project Settings window
	Publish the project	F9
	Publish the current page	F8
	View page in the Live Data mode	F10
	Select the server for the project
	View the Project Explorer window
	View the Properties window
	View the Toolbox
	View the Message window
	Show borders
	Reveal paragraph and new-line tags	Ctrl + /

Table Functions

Command	Description
	Open the Insert Table window
	Insert a row above the current row
	Insert a column before the current column
	Delete the current row
	Delete the current column
	Move Column Left
	Move Column Right

Formatting Functions

Command	Description
	Select a format for the currently selected text
	Select a font
	Select a font size
	Convert the selected text to bold typeface
	Convert the selected text to italics typeface
	Underline the selected text
	Insert line numbers
	Insert bullets
	Decrease indentation
	Increase indentation
	Left align
	Center align
	Right align
	Select a font color for the current text
	Select a background color for the current font

Positioning and Alignment Functions

Command	Description
	Align the position of the control to the closest grid line
	Assign the current control an absolute rather than relative position
	Fix the position of an absolutely positioned control

Web Functions

Command	Description
	Navigate backwards
	Navigate forwards
	Stop the current operation
	Refresh the current page
	The URL of the current page
	Go to the URL specified in the URL field

Insert a Table Dialog

The Insert Table dialog accepts the parameters required to generate a table within an HTML document.

The parameters accepted are listed below:

Parameter Description

Rows Number of rows for the new table.

Columns Number of columns for the new table.

Alignment Alignment for the table [Default, Left, Center, Right].

Border Size Width of the table borders.

Cell Padding Amount of space between the border of the cell and its contents.

Cell Spacing Amount of space between adjacent cells.

Width Width of the table in pixels or as a percentage of the available space.

Parameter	Description
Rows	Number of rows for the new table.
Columns	Number of columns for the new table.
Alignment	Alignment for the table [Default, Left, Center, Right].
Border Size	Width of the table borders.
Cell Padding	Amount of space between the border of the cell and its contents.
Cell Spacing	Amount of space between adjacent cells.
Width	Width of the table in pixels or as a percentage of the available space.

Customize Toolbars

Using the Tools | Customize Toolbar... menu option, you can configure the appearance of the various toolbars and add new toolbars. The options include:

Show Tooltips Informative Tooltips appear when the mouse hovers over an option in the toolbar.

New... Adds a new toolbar that you can add buttons to using the Command tab.

Delete Delete a toolbar you created yourself. The six default toolbars cannot be deleted.

Reset The Reset button appears in place of the Delete button mentioned above when one of the six default toolbars is selected. The Reset button has the effect of returning the toolbars to their factory appearance after they have been customized to look differently.

Toolbar name Alter the name of an added toolbar.

Show Tooltips	Informative Tooltips appear when the mouse hovers over an option in the toolbar.
New...	Adds a new toolbar that you can add buttons to using the Command tab.
Delete	Delete a toolbar you created yourself. The six default toolbars cannot be deleted.
Reset	The Reset button appears in place of the Delete button mentioned above when one of the six default toolbars is selected. The Reset button has the effect of returning the toolbars to their factory appearance after they have been customized to look differently.
Toolbar name	Alter the name of an added toolbar.

Under the Command tab you can:

View the various options available in a particular toolbar and see the tooltip text associated with the option.
Add commands to a new or existing toolbar. To add a command to a toolbar, click and hold drown the mouse button as you drag the command icon to the location where you want it to appear on the toolbar. Note that you can also remove command icons from a toolbar by clicking and dragging the icon away from the toolbar.