Configuration Manager

Contents

2. Configuration Manager overview

3. Areas
    3.1 Areas overview
    3.2 Add an area
    3.3 Edit basic properties of this area
    3.4 Configure theme 'Theme Name' for area n
        3.4.1 Basaar Style Style at area level
        3.4.2 Basaar Style Style at page level
    3.5 Reset properties of theme themename for area n (Area Name)
    3.6 Delete an area

4. Site
    4.1 Site configuration

5. Alerts

6. Concluding remarks

1. Introduction

1.1 Features

1.1.1 Area features

• Bazaar Style Style: Edit layout and style at Area level and enable/disable BSS at section and page level. For an introduction to BSs see appendix 4.2 Bazaar Style Style.
• Areas (general): An Area is separate part of the website. To a visitor of the website an Area appears as a site on its own. Areas can be public (accessible to everyone) or private. Private Areas (also called Intranets) are only accessible with a login name and a password.
• Set Public/Pirvate: Once an Area is created (either public or private) the choice cannot be made undone.
• Set Active/Inactive: Any time public and private Areas can be set to acitve or inactive and vice versa. Inactive means that pages and sections in that the Area are completely inaccessible, even if the URL's are known.
• Merge/Split: The content of Areas can be merged to other Areas . An Area can alos be splt in in more Areas. Merging or splitting are done in the Page Manager (edit advanced properties).
• Add: Add an Area to the site, set its name, select public or private Area, set data folder name, select theme for the Area.
• Basic properties: Edit the basic properties of the area: name, area active/inactive, add metadata to the pages in the Area, select the theme for the area.
• Theme Configuration: Configure the options for the chosen theme. The available options depend on the chosen theme. Please see the Table of contents for the available themes.
• Reset theme: Reset the theme to its default values. This feature is for pupils that learn CSS. When they have created a mess, they can copy return.
• Delete: Delete an Area. The Area must be empty, i.e. all sections and pages must be moved or deleted.
• Home: Set the Area as the 'home' i.e. starting point of the site.
• Sort order: In the list of Areas the desired order can be set.

1.1.2 Site features

1.1.3 Alerts features

1.2 Assumptions

(top)

2. Configuartion Manager overview

configurationmanager_overview.png

Explanation:

• Menu: Pane with an overview of the selectable managers:
  • Areas: Clickable link to the Area manager, discussed in 3. Areas.
  • Site: Clickable link to the Site manager, discussed in 4. Site.
  • Alerts: Clickable link to the Alerts manager, discussed in 3. Alerts.
• Workplace: Pane to manage the various options of the managers. No manager selected.

(top)

3. Areas

3.1 Areas overview

configurationmanager_areas_overview.png

The list of areas is shown, the Areas link is underlined.

Explanation:

• Add an area: Link to the Add an area dialogue. See paragraph Add an Area.
• Home icon: A visible home icon indicates the default (opening) area of the site. Greeyed out home icons indicate that these areas are not the opening ones.

  NOTICE:
  When no Home icon is set, the Area with the lowest number in the sort order will be the opening Area. For Sort order, see paragraph Edit basic properties of this area.

• Trashcan icon: To delete an area, it must be empty and.
  Deleting an area is further discussed in section 4.6 Dele an area
• Pencil icon: Clickable link that gives direct access to the theme configuration. See paragraph 3.4 Configure theme 'themename' for area nn.
• (public/private )Name of the area (nn,nn) (inactive): One clickable link that gives direct access to Edit basic properties of an area, see paragraph 4.3 Edit basic properties of this area.

  The different parts of this link refer to:

  • (public/priate): Wether this are is a public or a private area.
  • Name of the Area: The Area name will be displayed on the website.
  • (nn,nn): The first number indicates the number of the area. It is given to the area when the area is created. The last number indicates the the sort order in this row.
  • (inactive): The site is not operational, invisible and cannot be found, even when the URL is known.

3.2 Add an area

configurationmanager_area_add.png

Explanation:

• Name: Enter the name of the Area. The name may contain dicritical characters. Enter at least a space; this produces no name at all. Useful in some themes.
• Private area [ ] Mark this area as private (cannot be changed later on): A private are is a non-public area, i.e. an Intranet, only accessible with a username and password.

  NOTICE:
  Take care! Once an area is selected as a private area, it cannot be changed to a public area. Also, when an area is selected as public, it cannot be changed to a private area. This is a security feature.

