csArticles :: User's Manual

Note: Most of the screenshots used in this manual have been reduced in size. The actual pages will appear much larger and cleaner. See the demo for a realistic look at the script. The images are for reference only.

csArticles is a content management tool  developed to be used by webmasters of all talent levels; from users that are brand new to website maintenance to advanced users that are extremely knowledgeable. Manage categories and articles within categories, various levels of users and permission levels. Insert images into article summaries and articles bodies (no limit to the number of images per article), create content using a powerful WYSIWYG HTML editor, create and manage multiple templates, and more. It can save a busy webmaster hours of tedious HTML editing each day.

Main Login Screen
Simply type in the username and password your saved using the automated setup. Use the "Remember Me" option to have the username and password saved for you. This is visible only on the computer the username and password was saved on, others cannot see this.

Main Article Management Screen

Category Commands

Add New Category
To Add new category simply click the 'Add New' button under the Category Commands title.

Copy Selected Category
To Copy selected category select the category you wish to copy and click the 'Copy Selected' button. You will be asked to type the name of the new category and to choose whether or not you want to copy the articles as well.

Delete Selected
The Delete Selected button deletes the category and all associates articles in that category.

Edit Selected
The Edit selected button the currently selected category in the category add/edit window.

Preview Selected
The Preview Selected button shows a preview of the category using the summary and listing templates set for that category. These templates can be selected/viewed in the edit category screen.

Links Wizard™
The Links Wizard™ button the Links Wizard™ in a popup window.

Template/User Management
The Template Management button the template management window. This is where you can add/modify/delete templates.
The User Management button up the user management window.  This is where you can add/modify/delete users.

Article Management

Installed Modules
This area will show links to the management screens of all the modules you have installed for csArticles. You can also use the modules when editing articles.

Add New Article
The 'Add New Article' up the add/edit article management page.

Contents of Article Listing Table

• 'Select' checkbox column. This checkbox affects the actions Delete and Move-To shown at the bottom of the page.
• Item # this is used to change the order of the articles. Change the number to the desired position and they will renumber.
• Hide: Hides the article from being displayed to the publisc.
• Modify: Edit the article.
• Delete: Deletes the article (permanently).
• Preview: Preview the full article page as defined by the full view template.
• Title/Date/Time: The title/date/time will always appear in the management screen regardless of how the template is set. If there is no date, then the date is not displayed there. If there is no time, the time is not displayed there. The summary of the article displayed in the management is controlled by the summary template either specified for the category or article.

Category Management

• Category Name
  Name of category used for identification purposes.
• Article Default Archiving
  Do not archive: Default. Will not archive the article.
• Expire article in XX days: After XX days since the article has been entered. It performs the action listed in Expiration Action area.
• Expire article when article date has been reached: This will obviously require you to change the date from the current date to a date in the future. When that date is reached, the article is archived. This can be used for events. For example, if you have an events listing with the date of 09-23-04, then it will be ‘archived’ after 09-23-04 as is set in the Expiration Action.

Custom Fields

This option modify what the default ‘add/edit’ article form will look like. The actual displaying of the data entered in those fields are controlled by the templates. Adding names in the text fields will create an input field on the article add/edit form using that same name.

There are 10 custom fields that you can specify. Custom fields will be accessible from the template via [CustomFieldName].

For example, if you have a custom field name ‘Location’ then you can put in your template
Location: [Location]

And it would appear in the article as:

Location: Indianapolis, IN

Article Add/Modify Form Default Options

Show Headline Field: If checked, the headline field will appear on the article add form.

Show Summary Field: If checked, the summary field will appear on the article add form.

Show Body Field: If checked, the body field will appear on the article add form.

Show Date/Time Field: If checked, the date/time field will appear on the article add form.

