HTML Editor

Getting Started

The HTML editor included in Gold-Vision Connect offers WYSIWYG design of HTML content. It is comprehensive in it's functionality whilst relatively simple to use. Text, images and visual content can be inserted, drag-and-droped, copy-and-pasted, formatted and styled all using the in-built toolbar controls. Most common Windows keyboard shortcuts also work (ctrl+c, ctrl+v, ctrl+x, ctrl+z etc). We use a 3rd party HTML editor, please click here to see the User Guide for more information.

The Editor at a Glance

The editor is split into three main areas.

  1. The toolbar is situated at the top of the screen and contains most of the controls. This can be used to control the format and style of your document as well as insert images and links.
  2. The Source icon is where you can switch between Design and HTML views of the document.
  3. In the center of the screen is a large window containing the page content. This is where you can paste, type or insert the actual content of the document. Use the mouse or cursor keys to position the cursor and start typing. Alternatively highlight some text and use the toolbar controls to change the style or format.

We use a 3rd party HTML editor, please click here to see the User Guide for more information.

Entering Text 

Text can be entered directly into the editor. Simply position the cursor where you would like to enter some text and start typing.

Text can also be copied and pasted from other text sources such as Microsoft Word, Notepad or similar. When text is copied from a source like Word, the editor attempts to maintain all style (bold, color etc) already applied to the text when you copied it.

Simple Formatting 

We use a 3rd party HTML editor, please click here to see the User Guide for more information.

Choosing a Font

Fonts and font size can be modified by using the appropriate dropdrops from the tool. Simply position the cursor into the text you would like to change or highlight some text and select a new font or size.

  1. Position the cursor inside some text or highlight it
  2. From the Font dropdown select a font
  3. From the Size dropdown select the requrired size

Font Style and Color

Format and style changes can be made using the toolbar controls at the top of the screen. The typical way to do this is to move the cursor to the text location or highlight some text and then use one of the toolbar controls to modify the style. In the example below, we look at making some text bold and red.

  1. Move the cursor to the location you would like to change the format for or highlight some text
  2. Click the Bold toolbar button () to make the text bold
  3. Next click the arrow next to the Font Color control () and select Red

 

Text Justification

Text can be justified left, right, center or justified. This is performed by selecting a paragraph of text and choosing one of the justification options. In the example below we look at making a paragraph of text aligned to the center.

  1. Click or move the cursor into roughly the middle on a paragraph or line of text
  2. From the toolbar choose the center justification option ()
  3. The text will allign to the center of it's containing element

Inserting Images 

We use a 3rd party HTML editor, please click here to see the User Guide for more information.

Images can be opload to Gold-Vision Connect via the Image Library and inserted using the HTML editor. To insert an image, please follow the instructions below.

  1. Click the Insert Image button () from the toolbar.
  2. An Add Image window will open
  3. Select an Image from the list by clicking on it. To upload a new image, click the Upload New button.
  4. Click the Add Selected button
  5. The image will be inserted into the editor window

Moving and Resizing Images

Once the image has been inserted it can be moved by using drag-and-drop or resized by dragging the size boxes.

Viewing the HTML

Click the Source icon to view the HTML

Creating and Editing Tables

 

Select Table from the Editor toolbar and select the number of rows and columns, width etc as required.

 

Once the table has been inserted the cells, rows or table can be formatted.

 

Right clicking in a cell activates the following options:

 

 

 

Inserting Rows or Columns

Select Row or Column, right click and select form the options:

 

 

Changing the Width of a column

Click on the border and drag to the required size

 

 

To change the style of the table eg: Text, Backbround or Border select the Edit Style icon

 

 

Text Options

 

 

 

Selectable Options

1.       Selection – The element you currently have selected (default) eg Text
2.       Table Cell – The first table cell the current selection is contained within (only appears if in a table)
3.       Outer Table – The table the current selection is contained within (only appears if in a table)
4.       All Cells in Table – All the cells in the current table (same as 2 but for all cells)

 

Background Options

 

 

 

Border Options

 

 

Margin Options

 

We use a 3rd party HTML editor, please click here to see the User Guide for more information.

Saving Changes 

It is important to save your changes before navigating away from the editor page. To do this click the Save button () from the toolbar.