• Data folder: Enter the name of the data folder for this area.

  Keep the name short and descriptive, e.g. no more than 12 (lowercase) letters and digits and no spaces or punctuation characters. Best practice is to limit the mane to lowercase letters, digits and underscores.

  If the name is not acceptable, this results in an error messge. Website@School tries to construct a suitable directory name based on your input. If this occurs, accept the suggested name or enter a name that is acceptable and click [Save].

  Every area has an associated data directory. In general files that belong to an area should be stored in this directory. Note that every user also has a personal data directory. This directory should be used for personal files only, and not for files related to the area.

• Theme: In the dropdown menu a theme for this area can be selected.

  A theme is a set of configurable properties. Together the configured properties define the visual appearance of an area. The configuration of the propetties is done in the Configure theme 'themename' for are n dialogue, see 3.4 Configure theme 'themename' for area n.

  The theme can be changed to another theme. The old theme and its configured properties are retained, so you can return to the previous theme and it's configured properties, provided you have not reset it's configuration to default values. In this way, one theme can have many configurations of its properties, thus quite differing visual appearences.

• Save: To save your results. After saving your results, the newly created area will appear in the list of areas.
• Cancel: To cancel your action and return to the Areas overview.
  

configurationmanager_area_addded.png

NOTICE:
Do not forget to add a page to the area. If no page is added, this results in a painful message for the visitors:

configurationmanager_area_addded_no_page.png

3.3 Edit basic properties of this area

configurationmanager_area_basic_properties_edit.png

Explanation:

• Name: The name of the area can be changed. The name may contain dicritical characters.
• Active area [  ] Mark the area as active: - Active: an area must be active before any files can be served.
  - Inactive: if an area is incatve, it is as if it do not exist. But, the rule of thumb is: everything is public except what is not public, so please read the notice below.

  NOTICE:
  1. In general any file in the data folder of any active public area can be retrieved by anyone as long as the name of the file is known.
  2. If an area is inactive, no files can be retrieved, even if the name of the file is known. In other words: once an area is inactive, to a visitor it appears that the area no longer exists and that neither the files appear to exist anymore.

  NOTICE:
  The same active/inactive conditions also apply to pages in areas. Once an area is inactive, to a visitor it appears that the pages in that area no longer exist. Even if the URL of the page is known, the page cannot be retrieved.

• Private area [  ] Mark the area as private (cannot be changed lateron): The checkbox is greyed out, i.e. you cannot use this option. Once an area has been selected as public or private in 4.2 Add an area, this selection cannot be undone.
• Data folder (pathname cannot be changed): Once set in 4.2 Add an area, this path cannot be changed.
• Metadata: Here valid HTML code can be added as it is used between the >head< and </head> tags. The code added here can be understood by search engines. For an overview of possibilities and egaggerated expectations see for example http://searchenginewatch.com/2167931
• Sort order: The order in the list of areas, as shown in the Areas overview and the Page Manager overview. It's the second number in the name of the Area. With every created area the number is increased with 10, enabling you to add other numbers in the row, thus creating an easy to use list.
  When the sort order numbers were changed, the user has to logout and login again to have access to the Page Manager.
• Theme: To change the theme. When changing to another theme, the old theme configuration of the area is retained, so it's possible to go back to the previous theme and its configuration.
• Save: To save your results and return to the Areas list.
• Cancel: To cancel your action and return to the Areas list.

3.4 Configure theme 'Theme Name' for area n

Each theme has a set of special options that are the same for every theme: the 'Bazaar Style Style' (BSS). This subject is discussed in appendix 4.2 Bazaar Style Style. Below we only explain the technical details and give examples of its usage.

3.4.1 Basaar Style Style at area level

configurationmanager_area_configure_theme-bottom.png

Explanation:

• Static style sheet usage [  ] Use static stylesheet file:
  • Checked: a style sheet is used, in the above screenshot it is located at program/styles/base.css. Other locations are possible.
  • Unchecked: No static stylesheet is used. In this case, if no other style is used, the browser defines the style.
• Static stylesheet: Location of the static style sheet.
• Extra style usage (area) [  ] Use extra style at area level:
  • Checked: Extra style at Area level can be applied.
  • Unchecked: No extra style at aree level. If in the next fiels style information is gevien, it's not applied.
