Components (WCMS Part 3)

In this post we'll look at the Component Manager, one part of the WCMS, the Webcrossing Customization Management Suite.

A "component" is a large block of page functionality. In this case, it refers to:
  • Top Level View (how the top level of the site looks)
  • Folder View (how items listed in a folder look)
  • Message View (how messages look listed in a discussion
  • Toolbar (how the list of buttons or links looks at the bottom of the page
There are between 2 and 5 options for each of these components, and you must choose one of each. Like everything else in Webcrossing, components are hierarchical. You can use the Tabular Folder View for one folder and the Sortable Folder View for another. First, choose your default Components using the Component Manager in the Control Panel. Then, within each subfolder where you want something other than the default, use the folder level Component Manager (reachable via the Edit Folder page) to choose a different Component. There are some restrictions on putting non "Classic" views inside Classic views, but generally you can arrange things in a nested fashion if necessary.

Most Components have an extensive page of settings you can reach from the Component Manager pulldown menu once you have it enabled.



The Component Manager allows for a lot of customization "bang" for very little effort. Next time, Folder and User Items.

Themes (WCMS Part 2)

Themes are just one part of the entire Webcrossing Customization Management Suite, the WCMS. A half dozen or so themes come with the install package, or you can create your own. Themes are a combination of layout and look/feel settings, and can be applied to the entire site, or to just one or more folder hierarchies, allowing for different areas of your site to look different.



Themes can be applied in two ways: choose one from the "Choose Top-Level Theme" page, or import one. Once a theme is applied, you can change any of the hundreds of theme settings to customize it.

Since themes can be exported or imported, it makes it easy to develop a custom theme on your dev server and then move it to production. You can also export a theme before you start fiddling with it, so if you want to just revert to what you had before, you can easily do that.

Theme settings are hierarchical. If you want your subfolders to be identical except for, say, the color of the text in the banner, you can easily do that. If you want your subfolders to look like entirely different sites, you can do that too. Find the "Choose Folder-Level Theme" from the Theme Manager on the Edit Folder page.

Themes can be either "inside" (the historical banner and footer) or "outside" the banner/footer, or off entirely - which provides a great deal of flexibility.



On the main "Edit Theme Settings" page for either a folder or the entire site, you'll find:
  1. A small mini preview of what your theme looks like
  2. Global settings like font size and face, any HTML to go inside the <head> tags, the global stylesheet, date formatting, buttons and icons, and some basic global colors
  3. Layout settings, which pull together all the layout settings from the other various panels
  4. Color settings, which pulls together all the color settings from the other various panels and some built-in plugins
  5. A page each for the banner, the nav, center, and right columns, and the footer. Each of these pages allows you to set dimensions, colors, etc. as well as determine what "widgets" - for lack of a better word - should be put where. "Widgets" can be:
    • Admin-defined HTML fragments, which can contain WCTL scripting
    • Content blobs from the Content Management plugin
    • Content provided by various plugins, like sidebar polls
    • Other interface widgets provided by the WCMS system such as login/logout links, the time and date, a simple round-robin image rotator, and the like
  6. A page of settings for the WCMS interface widgets
  7. Links to export and import your theme
Themes may not be the best way to go if you have to match an example site exactly to provide a seamless experience for your users going to and from the Webcrossing portion of your site, but if that's not a requirement and you don't have a design team and aren't in a position to do any scripted customization, themes are going to be a great deal of help.

Environment and financial benefits

My company, Direct Learn Services, has used Webcrossing Community for about eight years now. We use it to run short, time limited online conferences – typically, they last around four days. These are hugely popular, and I’ll describe in another post a little about how they work. But in this post, I want to illustrate a couple of points about the financial and environmental benefits of using online conferencing systems. The figures I’ll use aren’t mine – they come from an Athabasca University study, published in the Canadian Journal of Learning and Technology, Spring 2009. The paper can be seen at http://www.cjlt.ca/index.php/cjlt/article/view/521/254.

The study looked at our 2008 Supporting Deaf People online conference. This is totally online, and had 241 participants from 18 countries – a truly international event, running 24 hours a day. The cost to delegates was £50 each (at the rates at the time of the study, about 69 USD). The study examined the carbon footprint and costs which would have been generated by an equivalent physical conference.

Environmental costs

I don’t want to go into the detail of how these were calculated – those interested can refer to the paper linked above. The paper assumed that if held as a physical event, the conference would be in London (we are a UK-based company). So, calculating emission costs for airplane travel for non-UK delegates, travel within the UK for UK delegates, and hotel emissions, the total CO2 emissions would be 431.09 metric tons – or around 1.79 metric tons per participant. (The equivalent in US tons is around 475 and 1.97). So – given that emissions from attending via your computer at home or your normal workplace are very minimal indeed - this represents a massive saving. To put it into context, the average annual emissions per capita in 2005 for a US citizen were 19.52 – so the conference would represent a large proportion of that. In fact, for less developed countries, the proportion is much higher – Brazil’s per capita emissions were 1.76 metric tons – less than emitted for the attendance at a four day conference held in London!

Financial costs

The financial cost, averaged out per delegate, was calculated as 2168 USD – this was primarily travel and accommodation. This compares with the actual cost to delegates of 69 USD – another huge saving.

Was the experience as good?

It could be argued that whilst the physical event costs more, delegates would get a lot more from it. In fact, we don’t agree with this, and I will, in another post, demonstrate that levels of participation in our online conferences, and satisfaction with them, are generally higher than in physical conferences (though, of course, you don’t get the chance to spend a few days being a tourist in London!).

Conclusion

Of course, it’s not quite that simple. The reality is that had we decided to run this conference physically, it would never have happened. It would have been way too expensive in terms of both time and money. Our delegates are not highly paid businessmen used to jetting around the world. They are ordinary people, not paid massive amounts of money, and not able to afford to pay nearly 2200 USD for a short conference. And this brings us to the real benefit of online conferencing – it enables people who could not go to a physical conference to attend online and to get first class professional development, at a minimal cost to themselves and to the environment. It gives them opportunities they would not otherwise have had.

Customization without Scripting (WCMS Part 1)

Since version 5, Webcrossing has had a suite of tools you can use to customize your site without scripting. Collectively these tools are called the WCMS, which is an acronym for Webcrossing Customization Management Suite.



The WCMS allows you to:
  • Choose and customize a theme for your site, or build your own theme.
    • You can customize the layout, including turning on and off left and right columns and setting their widths.
    • You can place widgets or other content in any of 6 blocks on the page.
    • You can customize the theme colors, which carry through the entire site.
  • Choose the particular folder layout, message layout, and toolbar layout you want.
  • Turn on "Folder Item" plugins, which are things that live in a folder.  For example, calendars or blogs.
  • Turn on "User Item" plugins, which provide extra functionality to an individual user.  For example, the Message Center to help people track new messages and bookmarks.
  • Turn on Extension plugins, which provide extra functionality that doesn't fall under any of the previously-mentioned umbrellas. For example, Register Plus for enhanced profiles.
  • Access various localizations tools which allow you to either translate the interface into another language or simply change some terminology.  Like perhaps you prefer to use "topics" to the standard word, "discussions."
  • Access some optional developer tools.
  • Set WCMS permissions for host-level administrators

We have said that WCMS doesn't require any scripting, and that is true. But it doesn't preclude scripting. Administrators can use WCTL in most WCMS fields and control who else has that privilege.

The WCMS is a powerful suite of tools for the non-developer to use to customize their site.  We will talk in more detail about each of these in future posts.

Passing Variables to Commands

One of the beauties of working with WebCrossing is that it handles a lot of the backend integration for you. One of those is the ability to pass "command line" or URL parameters to any scripting method that you create in either WCTL or SSJS. In order to continue with the authentication series, we must first give a quick lesson on how to pass information through URL's into your methods.

WebCrossing URL structure is varied due to some legacy issues in the code. I will start with the older methods of sending information into the methods and move up from there. The Original URL structure is like this:

http://yoursite.com/webx?CC@xxxxx@location!key1=val1&key2=val2

The CC is the command code or the name of your macro/command that you create in the scripting files.

The xxxxxx is the "certificate" which lets WebCrossing track users across various pages without the need for cookies.

location is a unique ID of some "node" in the database which corresponds usually to a folder, discussion, or message.

The key1=val1 are & separated key value pairs of information that your macro/command can read and use for whatever you want.

The key value pairs are separated from the rest of the URL by the use of an exclamation point ( ! ).

Lets say that you wanted to display your own simple calendar and wanted your URL structure to have the month and year passed into the calendar so that a specific month/year can be displayed to the user. Your URL might be something like this:

http://yoursite.com/webx?my_cal@@!month=1&year=2011

This would mean that 2 variables would be available in the macro "my_cal". Your macro then might look like this to process these types of URL's in WCTL:

%% macro my_cal %%
%% set month form.month %%
%% set year form.year %%
%% // use month and year to display a calendar %%
%% //… left as an exercise for the reader :-) %%
%% endmacro %%

The key value pairs are passed in through an object called "form" where the dotted property is the same as the key in the URL. These are all strings when coming into your macro, so appropriate conversions may be necessary. These values are also URL encoded, so it may also be necessary to decode them to convert %20's to spaces, etc.

This same snippet of code to process the key value pairs in SSJS would look like this:

%% command my_cal(){


   month = form.month - 0;
   year = form.year - 0;
   // use month and year to display a calendar
   // etc.


} %%

You might ask why I subtracted 0 from the form.* variables. In normal Javascript, if you subtract a 0 from a string, then it will convert the value of the string into an integer type without modifying what the value was. For instance, if form.month held the string "11", then subtracting a 0 from that would convert that value into the numeric value 11 so that subsequent calculations could be done on the number.

The "New" URL structure

One of the more recent URL structures in WebCrossing allows a more SEO friendly representation of the commands and locations. This structure is laid out like this:

webx/location/macroOrCmd/cert.certificate/name.value[/name.value.. .]

The example URL above would be represented by this:

http://yoursite.com/webx/my_cal/month.1/year.2011

Note that the certificate can be eliminated completely as long as cookies are available to track the user session instead. This query-string-less version of the WebCrossing URL is much more friendly to search engines and humans alike.

Now that you know a little about the URL structure and passing information to your macros that you write, we can continue along with the authentication filters.
Dave Jones
dave@lockersoft.com
http://www.youtube.com/lockersoft