Return to Fast Start
This is a working tutorial. First make sure the Quick Properties Editor is open by pressing the icon on the left toolbar. If you want to view a finished example of this tutorial press the "Finished Example" text link above.

1. Add a picture.

Press the Mona Lisa button to load a picture. Select the file vmlogo.gif from the /ClipArt directory.

2. Move the Picture.

Select the picture with your mouse and move it to the top left corner.

3. Add a link.

Right click on the vmlogo to Open the Object Editor. Select the link Dialog. Select http:// from the "Link Type" drop box. Type www.VirtualMechanics.com into the "Select or enter a URL" box. Select OK to exit the Object Editor.

4. Add Vector Graphics.

Select the Rectangle Button on the left toolbar to create a square. Move your mouse to x=100, y=90 press the left mouse button and drag the corner to x=700, y=110. When you are finished use use your mouse to adjust the corners and the keyboard arrows to nudge the rectangle into place if necessary.

5. Add Shading.

With the Rectangle still selected, select the Shading dialog (Shd tab) on the Quick Editor.

Select the "Cylinder" button at the bottom of the Shading dialog and the "Color 1" button. Adjust the sliders to select Red=0, Green=125, Blue =0. Use your keyboard arrow keys to move the sliders 1 value at a time if necessary. Select the "Color 2" button and adjust the sliders to Red=200, Green=255, Blue=200. The rectangle should now look like a green cylinder.

6. Add  Text.

Select the Text button on the left toolbar to open the text editor. Add the following text being sure to add a valid URL:

"Please visit the www.VirtualMechanics.com web site to download a Web Editor."

Select OK to exit the Text editor. Move the Text Object so that it is below the Green Bar. Use your keyboard keys to nudge it into place.

7. Add a Title.

Select the Title button on the left toolbar. Add the following text:

"My Web Site"

Select OK to exit the editor. Move the Title Object above the bar. Use you mouse to adjust the size of the Title Box to approximately x1=150, y1=40, x2=400, y2=80.

8. Shade the Title.

With the Title still selected, select the Shading Dialog in the Quick Editor. Select the Radial button at the bottom of the Shading dialog and adjust the RGB sliders to assign the Title two colors of your own choosing.

9. Assign a Background color.

Open the Background dialog on the Page toolbar at the top of the work window. Use the RGB sliders to assign a background color to the page.

10. Add Meta Tags and a Title.

Open the Page Editor. Select the Title Dialog. Enter a Title and Page Description. Enter a list of Keywords separated by commas to help the search engines find this page. Exit the Page Dialog.

11. Preview.

Select the single Greater-Than preview button ">" to the left of the Target Format box. You should now see the web page in your default Browser. Return to the editor by closing the Browser.

12. Cleanup.

Unwanted Objects such as the red arrows can be removed from this Page by Cutting them (Ctrl-X). The Delete Key is used to remove shared Objects from the entire project. Do not Delete an Object unless you know that it is not used on any other pages. The Clean operation in the Object Editor can be used to remove Objects that may have been Cut from every page.

13. Publishing your Project.

The Publisher can be opened from the Preview Toolbar to the left of the Preview ">" button. You can Publish to a local directory or FTP to your remote web site. A Gather option is included to transfer any referenced files such as pictures and multi-media. Follow the instructions in the publisher to set it up for the first time.

To the Left of the Publisher is the Object Code generate. Use this dialog to display all the code that will be created by this project. You can transfer the code to another editor if you wish using Copy and Paste.

14. Next.

Congratulations, you have now been familiarized with 5% of the features available in this program. Please review the other tutorials for more in-depth working examples. Detailed Help is also available from the Help menu and in many of the dialogs. If you need help with a specific problem please visit our on-line support forum.
< tutorials home
TM & © 1998 - 2003, Virtual Mechanics, Inc. All rights reserved.