• Extra style at area level: A small explanation about the meaning of what you see:
  configurationmanager_area_css_explanation.png

  When you are using another theme, here is the code to copy and paste in another theme. However, you learn more by typing.

  /* Demo of Bazaar Style Style sheets */ #content h1 { background-color: #FF33FF; }

  In the above screenshot, the

  • Selector is 'content with header size h1'. The content is the page content. Headers with the size h1 are the biggest ones.
  • The Declaration declares what is affected amd how it's affected: 'background-color: #FF33FF'. The Declaration always consists of a pair:
    • The Property 'background-color with the
    • The Value #FF33FF is the coloer purple. For example #000000 is black and #FFFFFF is white. Look in Google under 'hexadecimal color schemer.

  Please try it out yourself. Open the Welcome page with teh CKeditor. In the CKEditor select in the Format menu Heading 1. Type someting and save your work. It could look like:

  
  configurationmanager_area_configure_area_frugal+purple.png

  Indeed, an awful font background color.

  In the next paragraph we will do something more useful for the school.

  How to remove the Area title and replace the logo with a nice picture of the school

  Open a browser and, in the browsers menu bar and submenus, look for the option 'Page Source'. Use that option to take a peek at the source. When you use the Frugal theme, look for:

  <body> <div id="top"> </div> <div id="page"> <div id="header"> <div id="logo"> ---> In your browser the line below is veeery long, from : <a href= to </a> <a href="/index.php/area/1/Exemplum_Primary_School.html"> <img src="/program/graphics/waslogo-284x71.png" title="Exemplum Primary School" alt="image of logo" width="284" height="71"></a> </div> <div id="quicktop"> <a href="/index.php/18/About_our_school.html" title="About our school">about</a> <a href="/index.php/19/How_to_contact_us.html" title="How to contact us">contact</a> </div> <h1>Exemplum Primary School</h1> </div> ---> Here starts the breadcrum trail.

  This is the upper side of the theme Frugal. Try to make sense of the code. If you don't understand it, no problem.

  First we want to get rid of the Area title. So, copy an paste the code snipped below in the 'Extra style at area level' field under the first part:

  /* No Area title in header */ #header h1 { display: none; }

  It almost speaks for itself. Between /* and */ is comment, so you won't forget what all this great code is good for.

  Previously, we have created a nice image of the school. It's size is 1024x219 pixels. With the File Manager we have uploaded the image to the Exemplum Primayr School data folder. In the next piece of code the image is put in the header. Cut and paste it below the other code.

  NOTICE:
  'Do not forget to change the file path!

  /* Image of EPS in header */ #header { background-image: url('http://exemplum.eu/file.php/areas/exemplum/EPS-school.jpg'); background-repeat: no-repeat; border: 1px #00F dashed; height: 150px; } #logo { display: none; }

  We only show the header, breadcrum trail and sections:

  
  configurationmanager_BSS_example.png

  We have put a dotted border around the area that is covered by the '#header' area.
  Now let's remove the code below. What would happen?

  /* No Area title in header */ #header h1 { display: none; }

  Now try to position the header text. Does it look better at the right side of the image, or left? And can you get the image of the scool also filling the white area with the top links?

  
  configurationmanager_area_page_level_bss ...Yes... we know. You can do much better.

  Hints:
  

  1. A simple explanation of what has been done in the above image can be found on: http://www.elated.com/articles/css-positioning/. The URL speaks for itself.
     
  2. The most important source of information is the Static stylesheet. As you can see in the screensot, it's located at program/styles/base.css. You can find it by visiting http://exemplum.eu/program/styles/base.css. Here you see all style info of the chosen Frugal theme. Now you can find out what needs changing.
  3. There is an excellent site where you can find the basics of Bazaar Style Style. Do the free online course and become an expert. http://www.w3schools.com/css/. Have fun!
  4. Last but not least, everything you need to knwo on the subject can be found on the Internet. Look for CSS.
• Extra style usage
  [  ] Allow node level style information (Bazaar Style Style):
  • Checked: Extra style at page/section level is possible end is shown on the sections/pages.
  • Unchedked: No extra style. If style is applied in sections and pages, it is not visible on the area.
• Save: To save your results. After saving your work, you return to the Areas list.
  
• Cancel: To cancel your action and return to the Areas list .
  

3.4.2 Basaar Style Style at page level

configurationmanager_area_page_level_bss

Wether style information from pages or sections is passed to the browser or not is dependent on the checked/unchecked box at 'Extra styel usage (node).

Example:
Herbert can perfectly put style information to his page and save it. The style is not shown because his teacher has unchecked the extra style. Once checked, Herberts style becomes visible.

3.5 Reset properties of theme themename for area n (Area Name)

NOTICE:
Take care! It is a good idea to copy and paste complex style information to a safe location before resetting a teme.

3.6 Delete an area

To delete an area, in the Areas overview, click the Trashcan icon to open the Confirm delete of area Area Name dialogue:

configurationmanager_area_delete.png

• Delete: To delete your work and return to the area managers main screen.
  
• Cancel: To cancel your unwise action and return to the Page Manager main screen.
  

(top)

4. Site

