LoopyCMS Administration - Content Editing

 

Overview	Content editing	Content Tools	Sending Newsletters
Creating Pages	Editing PhotoAlbums	Create a Content Type	Restore from Backup
Remove old backups	Siteman	Site Configuration

This section of the administration documentation will cover creating and editing content.  I'll focus on articles, but the process is the same for any content type.

In the image above, you see the content editor.  In this example, I've chosen to create an article.  Because articles are set (more of this in the final section) to use "headlines", it asks for a title. 

The next element is the filename.  You only have to enter the name, because the extension is forced to ".htm" for all content.

Finally, there's the HTMLEditBox window - the HTML editor. It works much the way editing HTML emails in Outlook works, except the interface has more controls, and is customizable.  The controls work much as you'd expect, but I'll review what's available.

First, on the left side, top row, we have buttons for bold, italics, underline, a horizontal rule, bullet point lists and numbered lists.  The second row has buttons to indent, outdent or create left, center or right aligned sections.

Most of these are intended to work on a selection of text, but many also work without a selection being made in the editing window.  For instance, clicking on the bold button will toggle on bold mode.  Clicking the UL (bullet point) button will start a new bullet point list.

In addition, certain keyboard commands exist that act as shortcuts.  These are all commands you might be familiar with from other Windows programs, like Ctrl-B for bold, Ctrl-C for copy, Ctrl-V for paste, Ctrl-X for cut, Ctrl-Z for undo.  These are common windows commands and many of these standard keyboard shortcuts work here.

This next section contains some items far more unique. 

Link and Unlink will create hyperlinks in your page (or clear them). Pretty standard, Link pops up a dialog box prompting you for the name of the link.  When you use this, be a little careful, because you can create links that are only valid from your point of view.  The editing functionality has been customized to correct many of these issues and I'll demonstrate how to address this for your needs in the last section on configuration.

To put images in your page, you can use the image browser (see the next section on the Content Tools for more on that) to find images from the /Images directory of your server.  Simply right click on the image, select copy and then switch back to the editor page and paste in the image.  Once you have done this, Image Properties will allow you to modify a number of the properties, such as width and height, border, alignment and such.

Insert table pulls up the Table Builder tool (see the next section on the Content Tools for more on that).  When you have created your table with that tool, it will be inserted at the location of the cursor in the document.

The middle row has a tool with three parts, a parameter box, that allows you to put in a custom style when creating a custom DIV tag, for example, or a URL when creating a link that opens a new window.  The configuration section will contain more information on customizing this tool.  When you have selected the options you want to apply to your document, make a selection in the editor window and click Format.

The bottom row contains three tools.

The first is View Source, which shows you the source HTML currently selected.  This is useful if you're confused about why something isn't doing what you expect, revealing you aren't selecting what you think you're selecting. If you're not familiar with HTML enough to understand what is going on, this may be of little use, but for the HTML wizard, it can be helpful.

Undo will undo any change made with a button.  Every button action creates a temporary copy that can be undone.

Lastly, unformat will convert the selection to plain text, removing all tags.  This can be useful if you paste in something from another web page that has stuff you want to remove or if you have some funky formatting thing happen that you want to scratch and do over. 

 The right side contains buttons for Paste, Copy and Cut - these operate as you would expect, pasting in from the clipboard, copying a selection or cutting a selection

Save, Load and Clear allow you to Save your work to a file (automatically managed by the application) or load the last edited content.  If you click Save, close your browser, reopen it, come back to the editor, and click load, your saved content will be reloaded.  Clear, does just that, clears the entire area, so you can start from scratch.

This button on the bottom row of the left allows you to switch to editing the underlying HTML of your content.  If you're not an HTML wiz, this may seem daunting, but with a little HTML knowledge, you can make customizations that don't have any corresponding user interface tools. When you click this button, your content is saved and a temporary copy is made.  If you come back to the default HTML editing mode and see you're change isn't right, you have the option of clicking undo to rollback your edits to before you switched to text mode.

Underneath the rows of buttons, is a little area that shows you help on all the buttons on the tool.  This can be of assistance, especially, as you're getting comfortable with the editor.  Point at a button and a help message appears.

Here is a sample of creating a new document.  Note the custom div sample, created with the custom format tool as described above.

When you're done editing, click the submit button.   Your article (or other element) will be created. The link at the top is displayed when you are creating Articles or other "Content Collection" content types that have a viewer associated with them.

Now, let's look at editing existing content, when you click the edit link on the front page of the admin section (for any content type), you are  presented with a list of content for that content type. Clicking on the name of the piece of content in question, loads it into the editor, as shown below. 

Ok, that's the the editing functions, now let's go on and look at some of the tools to assist you in creating content and linking to other elements on the site -- Content Tools.