Some Tips for Using the HTML Editor

This site uses the FCKeditor HTML editor to allow users to create or edit articles.

This is a WYSIWYG editor that uses a Microsoft Word style toolbar so editing is both easy and familiar for most users. No knowledge of HTML is required.

The editor features available depend on the privileges of the user.

Unregistered site visitors have no access to the HTML editor at all. They are only offered a plain text editor.

Registered site visitors have access to the HTML editor but are only provided with a very basic toolbar with limited features.

Category Editors have access to a much more extensive toolbar with many features.

This article is not a reference manual on using the FCKeditor HTML editor. You can find that here. Instead, I'll show you a few handy usage tips:

 The correct way to import text

You don't need to write your review or article online using the HTML Editor. You can do so if you wish, but many users find it easier to write offline using products like Word, or WordPerfect, or even a plain text editor.

When you have finished your review offline, you can then go online and simply copy and paste the text directly into the FCKeditor. However, there a few tricks you need to know:

If you used a plain text editor like Notepad to create your review, make sure you don't have hard line breaks at the end of each line because this will mess up the format of your online review. If you do have hard line breaks, remove them and let the text wrap naturally. You can do that using this free web service.  Hard paragraph breaks are fine.

If you used a rich text editor like Word or WordPerfect, do not paste the text directly into the editor but instead use the FCKeditor "Paste from Word" feature.

If you paste directly without using "Paste from Word", all the font information in your original document will be imported and this over-rides the default website font. Your review, when viewed online, will then look different  to all other reviews on the site. Furthermore, should we in the future change the site theme and default font, your review will not change as the font information is hard wired into the text.

Using the "Paste from Word" feature is easy. First, copy the text from your word processing program then  click inside the "body" box  of the  FCKeditor. Then  click the "Paste from  Word"  icon  in the toolbar. Then paste inside the popup window using either Ctrl V or "Paste" from the right-click context menu.

All your text formatting will be carried over except the font information.  Mostly, you won't have to do any more editing inside the FCKeditor at all. And you'll be surprised at just how much better your review looks when viewed online.

For those of you who have already created their reviews and have accidentally embedded font information, you can correct this easily. Just edit your review, click inside the HTML body box, press Ctrl A  to select all the text then Ctrl C to copy it. Then click the Paste from Word icon in the toolbar, and paste the copied text back into the popup window using Ctrl V. The embedded fonts will have been removed.  Just save and exit.

A word of warning

If you type your review directly into the WYSIWG editor, or are making a lot of editing changes,  I suggest you save your work often as it is not uncommon to hit the wrong key and lose everything. In particlular, accidentally clicking on a link in your review will result in the browser opening the linked page and all your work will be lost.  So please save often. Heed these words!

How to insert a single line break

In the FCKeditor, pressing Enter creates two line breaks. This is fine for separating paragraphs, but is an annoyance if you want to construct a list with only single breaks like this:

Item 1
Item 2
Item 3

Doing this is simple: just hold down Shift when you press Enter. You'll then get only one line break, not two.

How to create a link to a website

Highlight the text you want to link.  Then click the Insert/Edit link icon  in the FCKeditor toolbar. Enter the website address you want to link to in the URL box and click OK. That's it; the link has been created.

How to create a link to a page in this site

First, find out the address of the page in this site you want to link to. To do that, navigate to the page and look at the URL in your browser address bar. The address will be in one of three possible forms.  All you are interested in is the bit at the end after the ".com/". Depending on the form of the URL, write down just the portion indicated below:

1. http://www.techsupportalert.com/node/xxxx =>   write down node/xxxx

2. http://www.techsupportalert.com/xxxx.htm   =>    write down xxxx.htm

3. http://www.techsupportalert.com/xxxx          =>    write down xxxx

Now go back to your review and edit it. Select the text you want to use to create the link, and then click the Insert/Edit link icon  in the FCKeditor toolbar.  In the pull-down Protocol menu, select <other> and type the page address you want to link to in the URL box, and click OK. That's it; the link has been created. Note: do not have a "/" at the start of your URL; it will not work

How to create a link to a bookmark in your article page

This is the technique we use in the reviews on this site to link a product name to the product details at the end of the review. There are, however, other uses.

Often, with a long article, it's handy to create a short table of contents at the start of the article with each item linked to a point further down the page.

This is commonly used for things like FAQ lists but there are many other applications. Indeed this article itself makes use of this feature.

Creating internal links is a two stage process: first you need to create bookmarks (AKA "anchors") at the appropriate points in your article. Then you need to link to these bookmarks.

To create a bookmark, go to the point in your article where you want to link. Then click the Insert/Edit Anchor icon  on the FCKeditor toolbar. Give the bookmark a name; it can be anything: "1", "item1", "paragraph 4," whatever. Just remember that each bookmark in the page must have a unique name.

When you have created your bookmarks, highlight the text you want to use to link to the first bookmark. Then click the Insert/Edit link icon  in the FCKeditor toolbar.  From the Link Type drop-down menu select "anchor in the text."  Then use the pull-down menu "Select an Anchor by Anchor Name" to select the bookmark you want to link to. Click OK, and you are done. Repeat for each bookmark.

 

Post new comment

  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <b> <address> <blockquote> <br> <caption> <center> <code> <dd> <del> <div> <dl> <dt> <em> <font> <h2> <h3> <h4> <h5> <h6> <hr> <i> <img> <li> <ol> <p> <pre> <span> <strong> <sub> <sup> <table> <tbody> <td> <tfoot> <th> <thead> <tr> <u> <ul> <tr>
  • Lines and paragraphs break automatically.

More information about formatting options