NOTICE:
If you do not know what you are doing here, it might be better to leave the Site configuration untouched, because it was possible for you to get here.

4.1 Site configuration

configurationmanager_site_configure-top.png
configurationmanager_site_configure-bottom.png

• Internal version number (do not change): Website@School has two version numbers:
  - An external verion number: i.e. the release number, for example 0.90.0.
  - An internal version number: for example 2011010100. This number is composed as yyyy-mm-dd-serialnumber. It indicates the version of the database structure. As soon as the databse structure is changed, this version number also changes. Do not change the number because it's is used when installing updates.

  See also chapter Tools, paragraph 6. Update Manager.

• Security code: Its'a SALT.In cryptography, a salt consists of random bits that are used as one of the inputs to a key derivation function. The security code is a quasi random generated string. Each Website@School installation has its unique security code. This feature makes the session key unique, which adds extra security to passwords and prevents taking over a sesson. It's a security feature.
• Session name: WASDATA is the name of the session cookie. Changing this name adds a bit of extra security. After changing the name, it's necessary to log out and log in again.
• Session expiry interval (seconds, default 86400): Defines when a user session is timed out, in this case after 86400 seconds, i.e. one day. After one day of user inactivity, the session is timed out, the user is logged out and an error message is displayed.

  See also chapter Logging in and out, paragraph 4. Error messages.

  The expiry interval can be a point of discussion. It can be lowered, in which case the risk of losing work becomes higher. It can be extended which longer blocks a page in use, resulting in error messages for another users who want to edit that page.

  NOTICE:
  The best opion is to leave it as it is and to often save! your work and/or deploy some ohter activity in Website@School management, in which case the session time is renewed, every time you click something.

• Maximum allowed login attempts (default 10): After a maximum of 10 wrong logins, the user is asked if he wants to go to the 'Forgotten your password? procedure. If he persists in logging in, he is blacklisted. See items below. This is a secruity feature.
• Login failures interval (minutes, default=12): The time window in which the blacklist is consulted before deleting a users failed login attempts. So, a user has to wait 13 minutes before he can undertake a new login attempt. This is a security feature.
• Valid bypass interval (minutes, default 30): This item refers to the 'Forgotten your password?' procedure.
  After sending the first mail, containing the one time code, the user has 30 minutes to read and enter the one time code. If the time is exeeded, the one time code expires.
  After the one time code is successfully entered, a seond email is send with the temporary password. Again there is 30 minutes time to renew the password. If the timne is exeeded, the temporary password expires. This is a secruity feature.

  NOTICE:
  It's easier to remember your password than to do the forgototen password procedure. For details, see also chapter Logging in and out, paragraph 3. Forgotten your password?.

• Blacklist interval (minutes, default 8): The time a user is put on the blacklist. In this period, the system is unaccessible for that user.
• Website title: The text between the <title> and </title> tags. This tilte is only visible in Website@School Manageemnt and in the browser tille bar. The title is not visible on the site. This field may be left empty. In that case it is not shown in the browser. This is a feature for users with a braille terminal or screen reader.
• Website From: e-mail address: Enables a From: address that differs from the Reply-to: address. The From: address must be a valid e-mail address from the sending mail server.

  This is a useful feature when Website@School is installed at an ISP (Internet Service Provicer) that uses an addres like exemplum@isp.com, in case the ISP has no vadid address for the webserver at that domain. Also read the next item below.

  For details, see RFC 5322: Internet Message Format on http://tools.ietf.org/html/rfc5322.

• Website Reply-To: e-mail address: For example the webmaster Wilhelmina Bladergroen: w.badergroen@exemplum.eu, or webmaster@exemplum.eu if you prefer a functional address.
• Default language (2-letter lowercase code, default 'en'): The languae that is used in linguistic components in the login screens and on the site itself, e.g in the [Go] button in the Areas jumper.

  See chapter Tools, paragraph 3. Translate tool.

  NOTICE:
  After logging in, the user can have her preferred language, see also chapter Account Manager, under 3.2.1 Basic, under Lanuage and Redirection (where to go after login).

• Number of items per screen (in long lists): For example in long lists like the Log iewer in the Tools Manager, or the list of all users in the Accont Manager.
• Maximum number screens (in long lists): An intuitive feature to esily browse and search in lists. In stead of a long explanation observe this example:
  < 1 2 3 4 5 6...>
  Page 4 is visible now and is in the invisible 'window' that tries to keep the used page in the middle of the row for easier searching and navigation. Try it and enjoy.
