Editing with the Black Cap Design Web Editor is very conventional. It uses a WYSIWYG editor which has similar looks and function to MS Word. But there are a few items that are somewhat unique to this style of editing and are discussed in this section. All Web Editor editing commands are shown later in this document.
Important! Always make sure you have a copy of your web site backed up on your computer. Use free a FTP program like FileZilla to back up your changes after every editing session. That way, if you make a mistake you can't fix, you can always replace it with the backed up copy. For help installing and using FileZilla these 2 YouTube videos are a valuable resource:
How to Install and Use FileZilla FTP client
FTP Client Filezilla GuideInserting / Editing Text
Once you have logged in to the editor, simply click inside one of the editable boxes that appear and begin typing. You can add / edit / remove text using your keyboard.To begin a new paragraph simply press the 'enter' key on your keyboard.
To begin a new line (to force text to the next line without creating a new paragraph), hold down the 'shift' key and press 'enter'.
If you make a mistake, you can either click the 'undo' button (curly blue arrow), or simply logout without publishing your changes, and login again.
Unique Editor Features
Image Insertion/Uploading:
Pictures (images) may be uploaded and put into a web page very easily using the the Image Insert button.
To upload an image (jpg or gif only), select the Image Info tab and hit the "Browse" button, then navigate and select the file on your local computer or disk, and hit the "Upload" button.
If you are satisifed with the Preview, hit the "OK" button. You can use the other fields on the form to specify the height and width of the image, define a border, define the space around the image and where the image is aligned (left, right, top, bottom etc.) but you are not required to fill out these fields.
Preview Page:
When editing a Web page, you can click the "Preview Page" button to preview your changes before publishing (saving) your edits. This allows you to temporarily leave editing mode to view your edits before saving them.Publish Page:
When you "Publish Page" in the main Web Editor Bar you are publishing the file on the web and it will be immediately viewable on the web. If you exit the editing session without clicking the Save button, your changes will not be saved.Right Click:
There are a number of functions available to you (such as cut and paste) by clicking the right mouse button while the cursor is over text, an image, or a link.Source View:
The Source check boxallows the user to view and edit HTML directly. Unchecking the box returns the editor to WYSIWYG mode.
The following is a brief description of how to keep the basic "look-and-feel" of a web page intact across the web site.
Fonts Names, Sizes, Colours
In general, the fonts are "fixed" for the web site, so please do not change the font size, colour, or the font name. This is done so that they are consistent across the site. If you need to emphasize something, try italizing, or "bolding" it. Underlining is only recommended for links, not for emphasis on text.Note that headings use a different font size but this is handled differently.
Font Format
For all regular text the format should be set to "Normal". For titles use "Heading 3" or "Heading 4" (3 is larger).Pictures and Images
Pictures (jpg or gif) can be uploaded to the site but there are a few things to remember. If you plan on showing an image that will appear small you should first resize it before uploading it. Keeping the image size small keeps page loading time low for the folks reading your page. There are a variety of programs (such as Gimp or Photoshop) that allow you to resize images.Links
To create a link to another page on your site, another site on the Web, or an e-mail link, click the Insert/Edit Link button. On the Link Info tab, choose the kind of link (also known as a URL) you want. Then fill out the remaining fields (by entering an email address, a web address or an internal page anchor).
The Web Editor Toolbar looks much like any other WYSIWYG editor with a few additional features. Moving your cursor over the menu will provide a tool tip with the name of each button in the web editor.
Right Click Functions
Right clicking on objects in the WYSIWYG editor will give you a number of addtional options.
"Right Click" on table
Allows you to change the attributes of an individual table cell or to add/delete columns or rows. "Right Click" on image
Allow editing or deletion of a image "Right Click" on link
Allow editing or deletion of a link Top Navigation Bar
Use the Preview Page button to preview your changes before publishing (saving). Use the Publish Page button to save your changes. The Save As New Page button saves the document you opened with a different name, creating a new web page. NOTE: this only applies to HTML pages, not PHP pages. (HTML pages end in .htm or .html whereas PHP pages end in .php) The Site Browser button opens a page listing all the folders and web pages stored in the web host account. The User Manager allows the Site Administrator to add, edit or remove Web Editor user accounts. The Role Manager allows the Site Administrator to add, edit or remove roles for Web Editor Users. Roles can be assigned to limit access to certain functions, files and folders. The Logout button is the best way to exit the Web Editor. The Title identifies the name of the current page in your browser window.(NOTE: if you are editing a PHP page, the Meta Tags are probably not set up to be editable.) Keywords are visible only to search engines and provide a comma separated list of searchable words for search engines. (NOTE: if you are editing a PHP page, the Meta Tags are probably not set up to be editable.) The Content Description is also only visible to search engines. It provides a concise description of what your website is about. (NOTE: if you are editing a PHP page, the Meta Tags are probably not set up to be editable.) Source
Clicking the Source button will display the work area in HTML view. Clicking it again will return you to WYSIWYG view Cut/Paste
Cut the currently selected text, table, or image Copy the current object (text, etc.) Paste the currently copied items - this preserves any formatting Paste text as plain text - does not save formating info Paste from Microsoft Word Spell Check/Find
Spell Check - allows spell checking but requires a Internet Explorer plugin to run. The first time you use this the editor will prompt you to download and install the checker. Use of this feature is completely optional. Find - finds text Replace - replaces text Undo/Redo
Undo edits (can be many) Undo the undos Links
Insert/Edit Anchor - Allows you to create new and edit existing anchors which are then linked to using the Insert/Edit Link button. Insert/Edit Link - Allows you to insert and upload links to other documents and is only highlighted when text or a link is highlighted. If it is grayed out, nothing is selected. Remove Link - deletes a selected link - only highlight when a link is selected. If it is grayed out, nothing is selected. Special Functions
Preview - allows you to preview your work before saving. Note: this won't show you exactly how your changes will look Image Edit/Insert - allows images to be inserted and GIF or JPG files to be uploaded to the web site (and then be inserted) Table Edit/Insert - allows a table to be created and/or edited Insert a horizontal line Insert a page break; to force text to the next line Insert a special character Print the area you're currently editing Removes formatting from text - this strips away extra code associated with programs like Word or WordPerfect leaving only plain text - which is what you require for HTML. Insert new web page template - only to be used for creating a new page from scratch Insert a "Smiley" - a smiley is a small picture usually denoting an emotion Tells about the FCKeditor used by the Web Editor Text Formatting
bolds/unbolds text italicizes/unitalicizes text underlines or removes underlines on text strikes through text or removes strike throughs Subscript Superscript Justify Paragraphs
Center justify a paragraph Block justify a paragraph Left justify a paragraph Right justify a paragraph Lists
Bullet text (unordered list) Numbered list Indentation
indents text removes levels of indentation Font Format
Style Sets the font "class" - normally this should be set to "nothing" (no style). Format Sets text to a variety of uses - usely "normal" or "Headings" Font Sets font name for text Size Sets font size to be used for text Colour
Sets text colour Sets text background colour
Alphabetical List of Editor commands and Icons
About Anchor Text Background Colour Bold Content Description Copy Cut Find Horizontal Line Image (insert and/or upload) Indent Italic Justify Center Justify Full (block) Justify Left Justify Right Keywords Link List - bulleted List - ordered Logout Outdent Paste Paste as Plain Text Paste from Word Preview Page Publish Page Redo Remove Format Replace Role Manager Save Page As Select All Site Browser Smiley Special Char Spell Check Strikethrough Subscript Superscript Table Textcolor Title Underline Undo Unlink User Manager
If you have questions about Web Editor functions that aren't covered here, feel free to contact us at .