Kupu Editor
How to use the kupu editor to create articles, news items, discussion posts, and more.
Choice of Editor
In your preferences form, you have the choice of two editors to use for creating content: A simple HTML textarea editor which will work on any browser, and the Kupu editor. The Kupu editor has the advantage of allowing a large amount of attractive formatting without having to know anything about HTML, the text markup language of the Web. But the Kupu editor only works on Internet Explorer, Netscape, Mozilla, and Firefox browsers. It does not work on Opera or Safari.
Also, the HTML textarea editor may be somewhat more convenient if you are copying a large amount of previously prepared material from other sources. In any case, this article describes how to use the Kupu editor.
Cutting and Pasting
Kupu is designed to allow you to view what you are typing in approximately the same appearance that it will have when it is posted to the site. For simple and small posts such as the discussions forums, this works really well and is very quick. However, for any longer composition, such as an article, a blog, or even a lengthy post to a discussion, it is prudent to keep some kind of copy of your piece on your own computer. Then if something goes wrong with the posting, editing, or publication process, you can easily recreate what you have written without having to type it all over again. Depending on your style, you may want to create your document on your own computer and then paste it into Kupu, or you may compose it on Kupu and then paste it back onto a document in your computer.
For this, and other reasons, cutting and pasting either all or portions of your composition is a really important feature. Unfortunately, since giving access to a web site to your clipboard (the temporary storage area where copied and cut text is kept) is considered a security risk, browsers either keep this from happening, or warn you. Internet Explorer gives you a reasonable warning message and allows you to set your preference to allow cutting and pasting for any particular web site fairly easily. Unfortunately, Firefox makes this same operation fairly complicated. Go to the mozilla site for instructions on how to enable your Firefox browser to cut and paste.
The Kupu Editor Box
The Kupu layout is very simple: A box for typing (often with scrollbars) and a toolbar at the top. The basic procedure for entering a new document:
- Type in your text. Type the "Enter" key at the end of every heading and at the end of every paragraph.
- Go back and highlight various portions of the text to give them special formatting treatment.
- Click on the "save" or "submit" button at the bottom of your document to post the contents of the editor to the site.
The editor box will do its best job to show you what your document will look like when it is posted. There is a button on the toolbar labeled "HTML" which will change from this view to the view of all the HTML code in you document instead of the formatting. If this is a more convenient view for you, then you probably are better off using the HTML textarea editor instead of Kupu! For most people, it's best to stay away from the HTML button -- it can do more damage than good.
The Tool Bar
The Kupu toolbar will look fairly familiar to anyone who has edited emails or word documents. But they don't work exactly the same, so we will try to point out the special tips you need. Starting from the upper left, we go left to right:
- Bold
- If you highlight a section of text and click on the B button, your highlighted text will either add bolding or remove it depending on what it was originally. If you are typing text and click on B then your next keystroke (and those following) will change from regular to bold or vice versa.
- Italic
- Same as bold, but makes text italic. Note that text can be both bold and italic.
- Subscript and Superscript
- These buttons (x2 and x2), lower and raise the baseline of the text to follow. This is meant mainly for math notation and for footnotes, but it can get you out of some formatting jams as well. Otherwise these buttons work the same as bold and italic.
- Left Justify, Center, and Right Justify
- These buttons cause a section of text to be left justified with ragged edge on the right, centered with ragged edge on both sides, or right justified with ragged edge on the left. Note that there is no option to justify on both left and right edge.
- Lists - Ordered, Unordered, and Definition
- In an ordered list, each paragraph is numbered. Each paragraph in an unordered list has no number, but can have a bullet or diamond graphic instead. Finally, a definition list has two parts: a bold title, and then a paragraph description or definition. You are reading a definition list now. Unlike the previous buttons, we recommend that you use the list buttons prior to typing in your text. This way Kupu will know what each of you "Enter" keys mean and will format accordingly. It is possible to type or paste text in first and then highlight it and apply the list format, but a lot of things can go wrong doing it this way due to unexpected "Enter" characters or other formatting inside the list.
- Decrease or Increase Quote Level
- These buttons allow you to indent or remove indents from text. Indenting is commonly used to identify text that is being quoted. If you change indenting by highlighting text and then clicking on one of the indent buttons, it is easy to confuse Kupu if your highlighted text does not begin and end with the same indent!
- Insert Image
- The insert image button allows you to place an image at a specific spot in your document. You can select an image from the site (usually from your member folder) or upload an image from your computer which is then stored in your member folder. Since there are a couple of issues regarding images that go beyond the editor, we discuss these in a little more detail below.
- Insert Link (Internal, External)
- These two buttons give you a dialog box to allow you to imbed a link in your text. To use them you need to first highlight the text that you want to become a link, then click on one of these buttons to select the destination (web page) of the link. Links also are discussed at more length below.
- Table
- The table button can be used create columns and rows in your document. Like lists, it should be used when entering your text because creating a table from existing text can be very confusing to Kupu and to you.
- Remove Image/Link
- If you have positioned the cursor on an image or a link, you will see a button with a red "X" that removes the image or link.
- Undo and Redo
- The undo and redo buttons allow you to remove the effect of the button you just pressed, or to re-apply the button you just undid.
- Styles
- The final element in the tool bar is a select box that allows you to select from a number of styles. These styles are best used by typing in your text, highlighting the part you want styled, and then selecting the style you want. The styles generally apply to a block of text (like a paragraph or a heading) rather than a few words within a line. Some of these styles are very difficult to remove once you have applied them. You may need to totally delete the text and retype it if you got the wrong style or the wrong piece of text.
- Zoom
- At the far right side of the Kupu toolbar is a zoom button. This expands your editor to the full width of your browser window and generally eliminates the horizontal scroll bar. You will want to use this feature for most of your editing. When you are done editing click the zoom button again to return to the normal mode which allows you to access the rest page you were working on.
Pictures
Although the Kupu editor provides a very convenient way of uploading and selecting images to include in any document, it is important to realize that that this general facility does have a drawback: you must have permission to store your uploaded image somewhere, and people who view your image must have permission to do so. When creating articles these issues are automatically solved, so you don't even need to worry about them. But if you are using Kupu to put a picture in a discussion post, for example, they are important.
Since you ordinarily will only have permission to add content to your own member folder, you must upload your images to this folder or a subfolder which you have created. And, since objects are generally created in a private state, you must changed the state of the image to visible if you want anyone else to be able to see it.
When you select an image from your member folder, Kupu allows you to specify how you want the image positioned. It can be "float left" (the browser will attempt to flow text around the image to the right), "float right" (text flows around the left of the image), or "inline" (the browser expands the height of the current line of text to the height of the image, so no other text can appear on the same line. You can also select an image size smaller than the actual size you uploaded.
A current idiosyncrasy of Kupu is that when images are initially uploaded, you are not given an opportunity to specify its positioning (float left, right, size, etc). But once it has been uploaded, you can re-edit the image to include these details.
Links
Internal links are displayed as dark blue text. External links look the same, except they are preceded by a small icon of a globe. Both internal links and external links can be entered using the external link button: you may enter URLs for astrocartography.net as easily as any other site and use the dialog box to preview the page entered. The internal link button gives a different dialog that allows you to search your own member folder (or others if they are public) and select an object to link to. But in this case you are not given a chance to preview the page. Once again, if you link to something in your member folder, be sure it is visible so that others will be able to view it.
Changes to Kupu
Typical of many open source software projects, Kupu is being constantly improved, and there may also be custom changes to it for this site. Even as these notes are being written, improvements are being made. So be sure to check comments to this article, and to make comments about behavior that is different from what is described here.