Introduction
One of the few tools Macintosh users can not use with eCollege is the Visual Editor. The Visual Editor allows Windows users with Internet Explorer 5 or 6 (and sometimes 7 or 8) to easily format text so it can include bold, italicized, underlined and colored text.
Here's what the Visual Editor looks like on a Windows computer with Internet Explorer 5 or 6:
Instead of the above, Mac users (and Windows users who work in Windows Vista, Internet Explorer 7 or 8, Firefox, Netscape or other Web browsers) will see the Text Editor, a standard text-editing box with options for adding links to files and images, as well as options for accessing the Math equation Editor and the Spell Checker.
The Text Editor looks like this:
Note there are fewer options for Mac users, and no means to format the text.
Windows Vista and Internet Explorer 7 & 8
eCollege's Visual Editor interacts with Windows and Internet Explorer using software called "Active X", which is why the Visual Editor only works with Windows Internet Explorer 5 or 6. Because of changes Microsoft made in the way Internet Explorer 7 (and 8) and Windows Vista use Active X, neither Internet Explorer 7 or 8, nor Vista, will currently work with the Visual Editor.
Until we can post to this document a fix, Internet Explorer 7 or 8 and Windows Vista users will see the Text Editor described above.
If you recently upgraded to Vista or bought a new computer with Vista, then you must be using Internet Explorer 7 or 8, as those are the only versions of Internet Explorer that work with Vista. If so, please see the directions elsewhere in this document for how to format text in eCollege.
If you are still using Windows 98, 2000, XP, etc. (anything but Vista), then you can check the version you have of Internet Explorer by clicking on its "Help" menu at the top of Internet Explorer and choosing "About Internet Explorer".
(If you can't find the "Help" menu, it's likely you are using Internet Explorer 7 or 8, since the "Help" and other menus are turned off in Internet Explorer 7 and 8- but here's how you can turn them back on. To temporarily display the menus in version 7 or 8, press the ALT key on your keyboard. To display the menus permanently, click the "Tools" button towards the top of Internet Explorer 7 or 8, and then select "Menu Bar" in version 7, or "Toolbars", then "Menu Bar" in version 8.)
If you discover you are using Internet Explorer 7, then you can read "How to uninstall Internet Explorer 7" at http://support.microsoft.com/default.aspx/kb/927177. That should leave you with Internet Explorer 6, which should work properly with eCollege's Visual Editor. Similarly, if you are using Internet Explorer 8, then you can read "How do I uninstall or remove Internet Explorer 8" at http://support.microsoft.com/kb/957700. That should leave you with whatever earlier version of Internet Explorer you had before upgrading to version 8.
Or, if you are still using Windows 98, 2000, XP, etc. (anything but Vista), when you try to access an editable area of eCollege by clicking on the Author tab, you may be prompted with a message in the information bar towards the top of your browser window. That message could be Internet Explorer 7 or 8 notifying you that eCollege wants to run Active X- if it is, go ahead and allow Active X to run so you can use the Visual Editor to easily edit your text in eCollege. But if you are not prompted to allow Active X to run, or you choose not to allow Active X to run, then please see the directions elsewhere in this document for how to format text in eCollege.
According to eCollege Technical Support, another tip you can try with Internet Explorer 7 or 8 is to click on the "Tools" menu, choose "Internet options", then under the "Security" tab change the "Level" to "Medium". Then under the "Privacy" tab uncheck "Turn on popup blocker" and change to "Accept all cookies" by moving "Level" to bottom.
Seeing a small box with a red X
If you are using Internet Explorer 7, please try the tips in the two paragraphs above. If they do not help, then please try the tip below for Internet Explorer 8.
If you are using Internet Explorer 8, then here is how you can see the "Text Editor" view (explained in the Introduction section above). When you can see the small box with a red X, click on the button with the handicap symbol over a keyboard 
(the "assistive technologies" button in the upper right). You should then see the "Text Editor" view, and you can edit, type or paste in your text or html code.
So how can Mac and other browser users format text in their announcements? With a little HTML!
eCollege classrooms are really special kinds of Web pages, so they are written in codes that Web browsers (Internet Explorer, Firefox, Netscape, Safari, etc.) read. One of the codes is called HTML, and you can add "tags" of HTML code to text you type into announcements to add certain text styles.
Here are the most common HTML code tags for changing text styles, and a brief description of what they do:
<strong></strong> this will create bold text
<em></em> this will create italicized text
<u></u> this will create underlined text
Here's the tricky part- Web browsers have to be told when to start to display a certain style or color of text and also when to stop displaying that style or color.
So, you'll notice that with each tag I listed above (<strong>, <em> and <u>) I also listed how to tell a Web browser how to stop displaying that style of text.
Usually you do that with what's called a "close tag", and usually a close tag is exactly the same as the opening "tag", but with a slash added before it.
For example, to start bold text you would type the opening tag <strong>, then to end it you would type </strong>. The close tag </strong> is what tells the Web browser when to stop displaying text as bold. To illustrate, if I want this sentence with only the word "today" in bold:
The assignment is due today after 6 PM.
this is what I would type into an eCollege announcement:
The assignment is due <strong>today</strong> after 6 PM.
You do the same with other text styles, too- for example, to start italicized text you type <em>, then to stop italicized text you type </em>. So, if I want this sentence with only three words to be in italics:
Bob's article is highly recommended reading before you take the test next week.
I add the opening tag for italics just before the three words I want in italics, and then I add the close tag after those three words:
Bob's article is <em>highly recommended reading</em> before you take the test next week.
In the above example only the words "highly recommended reading" would display in italics.
Text Color
Changing the color of text is a little different. Here's both the start tag and close tag for making text blue:
<font color="blue"></font>
In the sentence "This is blue text" if I want only the word blue to appear in blue, then this is what I would type into an eCollege announcement:
This is <font color="blue">blue</font> text
Which would look like this:
This is blue text
Note that the close text is simply </font>. In the opening tag you can change the name of the color to display other basic colors, such as red, purple, and brown. But to end any color of text you type the same close tag, </font>. That tells a Web browser to stop displaying this font color of text.
Please remember, though, that some of your students may be color blind and may not be able to see the difference between red and green text- so take care to use color sparingly, and only use colors that stand out from their background, such as dark text on a white background.
Paragraph formatting
Here are two more HTML tags you may want to use for formatting:
<p> is a paragraph break and will leave an empty row in between the lines of text (as in the empty lines above and below this sentence)
<br> is a break that will simply break your text and continue on the next line
More HTML Resources
All of the above is explained further at http://www.htmlprimer.com/ and http://www.w3schools.com , and you can learn about other basic HTML tags at http://www.webmonkey.com/reference/HTML_Cheatsheet .
Please try to refrain from using too many styles and colors in the same message- it can be distracting to your readers. Just as with decorating, less is more!
How to use free NVu to format text in eCollege
Until we upgrade to the .NeXT version of eCollege in which the "Visual Editor" works with all Web browsers and on Macs, another option is to use any HTML editor, such as Dreamweaver or the free HTML editor "NVu", which can be used as a workaround for editing content in an eCollege classroom.
The below steps are for NVu, a free download from http://www.nvu.com - but they will likely work with any HTML editor, such as Dreamweaver, to create formatted text in HTML (Webpage) format that you can paste into eCollege.
Note to Mac users: instead of the Control (Ctrl) key in these steps, Mac users hold down the Apple key next to the spacebar.
-
In eCollege, if there is already text you want to edit, you'll need to copy all of the HTML code in the area you want to edit. The easiest way to do that is to first click on the item you want to edit, then click the "Author" tab. In the case of discussion forums, you may also have to click the "Edit Intro Text" link to see that text you want to edit. You should then see all of the HTML code for the text in that item.
-
Carefully click anywhere in that HTML text, then on your keyboard hold down both the Control (Ctrl) key and the "A" key at the same time to select all of the HTML code. Then, hold down both the Control key and the "C" key to copy all of that code.
-
If NVu isn't running already, start NVu, and in the new NVu document it creates, click the "Source" button at the bottom of that NVu document's window.
-
Delete all of the HTML code you will probably see in that NVu document, then hold down both the Control key and the "V" key to paste in the code you had copied from eCollege in step 2 above.
-
Once that code is pasted into the NVu document, click the "Normal" button at the bottom of the NVu document (it should be to the left of the "Source" button you had clicked in step 3).
-
You should now be able to edit the text as if you are using a word processor.
-
Once you are done editing the text, you may want to save the NVu document with your changes, just so you don't lose them.
-
When you are satisfied with the text you have edited, click on the "Source" button at the bottom of that NVu document's window to see the HTML code of what you have edited.
-
As you did in step 2 above, carefully click anywhere in that HTML text, then hold down both the Control key and the "A" key at the same time to select all of the HTML code. Then, hold down both the Control key and the "C" key to copy all of that code.
-
Now go back into eCollege, which should still be open to the HTML code view of the text you are changing in your classroom. As you did in step 9 above, carefully click anywhere in that HTML text, then hold down both the Control key and the "A" key at the same time to select all of that code. Then, click the "Delete" key on your keyboard to delete that code.
-
Click once in the now empty field from which you just deleted the old code, and hold down both the Control key and the "V" key to paste in the code you had edited and copied from NVu.
-
Click on the "Save Changes" button, and after eCollege confirms that the changes have been saved, click on the "Course" tab (up next to the "Author" tab) to check your work from the students' perspective.
Unfortunately, you can not create links to documents or Websites in NVu that will work in eCollege. To do that, you have to create those links in eCollege, then copy that eCollege HTML code into NVu as explained in step 2 above. Once you've pasted in that HTML code, follow step 5 above so you can then edit the names of the links created in eCollege.
Adding an image
Inserting an image or photo without use of eCollege's Visual Editor can require a bit of trial and error, so feel free to use your Practice Classroom to experiment the following.
While in your eCollege classroom, complete the following steps:
-
In the Author view, place the cursor on your text entry screen at the exact point where you would like to add the image (when you have completed the rest of this process, the image will appear at that point).
Since you can only see HTML code, you will need to place the cursor in the correct place in the code, which can be a challenge to determine. Often you will want your photo to show either above or below your text, so placing the cursor before all code or after all code may be easiest. -
Click on the Add Image icon or link
-
When the next screen pops up, click in the radio button for "I need to upload the file", then wait a moment for eCollege to respond.
-
In the "Descriptive Text" field you should provide a brief description of the image, such as "Image of your instructor", so students who can not see the image will have an idea of what the image illustrates. You may ignore the "Create new Folder" option.
-
Click on the Browse or Choose File button to locate and select the image from your computer.
-
Click the Add Link button to complete the process. You will then see the HTML code for the image added- it will start with "<img src=".
You may want to add <p> (the paragraph tag, described above) just before or just after the new image code, just to create a line of space between the image and any text before or after it. -
Be sure to click the Save Changes button!
-
After you have saved the changes, confirm how students will see it by clicking the Course button above Course Home.
When done reading the above, close this browser window or tab.