BACK
This is a little tutorial on the editor functions. Just hit the "EDIT THIS PAGE" at the bottom right corner any time to try it out. Revert changes by reloading the page.
an image

You can create text and image elements by clicking on the "T" and "Image" icons.

Text elements are currently edited in the right menu. You can place normal text or HTML markup there. Try putting the embed code of a youtube video.

When clicking on an object you select it. Handles for resizing and rotating appear. Also the right menu with more object properties opens.

Hit the "MESS UP THIS PAGE" button on the bottom to see the editor in action. It's a non saving demo mode.

textedit.png

Elements are formatted using CSS styles. Select an object and find the style menu on the right.

To set the color enter "color: green" into the textbox of "This Element".

Yo can create a new style class in the upper textfield. This style class can then be selected and styles can be added. This style class can then be reused for other elements on the page.

At the bottom you may find style classes which are not attached to the current element. Attach them by clicking on the up-triangle.

style.pngx.pngviews.png

To move to different parts of your page you need to create views. Select the eye symbol from the left menu and create a new view. You will see a new teal frame.

Select the frame of the newly created view to move and resize the view as needed.

viewframe_t.png
this is a sample view

You can make every element a link.

Choose the "Link" tab on the right and either select one of the views as target, or enter a url.

When a view is chosen, the visitor will smoothly transition from the current position to the specified view when she/he presses the link.

linkto.png
MESS UP THIS PAGE