Main
  Authors
Tutorials
  Basics
  Menu system
  Advanced functions

Basics of ~sightRipple

In this tutorial you will learn how to use the basics of ~sightRipple.

Starting ~sightRipple and creating the first page

First you fire up ~sightRipple by choosing the icon the installation created for it in the Start menu. When the program starts the first time you will be greeted with a Tip of the Day dialog. Click Close to dismiss the dialog and continue on to use ~sightRipple. If you have not yet done this and a project is already loaded, create a new project by choosing the New project in the New menu (click on the New button in the upper left corner of the main toolbar). Save this project to somewhere (prefferable a new folder) by choosing the Save button (3rd from the left on the main toolbar). Click the New button again and choose the "New file..." item. A dialog similar to the one bellow will appear.

Choose "Empty webpage" and when the Wizard shows up, choose the setting you want. The Wizard should be very straight-forward and self-explanatory, but I will for the sake of this tutorial set up some values for you to write in.

The first page is an introduction to the wizard. Just click next when you've read what it says.
Second page (step 1) is where you choose the doctype statement. For this document we simply choose The Standard HTML 4.0 (Transitional) statement. Click on it and choose next.
Third page (step 2) is where you define title, keywords and describtion. The first is the text that appears in the title bar of the web-browser when a user look at the page. Write "Sample page 1: Main Page" as title. The keywords and describtion are used by search engines to categorize your web-page. We aren't going to publish this page, so simply un-check the two boxes. Click next.
On the Fourth page (step 3) you define the page's color and background image. not implemented yet, will be soon... Click Finish to complete the wizard.

Now that the page has been created, you might want to save it to a file. Click the Save button and choose "Save current file" from the menu. Save the file as "index.htm" in the same folder where you put the project file (the project file is not visible in the save dialog). When you click Save you will be asked if you wish to add the file to the current project. Choose Yes. Now, save the project again (click Save|Save project)

You have created the framework for the first page in the Basics tutorial. Now to add some content to it.

Page content

On this first page we want to add a heading, a greeting message and a copyright message to tell the world this is your page and how to get in contact with you by your e-mail address. Erase the text "This is where the page content goes" and replace it with the following text:

<h1>Welcome to the Sample page 1</h1>
<p>This is the main page of the sight created by following the ~sightRipple Basic tutorial.</p>

<hr>
<div align="center"><small>This page is Copyright © 2000 by Your Name Here. To contact me for any reason write an e-mail to <a href="mailto:Your Email Here">Your Email Here</a></small><div>

Of course we want the copyright notice to appear on all the pages in the project. It is here that the HTMR functions of ~sightRipple come in handy:

Before the <hr> you write
After the </div> you write
Click on the  and choose "Learn HTMR snippet" from the menu
A message box appears and tells you that the snippet was learned and it also tells you exactly what it learned. Click OK
Look in the HTMR definitions list. An item named "footer" has appeared.
You will want to save the project now. Click Save|Save project

The first page is now completed, at least until we need to link up the pages which is not yet.

The Second page

under construction