New Editor (SPv3) Tutorial

New WYSIWYG Editor released

Please report bugs and make suggestions about the new editor here: New SPv3 Editor Feedback & Bug Reports
Starting today (Friday, February 8th, 2013) a new editor will be in place as the default editor for creating and editing pages. It is a What You See Is What You Get (WYSIWYG) editor. We're hoping that this is going to be a huge improvement for everyone, especially for those users with limited knowledge of HTML.

A few highlights of the new editor are listed below.

Images

  1. The ability to upload images to SummitPost and automatically insert them in the page while creating or editing.  Any image uploaded with the new editor will be inserted into the SP database with a name of "Unnamed Image" and no caption.  A name and caption should be added by visiting the image page later.  The ability to specify a name and caption while uploading an image during page creation/editing has been added to the new editor.  However latitude, longitude and Image Type(s) will still need to be updated later by editing the image.
  2. The ability to insert images already on SummitPost (same functionality as before) and resize them, change the caption and title, and align them left, right or center.
  3. All images are displayed directly in the editor as they will be displayed when the page is viewed after being saved.
  4. To resize images to any size, simply left click and HOLD and drag the mouse diagonally.
  5. To resize images to a specified size, left click and RELEASE any image and a menu will appear allowing you to change the properties of the image, including the width.

Tables

  1. Tables can be created at any specified dimension with the click of a button.
  2. Rows and columns can be added or deleted with the click of a button.
  3. Alignment, width and background color can be changed with the click of a button.
  4. To perform any action to a particular table, simply ensure that your cursor is within the table to which you wish to perform the action.

Text Manipulation

  1. The ability to create lists, either ordered (numbered) or unordered (bulleted).
  2. Bold, italics, underline and strikethrough (deleted) text can all be achieved by a simple click of the appropriate button.
  3. Indenting, outdenting and alignment of text are all also available with simple button clicks.
  4. Font color and font background color are also easily achieved with button clicks.

Other things worth mentioning

  1. Inserting headers can be achieved by clicking the button indicated with the paragraph symbol.
  2. Inserting videos is achieved with a simple button click.
  3. Inserting links is achieved with a simple button click.
  4. Inserting hr tags (horizontal rule for thematic breaks) is achieved with a simple button click.

Potential Issues

Please be aware that there may be some incompatibility issues with the new editor for pages already in the system.  Some of these may be addressed and fixed, but some may have to remain.  Before saving any previously existing page when using the new editor, be sure to check and make sure that nothing in the page appears different than intended.

The old editor will remain in place as an option for use with incompatible pages and for those users who prefer the old editor.


Screencasts

A few screencasts were made to demonstrate the new editor in action.  It is highly recommended to watch these before using the editor.

NOTE: There is no audio for any of the below videos and they are all best viewed in HD by hitting the button next to the speaker button.

SPv3 Editor Screencast #1

Link to screencast #1: http://www.screenr.com/Ay47


SPv3 Editor Screencast #2

Link to screencast #2: http://www.screenr.com/Ey47


SPv3 Editor Screencast #3 (short)

Link to screencast #3: http://www.screenr.com/ay47