Add Text and Media with the ToL Easy Editor

treehouse builders toolkit

• Web browsers that work with the Easy Editor
• How to Use the Easy Editor

Text

• Copy and paste text into the editor
  • Simply copy text and then paste it into the Easy Editor by right clicking with your mouse, using your browser's edit menu, or using keyboard shortcuts. However, please see Transfer Text to the Easy Editor if you will move text from a word processing document or another web editor, because there are some guidelines to follow so your page will display properly on the ToL. Tips for copying and pasting.
• Simple text formatting: format text to be bold, italicized, or underlined
  • Press on and off the B, I and U buttons
• Insert symbols and custom characters such as ©
  • Use the custom characters button
• Menu: Format section headings and paragraphs
  • Use the pull down menu "Format".
  • Headings are used as titles for page sections and should be used hierarchically, e.g. first use Heading 3, then Heading 4 etc. for more detailed subsections of your page.
  • Most page content will be formatted as paragraph text automatically.
• Menu: Text Styles, color and size
  • Use the pull down menu "Text Styles"
  • Note that at the present time you cannot make text both larger/smaller and a color.
• Remove text formatting
  • Remove headings: To change heading text back to the default, select the heading text and choose "paragraph" from the Format menu.
  • Remove Bold, Underline and/or Italic: Click back on the same button you used to format the text. For example you can click on and off the bold button.
  • Remove color: To change text you have added a color to back to the default (black) either select the text and choose "default" from the Text Style menu, or use the remove formatting button
  • Remove size: Select the text and choose "normal" from the Text Style menu.
  • Remove lists: Select the text and choose "non-list" from the List Styles menu to remove list formatting.

Images

• Insert images
  • Use the insert image button to bring up the image search interface. Once you have found the image that you want, click "select" to insert the image.
  • Images are inserted at 250px high as the default. To select an image size, click on the image and select the image size button.
  • For additional help see Adding Media: Step #3 Insert Images
• Format images
  • To format an image click on the image first and then use the formatting buttons next to the insert image button. You can format images with borders, and align the image as you choose. Adding Media: Step #3 Insert Images
• Delete / Move images
  • It is very important that you select the image and then select the delete button
  • To move an image you must delete it first and then re-insert it in your preferred location.

Media (Sounds, Movies and Documents)

• Insert media (movies, sounds and documents)
  • Use the insert media button

Lists

• Make bulleted or numbered lists
  • Select one of the list buttons , then type text to compose your list
    or
    Type in text, then select the text and click one of the list buttons .
  • To make what are called "nested lists", or lists inside of lists, use the indent button where you want your list to become a subset of the first list.
  • For example:
    • Birds
      • blackbird (use the indent button in front of "blackbirds", or select all of the types of birds and click )
      • blue jay
      • cardinal
      • flycatcher
    • Lizards (use the outdent button in front of "Lizards")
• Format lists
  • To format lists, select the list text you want to format and use the List Styles menu.
• Remove lists
  • To remove lists, select the list text and either choose "non-list" from the List Styles menu, or click the list button again.

Tables

• Insert tables for tabular data (charts etc.)
  • Use the insert table button
• Format Tables
• Use the "Table Style" menu to format your table with or without a border.
• Use the table formatting buttons to add and delete rows and columns (these buttons are next to the insert table button).
• Delete tables
  • To delete a table, you must select the image or table and then click the delete button

Links

• Insert hyperlinks
  • Select the text that you want to make a link and then click on the insert link button
    
  • Add the page URL (it is easiest to copy and paste it in). You can decide if you want the link to open in the same window or if it should launch another window.
• Remove links
  • Select the link and click the remove link button
• Create anchors / Insert anchor links
  • Anchor links link to parts of the same page (e.g. a table of contents that links to parts of the page). The part of the page that is linked to must have an anchor.
  • Use the anchor button to create an anchor in your page that you will link to. Then, to link to the anchor, click to insert a hyperlink and write the name of the anchor preceded by a hash mark. For example the Information on the Internet section of every treehouse has an anchor called "www". To link to this anchor, select the text you want to make a link, click the link button and then type #www in the Link URL section.

Actions

• Redo and undo an action
  • Use the redo and undo buttons. You can also undo an action by choosing Edit-Undo from your browser's menu.

View

• View invisible elements
  • It can be really helpful to see the page elements you are using outlined. Click toggle visual aids to see outlines of structural page elements like tables and images.

Edit HTML

• Edit the HTML code
• Click the HTML button . Click the update button to save your changes when you are finished working on the HTML code.

Broswers that work with the Easy Editor

• The Easy Editor works in the following web browsers:
  • Firefox. We recommend the freely downloadable browser Firefox for composing pages with the Easy Editor. We do the majority of our Easy Editor testing with Firefox.
  • Internet Explorer (version 5.0 and up on Windows only)
  • Netscape
  • Mozilla and any Mozilla based browser
  • Any browser based on Gecko
• The Easy Editor does not work in the following web browsers:
• Safari (the editor toolbar will appear but most of the functions will not work properly)
• Internet Explorer on the Mac (the editor toolbar will not appear, only a regular text area)

We recommend that Mac users download Firefox if they don't have Netscape, Mozilla or another compatible browser already installed.

The Easy Editor is a web editor that allows you to create your treehouse without writing HTML code. Web pages are created using a code called HTML (HyperText Markup Language). Visitors to the WWW do not see the HTML code unless they choose to "view source" from their web browser's menu (see example below).

• If you would like to learn more about HTML see All the HTML You Need.
• See Building Steps for additional assistance planning and composing your treehouse.