• Default editor: When a user is created, this is the default editor.

  Three editors are available:

  • CKEditor: the default WYSIWYG (What You See is What You Get) editor, also the best choice for blind and visually impared. What a difference one character makes :-).
  • FCK editor: a WYSIWYG editor for older browsers.
  • Plain editor (Text Area), to edit plain HTML.
  In the user properties a user can select her preferred editor. See also chapter Account Manager, paragraph 3. Users.

  NOTICE:
  - With a new installation, the FCEditor is selected as default.
  - With an upgrade the existing acounts keeps their slected editor (FCKeditor or Plain editor). New accounts get the editor as set in Configuration > Site.
  - In case of an upgrade, the default editor is only changed to CKEditor if the FCKeditor was the previous default editor. If the Plain editor was selected in the previous version, the default editor stays Plain. Obviously the webmaster had good resaons for selecting it.

• Use proxy friendly URLs:
  - Proxy friendly: Produces a file path like, for example file.php/areas/exemplum/image.png.
  - Proxy unfriendly: produces a file path like, for example: file.php?file=/areas/exemplum/image.png

  Why proxy friendly? Many proxy servers see the question mark in the path as dynamic data which they do not buffer because 'dynamic' means the data can differ after each request.
  However, a an image is static data and thus does not change. When the quesiton mark is in hte path, the proxy server will still request the image from the server, over and over again.

  This feature is useful, for example in a shcool with Website@School installed at an ISP that has little or expensive bandwidth. If the school has a proxy server, each time pupils request a certan page with static data, the server gets it from the proxy servers cache and not from the server somewhere on the web.

  NOTICE 1:
  Proxy friendly URL's do not function at the Dutch ISP XS4ALL. See also Appendix A: XS4ALL installation. NOTICE 2:
  Advice: leave it on proxy friendly, unlesss your webserver has trouble working with virtual paths and links in pages are unaccessible. NOTICE 3:
  Do not change this setting after your Webist@School installation is already in use for some time. It could be the case that you have to update a lot of links. After thhe installation, check if proxy friendly URLS's funcion. If not, uncheck the box. Then create users.

• Fully qualified path to CLAMAV virusscanner program: Durinng the installation, the instll wizard tries to find the path to the free (not as in beer) CLAMAV virus scanner, but not other virus scanning softwarer. If found clamdscan is the first preference because of it's speed. Ohterwise, if available clamscan is used. Of one of them is found, the box (see below) is automatically checked.
  If, for some reason, the box is checked and the virusscanner does noet funcion, this results in an error message.

  NOTICE:
  It's a good idea to check the virusscanner after installation. See also chapter Installation, paragraph 4. After the installation.

• [ ] Scan files for viruses on upload: See above. If unchecked files are not scanned on upload. This is a security risk. On a schoolserver it's virtually impossible to prevent the upload of malicious material.
• Maximum number of files per upload (non Java): That says what it is. See also chapter File Manager, paragraph 3. Managing files.
• Maximum height and width for thumbnails: Thumbnails are automatically created [1] for the FCK editor in a 100 pixels square, in which the image always retains its aspect ratio. The longest side, either horzontal or vertical, is reduced to 100 pixels. This keeps thumbnailed images undistorted and image lists in a proper, well spaced row. [1] If supported by GD, see the next item.
• List of allowable extensions in File Manager(comma delimited): Only allowed extensions, entered conna separated with no spaces.

  NOTICE:
  Thumbnails are created with the GD support. See also chapter Installation, paragraph 2.7 Compatibility which image extensions are supported.

  NOTICE:
  It is a good idea to only allow images that are supported by GD. By preventing the upload of unsupported images, for example .bmp, uploading and displaying will be faster. Use a program like Irfanview http://www.irfanview.com/ to resize, convert and manipulae images

  See also chapter Editors, paragraph 2. FCK editor.

• List of extensions recognised as images (comma-delimited): Only allowed extensions, entered conna separated with no spaces.

  The FCK editor recognizes images and shows them as thumbnails when inserting. Unreckognized images extensions, for example .bmp are shown as question marks and not as thumbnails. See also chapter Editors, paragraph 2. FCK editor.

• List of extensions recongised as flash (comma-delimited): Only allowed extensions, entered conna separated with no spaces.
  The FCK editor als reckognizes the flash extension.

  See also chapter Editors, paragraph 2. FCK editor.

• [  ]Add new pages/sections at the end: Default, newly created pages and sections are set at the top of the Area or a section. When this option is checked new pages appear at the end of an Area or section.
• Save: To save your results. After saving your work you return to the Configuration Manager main screen.
• Cancel: To cancel your action and return to the Configuration Manager main screen.

(top)

5. Alerts

(top)

6. Concluding remarks

(top)