Link Headline to Body Link Headline to URL or Local File (http://www.vg-force.com/spacer.gif).
Specifies whether there is a body textarea/html editor associated with the body or if there is an upload field that will serve as the body. For example, if a user clicks on the title of an article and you want to have thema PDF file that you uploaded, you would use the link headline to URL or localfile option. If that is selected and you go to the add/edit form you will not see the body section. Instead you will have a field where you can enter a URL or upload a file.

Template management
There are 4 templates you must specify with each category. By default, we supply you with 4 of them to start. Each time a category is created these templates will be selected by default. From the main menu you can Modify, Delete, Copy, and View existing templates. You can also add a new template.

The 4 templates are:

• Summary
  This template is used to show a summary of the article, a teaser if you will. On your main page you can have a headline, summary of article(s), and a link to the full article. This way you can list many stories on one page and link to the full text within the site.
• Listing
  Listing is used to show a full category listing of articles. You can also select multiple categories and select the number of articles you wish to display per category. When each articles listing is displayed, what is shown is the summary template repeated for each article you are showing. On the listing template you would commonly include maybe a header and also the pagination link to go from page to page of the articles, other than that, all you need is the summary tag.
• Full Article
  This is the layout of what the full article display will look like.
• Printer Friendly Version
  This is what is linked to by the [ArticlePrinterFriendly] tag from the template editor. This template is used to make a very simple to print page that does not have a lot of graphics. I would recommend keeping the page low-load and make one or 2 references to your site as advertising of where the article came from.

New article summary and new article body templates are a way to specify a default for every new article that you create. These are optional. For example, if you have a specific format that each of the bodies for your articles would follow then that would be a good example of where having a ‘default’ would be advantageous.

Template Management (Add/Edit)

Add/edit Template
When adding or editing you have a couple of fields to fill out, Name and Type.

• Name
  Simple identifier for the template.
• Type
  There are 5 types of templates
  Summary, Listing, Full View, Printer Friendly, and Miscellaneous.

Template Functions (dropdown menu)

• Insert headline with link to article Same Page
  Inserts the headline text that is used as a link to the article that will appear on the same page/frame.
• Insert headline with link to article New Window
  Inserts the headline text that is used as a link to the article that will appear in a new window, this uses target=_blank.
• Insert headline with link to article Specify Target
  Inserts the headline text that is used as a link to the article that will appear in a target frame that you specified.
• Insert headline with link to article Popup Window
  Shows the body of the article in a popup using the default popup size. You can edit configuration of the popup in the editor once you have the tag placed on the page by putting your mouse in that area and clicking the insert link button.
• Insert headline (no link)
  Simply shows headline text, not as link.
• Insert article date
  Inserts the date of the article creation.
• Insert article time
  Inserts the time of the article insertion.
• Insert body
  Inserts the entire body of the article.
• Insert listing
  Inserts the category listing of articles. They are displayed as the summary template indicates.
• Insert custom field
  Add custom field configured in category management. Prompts you to enter the name of the custom field.
• Insert email this article
  OBSOLETE, use csRecommend to get this option.
• Insert printer friendly page
  Inserts a link to the page defined by the printer friendly template for the article ( in popup).
• Insert print page link
  Inserts an html link that uses the window.print javascript command.
• Insert pagination link
  This is normally only used on the listing template. This tag will give you the page: 1 2 3 4 5, etc link to be used when you specify a ‘link wizard’ to only show XX articles per page.

Modules/Plug-in's Dropdown
Most of our other powerful applications can be used a Plug-in Modules for csArticles. See the script listings for more information. near each script listed you will see the words "PLUG-IN" next to each script that can be used as a plug-in for csArtcles and csPublisher.

The Modules/Plug-in's Dropdown is the interface used for the modules. You can either insert a module component using this dropdown or manage the module. To insert a module component, simply place your cursor where you want the module component to appear and select the ‘insert calendar’ or ‘insert banner’ link.

This will insert the module component on the page.

Note: The borders around the component are just temporary and only shown in the editor to identify the module. You can resize the module window as you see fit if the module window is either too big or too small to show the entire component.

Links Wizard

Basic add/edit/delete. You can click the radio button at the top and click the refresh button to toggle between JavaScript, Server Side Includes (SSI), and direct links.

In the action column you can choose to Modify or Delete existing links. In the Display Code column you will see the code that correlates with the type of link you chose above (JavaScript, SSI, or direct link). 

The Copy button will grab the link code and copy it to your clipboard (buffer). All you have to do is Paste it into the page where you want the code to appear.

The Preview button willthe link in another window.

Create a New Link or Modify

Link Type
There are 3 types of links:

• Index of Articles
• Single Article
• Category Index

Index of Articles
This lists articles in one or more categories.

Order
Specify Order by selecting from:

• Title
• Date
• Default Order
• Other (custom fields)

Direction
Select from Ascending or Descending.

Categories
Select one or more categories to list articles from.

Limits
Specify the limitations you want to put on the listing. Choose from:

• Show All
  Show all the articles in this category
• Show XX per category
  Limit the display to only xx per category. For example.. if set to 5, no matter how many articles are in category currently selected.. there will be a max of 5 per category.
• Show XX total
  will only show XX articles no matter how many categories are selected.

Pagination
Have the results displayed on multiple pages.

• Show All
  Does not use pagination.
• Show XX Per page
  Causes the [ArticlePagination] tag to be parsed out on the article listing page. Will make links like Page: [1] [2] [3] [4]
• Columns
  This will divide the results on each page into columns.

Single Article
This will create a link to a specific article.

Category
Choose what category contains the article you are after.,

Article
Select the specific article you are looking for.

Display
Specify whether you want to show the Full article body or the article Summary with a link to the full article.

Category Index
Use this option to list multiple categories in one listing.

Prefix Category Filter
Use this column only if you named a series of categories using a consistent Prefix, such as "Stories-". This way, the only categories that will be used are those that start with that Prefix.

You can choose to remove the Prefix from the listing if you wish (advisable). Most prefixes mean something to the author only, they are not required for the website.

You can also show the number of articles within each category by selecting that option.

Target
You can specify the target used when the links are clicked. The target option consist of:

• Same Window
  Will appear in same window/frame.
• New Window
  Will use the target=_blank tag.
• Other
  Specify the target by typing the name in the field provided.

Columns
The results can be divided into columns. A table is created and can be controlled using the options provided and shown below:

• Specify number of columns.
• Specify the column table properties:
  • Border
  • Width (size in pixels or percent)
  • Table align
  • Cell align

Order Alphabetically
Choose from ascending or descending.

User Management

The User Management page lists all the users currently in the system. The list can get quite long if you have a lot of users. You can use the search field to narrow the search down or select form the alphabet at the bottom to filter the list using that letter of the alphabet.

There are 5 columns to the User Management page:

• Action
  Select from Modify or Delete.
• Name
  Lists the actual names of the users.
• Username
  Lists the specified Username of the users.
• Password
  Lists the passwords of the users.
• Level
  Specifies the level each user it currently at.

Then there is an Add User button and a Back to Management button.

Add/Edit User

The add/edit user page has 5 primary fields:

• Name
  Type the full or partial name of the user here. Identification purposes only.
• Email
  Type the email address of the user in this field.
• Username
  Type the username the user wishes to use in this field.
• Password
  Type the password the user wishes to use in this field.
• Level
  Choose from Administrator or User

User Level

Administrator Level
If the user is selected as ‘admin’ then no additional settings need to be selected. Admin users get access to everything. If you select a ‘user’ from the dropdown then it provides other security settings.

User Level
There are many ways to control the users access to features in the application. Some options that can be controlled per user are:

Add Articles (enable/disable)

• All
  Allowed to add to all categories.
• Selected categories
  Specify the categories the user can add articles to.
• Module access
  Toggle on/off whether or not the user has access to the modules in the html editor.

Delete Articles (enable/disable)

• All
  Allowed to delete within all categories.
• Selected categories
  Specify the categories the user can delete articles in.

Modify Articles (enable/disable)

• All
  Allowed to modify within all categories.
• Selected categories
  Specify the categories the user can modify articles in.

Note: These settings will cause either a category to appear or not to appear in the main management category dropdown menu. If a user doesn’t have add, modify, or delete capability in a category, then the category will be hidden. Other features are affected as well. If a user doesn’t have modify permissions in a category then they will not be able to hide/unhide an article.

Advanced Article Settings
This toggles whether or not a user gets access to the ‘advanced settings’ on the article management pages (add/edit). The advantage to this is that an admin can pre-configure a category and then set up the user without advanced settings so they can’t change them (i.e. what fields appear, archiving, whether it’s a regular article or a link to an upload or URL, etc). It also makes the forms much easier for the entry-level user; the form isn't all cluttered up with fields that they will not be using, nor care to see.

Modules
As modules are installed in the ‘mod’ directory of csArticles, they will appear on the main csArticles management page. You can manage the module components from these links.

Article Add/Edit

The default ‘add’ screen is controlled by the settings in the category. If you don’t have the ‘show summary’ checkbox checked then the summary field will not appear when going to add an article. You can override these options on an article by article basis by going into the advanced settings.

Article headline: every article needs to have a title/headline .. regardless of whether or not you are actually showing it on the site. This is used as an identifier for the article in the admin screen.

Article date/time. Date/time you want to give this article. You can display this field by the [ArticleDate] and [ArticleTime] template tags. You can also use this date/time for archive when you use the feature to archive after this date has been reached.

Article Summary field/Article Body field (assuming that ‘show article and show summary checkboxes are checked in either category or in the advanced settings for this particular article)

You can toggle back and forth between text mode and html editor for both the summary and body for an article. The text mode is a plain text area where you would enter unformatted text to use for the article. The script will search the entered text to see if there are any <…> tags in it.. if there are no <..> tags then its assumed to be plain text and carriage returns are converted to a <br> to force an html line break on the carrage returns.

Advanced Settings

Same options as in the category settings but only affects this particular article.

Article start date. Article will remain hidden until this date has been reached. You could use this feature.. plus the date archive feature to make an article appear within a certain time frame.. i.e 3/1/2003 to 4/12/2003.

You can optionally select more than one category for this article. The article itself will only show in the main category in the management screen, however previewing a category from the management screen will show other articles that have this ‘additional’ category set.

Article expiration
Same as category settings but overrides for this particular article.
Also.. once an article has been archived. .its archive setting will be changed to do not archive. This is to prevent any looping to occur when archiving a single article to a category.

This are the templates for this particular article. They can be default which is specified in the category setting or you can change them for this particular article.

If you have link to article body then you would have the body field for the article (assuming you also have the ‘show body’ field checked in either the category or article setting).

If you have Link to existing URL or uploaded file, this will cause the normal text editor/html editor for the body to be replaced by a single field which you can either enter a URL in or select to upload a file. This will cause the [ArticleLink] tag from the template to point to this URL or uploaded file instead of going to an actual article body.

HTML Editor (icon descriptions)
Cut
Copy
Paste
Undo
Redo
Create numbered list for highlighted text
Create bulleted list for highlighted text 
Indent
Un-indent
Make selected text flush left
Make selected text centered
Make selected text flush right
Insert Page Break
Insert horizontal line.
This will popup a page where you can specify features for the horizontal line. To edit an existing line. Click the line so its selected and then click the insert horizontal line icon to edit the selected line.
Insert image
Page Properties
Use this powerful feature to adjust all the page settings. See the picture to the right for an example of what the Page Properties window looks like.Mode Toggle Image
Toggle between Raw code and the selected Editor.
Insert link
This will popup a screen where you can configure the link. If there was no text selected then the text field will appear. Otherwise, it will be making a link on the text you originally had highlighted.

First you select the link target:

• Same Window
• New Window
• Popup Window
• Specify Target

Then specify what the link will point to:

• URL (website address)
  URL Field will appear where you can type in the address. The link will point to that address.
• File (upload local file)
  A file upload field will appear where you can upload a file. The link will point to that uploaded file.
• Article (existing article in csArticles)
  Select the category that contains the article you wish to link to then select the article. A link to that article will be created.

Note: Linking to Articles (as shown above) allows you to link to other articles, evenin different categories, within the current article. Also, this is a key feature for the templates, you can customize how the article title is linked to the body. When you select ‘This article’ (in the Article dropdown) it means the current article for whatever template is active. Thus in a summary template you could remove the [ArticleTitle] tag from the template and just use this feature to create your own title link to the full body. This gives you more flexibility on how the articles appear. For example, you could link a thumbnail image as well as the article title to the full body of the article. Or you could link text such as "more..." to the full article body within the summary template.

Insert Image
Image URL: manually enter a url
Local File: upload an image from your harddrive
Image Gallery: goes to the image gallery. The image gallery’s location is controlled by settings in the setup.cgi file.

You can select create thumbnail or link to image below.
When create thumbnail is selected. It takes the original image that you upload.. sets the tags on the image being inserted to the specified width/height and then links that to the full size image.

Link to image below allows you to link to another image (most commonly would be used for thumbnail/full image where this would be the full image.) If you have a different thumbnail that the full size or what a true thumbnail, you would use this feature. 

Image alignment:
Controls where the image will appear.. left, right, center, etc. of the text on the page. This will also control where the image table/description will appear as described below.

Alt text
Self explanatory
Borders.. hspace/vspace.. self explanatory.
Image size.
You can set the image to a specific size or you can specify a different width/height.

Show image description.
This will allow you to type a description.. either in plain text or html where you can have a description or credits that would appear as specified in relation to the image (below, side, top, etc). The default image table settings will allow you to set the default options for how the image table/text will appear. For example, you could make the default so the text always appears below the image and it has a black border.
Note: You can also do more advanced editing on this table from the html editor itself when you are back to editing the page. For example, you can change the text’s size, color.. even the table cell colors, etc by going to the appropriate section of the editor.

Default Table Image Settings

This is an extremely powerful feature that needs some detailed definition. The Image Table is a table that is inserted around and image that will help locate the image and subsequently the image description text, if you choose to add it. We had many requests in csNewsPro and csPublisher to have the ability to add text descriptions or picture credits to the images or pictures used in the articles.

We felt the best way to do this would be to add a table around the image and add cells where required to house the text descriptions. You will see an example of the image table below, read on.

Main Table Layout

• Width
  Type the width you prefer then choose percent or pixels. Leave blank to have the table the same size as the image (recommended).
• Height
  Type the height you prefer then choose percent or pixels. Leave blank to have the table the same size as the image (recommended).
• Cellpadding
  Specify the number of pixels you want as Cellpadding.
• Cellspacing
  Specify the number of pixels you want as Cellspacing.
• Alignment
  Then choose the table alignment, this allows you to place the image exactly where you want it. Laving this blank will not allow the text to flow nicely around the image. It is recommended that you select Left or Right alignment. This will push the image to the extreme right or left of the article body, allowing the text to flow nicely around the image.

Borders
Specify the border size in pixels and the border color. You can specify the Light Border and Dark Border as well.

Background Color
You can specify the table background color if you wish. May be a good way to draw attention to it.

Image Cell Properties

• Alignment
  Specify the desired horizontal alignment of the image cell. Centering is usually best.
• Vertical Alignment
  Specify the desired vertical alignment of the image cell. Top is usually best.
• You can specify the cell background color if you wish.

Image Description Cell Properties

• Alignment
  Specify the desired horizontal alignment of the image description cell. Centering is usually best.
• Vertical Alignment
  Specify the desired vertical alignment of the image description cell. Top is usually best.
• You can specify the cell background color if you wish.

Look at the example I have shown below, take notice that the picture description appears to be floating under the image (text in red in the article). Also note that the text in the article flows right around the image and text description without issue.