Content Editor Overview Logging In Starting New Page Saving Page List Pages Navigation Templates Upload Files Secure Users Editor Panel Logout Print
Click a menu item above to read the help file.
You can also open this help in a new window.

Content Editor Overview

My content editor is easy to use. I have programmed it from scratch to be user friendly and intuitive.

Still, I recommend you read all of this information before you begin. After you have made yourself familiar with the Content Editor, try making a new page and adding content to it.


Important: Font and style elements are not editable, because they are part of the web site design. If you want a different type of font or a different style, then let me know and I'll make the changes for you. Use the "Format" drop-down-box to make style changes.

Logging In

When you first visit the content editor URL, (http://www.yoursite.com/admin), you will be prompted for a password. If you do not know your password, check with the site administrator and they'll retrieve it for you. Save it in a safe place.

The password is stored and remembered until you log out, so if you're using this interface on a public computer, don't forget to log off.

Getting Started

After logging in, the editor loads the default page, which is entitled "index." You'll notice that the page your currently editing is highlighted in yellow.

You may have also noticed the top left corner of the interface has a group of buttons, the exact number of buttons depends on what functions have been enabled for you.

The following is an overview of each button (please note you may not have all these functions on your set up):

  1. Saving Your Work

    When changing text in a page, look for the little save icon to becoming available at the top of the tool bar. Clicking this button will save your page immediately.

  2. New Page

    The new button allows you to make new pages on your site. Each page you create will look exactly like the other pages on your site-- giving your site a consistency that is appealing to visitors.

    You are given a number of options to start:

    • Filename - This is the file name of the page you are creating. Spaces and other non-text characters will be stripped out automatically.
    • Title - This is the friendly name for the page. If you're create a page with the filename faq, your friendly name would be Frequently Asked Questions, with appropriate capitalization and spacing.
    • Desc - This is the description, and it is used to fill a special "tag" on your site for older search engines. These search engines want to know how you'd describe the purpose and content of this page in less than 255 characters.
    • Search Keywords - This is also for search engines. Put a number of carefully selected, comma separated phrases in this box, like
      widget faq, questions about widgets,widget 101,questions about widgets
    • Private (secure) - By selecting this option, the page will not be shown to a web visitor unless they can enter the correct username and password.
    • Public - Public pages do not require usernames and passwords to view the content. This is what you'll usually want to select.
    • Save - Pressing this button will cause the page to be created, filled with default "nonsense" text.
  3. List Pages

    Click this button to view all of the pages you've created that are saved on the server. If you can already see the pages listed out below the buttons, then pressing "List Pages" won't appear to do anything.

    The list will look similar to this:

    album [^] [X]
    contact [^] [X]
    footer [^] [X]
    header [^] [X]
    index [^] [X]
    myaccount [^] [X]
    thanks [^] [X]

    The list has three items per row:

    • (page name) - Clicking this link will place the content of the page in question in the edit pane, so that you can edit and save the text on that page.
    • [x] - Clicking this link will take you to a confirmation prompt, in which you'll be asked if you'd like to delete the page.
      There is no undo button.
    • [^] - This will open the page in a new tab or window.
  4. Navigation (Menu Editing)

    This button allows you to customize your navigation menu.

    Depending on which template you have running on your site, your menu might be along the top of the page, or down either side.

    This button is disabled if you have a complex drop-down menu, as the code in that menu cannot be edited in an HTML editor. I'm hoping to change that some time in the future.

    There are four parts to the button options:

    • Checkbox - Uncheck to remove an item from the menu, and check to include an item in the menu.
    • Page Filename - Click to view the page in a new tab
    • Up/Down buttons - Click these to reorder the items in the menu.
    • Display Link Name - This is the actual text that is displayed to the site visitor, which they can click.

    At the bottom of the panel is a SAVE button. Click this button save changes to your menu.

    Just above the Save button is a text box with [http://    ] in it. You can paste URLs to other sites in this box as well. After you do, check its box, and click Save. Then enter a friendly name, or title for this newly added URL.

  5. Templates

    If you have had more than one template designed for you, then this button will be visible. It allows you to switch back to a previous site "look" so that all your visitors will see a new layout. This might be useful if you want to change your template for special holidays, or if you just want to keep things fresh.

    You might also have a template that gives users a "be-back-soon" or "under-construction" message while you rearrange things.

    Each template will be displayed as a thumbnail. Clicking the thumbnail will make your whole site's appearance change.

  6. Upload Pics/Files

    Click the "Browse" button to find an image on your computer, and press OK/Open. Then click the Upload File(s) button.

    When the file is done being uploaded, it will appear in a list with a thumbnail of the image, a text box with a URL in it, and an [X] icon.

    Click the [X] icon to delete the image.

    If you want to place the image in a page of your site, select the text in the text box and copy it (control-C).

    Now click the 'tree' button on the editor's tool bar.

    Now you can paste the URL into the top "Image URL" box for the image, and then give it a description.

    Choose either "Left" or "Right" alignment, and then press the "Insert" button. The image will appear.

    Note: Please resize your images before you upload them, since large images will take more space on the server, and take a lot longer to download.

  7. Secure Users

    You can create users with passwords and make certain pages on the site "secure," so that only some users can access these pages.

    When you create a new user, type their username and password, the click the button "Save User Edits." 

    If there are no secure pages created yet, then you'll have to make one before you can give access to this secure page to a user.

    To create a secure page, click the "New" button just like you're making a regular page, but choose the "private" radio button instead of the default "public" button.

    Now when you return to the user's menu, you'll be able to "Authenticate Users" by selecting the page, then checking off the users and clicking the "Authenticate User(s)" button.

    Clicking on an authenticated user's name will remove them from the list.

  8. Editor Panel

    The editor itself is similar to Microsoft Word and other text editing programs. It will allow you to modify the content on your pages without knowing any code.

    When pressing "enter" in the editor, you'll create a new paragraph automatically. If you prefer to start a new line in the same paragraph, hold Shift while pressing Enter.

    Across the top, from left to right, there are buttons for formatting text, inserting pictures, adding links, etc.

    More information on: formatting text, making lists, linking to pages and web sites, cleaning up formatting, and inserting pictures.

  9. Formatting Text

    Bold, Italics, Underline, Strikeout

    Just like in Word and other text editors, you must select the text you want to alter, then press the button related to the formatting you want to apply.

    You can also use the common keyboard shortcuts: Control-B is bold, control-I is italics, and control-U is underline.

    Left Justify, Center, Right Justify, Full Justify

    Also quite self-explanatory, click in the paragraph you want to change, then select the button to change your text alignment.

    Format Drop-Down Box

    Instead of trying to bold titles, and change the font-size of text, use items in this drop-down box to give your titles and paragraphs a united look.

    Each heading has a specific appearance, so using these list-items will keep your site looking consistent.

  10. Making Lists - Numbered and Unordered Lists

    There are two main types of lists... those that have letters or numbers or Roman numerals running down the side-- these are known as ordered lists; and those that have bullets running down the side-- these are known as unordered lists.

    To create a list, select some text, and then press one of the list buttons (pictured at left). Every time you press enter, a new bullet or the next sequential number will be created for the list.

    If you wish to start a new line without creating another bullet you can press SHIFT and ENTER at the same time.

    When you're finished adding items to the list, either press ENTER twice, or press the button again.

    • Linking to Web Sites and Your Pages

      The Create Link Button

      The first step in creating a link is to select, or "highlight" the words or pictures that will be clickable. Then click this 'chain-link' button. It will open a dialogue box that you can enter information into.

      • The 'Link URL' is the actual address of the page you want to link to. DO NOT forget to include 'http://' at the beginning of your address.

        To link to an email address, instead of putting 'http://' before your email, put 'mailto:'.

        When you link to a page on your site, you can leave off the full URL, and instead starting with just a slash. For example, the index page (named index.shtml on your site) could be linked to by putting the following information in the text box:
        [/index.shtml]. (Leave off the square brackets).
      • The 'Target' is a way for you to have pages open in new windows, or in the same window.

        The standard approach is to have links to other web sites open in a new window, and pages within your own site should open in the same window.
      • The 'Title' field is a place to enter the text that appears over the link when you hover your mouse above it. This can be helpful if you want to describe the link in more detail for those who might click on it.

        For example, often people will put something like 'Click here for more information.' This will appear in a little yellow rectangle next to the mouse arrow.

      The Break-Link Button

      When you decide to remove a link from your content, first select the text or image which has a link from it, and then click this 'broken-chain' button. The link will be automatically removed.

      Page Anchor

      Sometimes one might wish to have a link that takes a visitor to a place in the middle or near the bottom of your page.

      This is possible, and the first step is to create something called an anchor at the point you want to link to.

    • Remove Formatting

      When copying and pasting from Word or another web page, more than just the text is copied. Along with the text, formatting is copied and pasting, and often this will cause undesireable effects in your web page.

      For this reason, always select the text and you've pasted it in, and press the buttons to clean messy code and remove formatting.

      This will ensure that the pasted content will look like the rest of your site.

    • Inserting Pictures

      Click the 'tree' button on the editor's tool bar.

      Paste the URL into the top "Image URL" box for the image, and then give it a description. See the Uploading section for more information

      Choose either "Left" or "Right" alignment, and then press the "Insert" button. The image will appear.

      Note: Please resize your images before you upload them, since large images will take more space on the server, and take a lot longer to download.

  11. Logout

    Simple - Click to log out of the administrative panel.