Tutorial - Community Portal  

Overview

Click here to open up the finished siteIn the samples section, there is an example of Faketown Community Portal. The Portal has a Church section, GAA section, a business directory, an education section, and otherpages such as a gallery & messageboard. The general layout of the site is as follows:-

  • Church

    • Church Notes

    • Mass Times

    • Contact

  • GAA

    • Club News

  • Business

    • Directory

  • Education

    • Primary School

    • Secondary School

  • Attractions

  • History

  • Village Notes

  • Messageboard

  • Poll

  • Tidy Towns

  • Gallery

  • Accomadation

As you can see, there is quite a bit of content here. You may find that the most time consuming part of setting up your site is creating a list such as above. It takes time and patience to define in your head what shape the site should take but once you have done this, its very quick and easy to create your site. For the duration of this tutorial we will assume that we want to build the configuration as defined above.

OK now that we have the structure of the site clear, lets build it!

Step 1: First of all, we need to login to the admin section of Clear-Site as the 'admin' user. The first screen we will see after we login will be the Admin Control Panel Centre. As we are starting off from fresh there won't be too much here of much interest to us yet and it will probably look a little like this. First of all, lets update our personal details. This will ensure that our correct name will appear for content list stories. See here for details on how to update your personal details.

Next lets update our homepage. From the menu on the left, select content. This will bring up your site explorer. It looks pretty bare at the moment but don't worry, it won't be for too much longer. Click on the blue 'Home Page' link at the top of the explorer. Now you will be presented with the edit homepage screen. Using the editor tools described here, create the content for your home page. If you wish, you may upload images first and import them from the editor. Its completely up to you. 

For now you shouldn't worry too much about the content on your homepage, we can come back and change it any time we like. Once we click on the 'Update Content' button, we will be returned to the site explorer where we can have a look at our changes by clicking on the magnifying glass under options for home page.


Step 2: Now lets build the backbone of our website as described in the list at the top of this tutorial. We can see that Church, GAA, Business & Education all have sub categories. For this we will need to use Bases. (See here for information on sub-dividing your site). 

So lets start off by creating a new base site. From the 'Content' menu, select 'Add New'. Choose 'Base' from this list. This will open the add new base screen. Enter 'Church' as the Base Name. You can leave the ticker text blank for now. Using the tools described here, fill out the editor with your content. Click here to see what I've done. When we click on the 'Add Base Node' button, we will be presented with the add new ... screen. This time select Content from the list and now we have the add new content list screen. Enter 'Church Notes' for the Content Name and click on 'Add Content List'. This will bring us back to the site explorer screen which should now look like this. Slowly but surely its beginning to look like the list above.

OK so now we have 'Mass Times' & 'Contact' to add to the Church section. In the site explorer screen click on Church. This will open up the edit base screen. Click on the 'Add New' button in the top right. This will once again open up the add new ... screen. Select Content again and this time name the list 'Mass Times'. Add the new content list and do the same as above for the contact page. Our site explorer should now look like this


Step 3: Use the exact same techniques as described in step 2 above to create the GAA, Business & Education base sites (and their sub-categories). Now the site explorer should look like this.

Step 4: Of the remaining 8 items on the list, 6 of them (Attractions, History, Village Notes, Tidy Towns, Gallery & Accomadation) are all Content Lists. Click on 'Add New' from the Content Menu and select content from the list. In the Add New Content screen enter 'Attractions' as content name and add it.

Do the same for the remaining content lists (History, Village Notes, Tidy Towns, Gallery & Accomadation).

Adding up the messageboard is very similar, except select messageboard from the 'add new ... screen' and give the messageboard the name 'Messageboard'. Ditto for the Poll. Now our explorer should look like this

You'll probaly notice that the structure of the configuration as it stands is slightly out of sync with the list above. (Messagebpard & Poll are out of position). Use the arrows to the right of the messageboard & poll to move these items up to their correct position. See here for information on how to move menu items around. Your explorer should now look like this.

For information on how to add a poll to a poll list, see here.


Step 5: Before we actually add up some content, it might be an idea to upload some images to include in the content itself. This doesn't have to be done now but for this tutorial lets do it now. 

Images are uploaded through the upload screen. You can get here by selecting 'Uploads' from the 'Content' menu. Once uploaded we can then use images in our editor to create rich content. You may upload as many images as you like but be wary of the size of them as large files will take longer to display and the public page will load slower. We can view the image properties or delete unwanted images from the image manager screen


Step 6: So now that the main structure of our site is in place and we have some images uploaded, we can go about filling in the actual content. We can get back to the site explorer by clicking on 'Content' from the main menu. Working from the top down, we can see that the first content list is Church Notes. Click on this in site explorer and this will open up the edit content list screen. The list should be empty at the moment. Click on the 'Add New' button on top of the screen. The add new content item screen will then open up. Give the story whatever headline you wish and fill out the editor using the tips provided here. To add more stories to this list, repeat the setps outlined here.

An important aspect of Clear-Site to remember is that if a content list contains just one story, then the list itself will not be shown in the public section and the user will automatically be redirected to the story itself. 'Mass  Times' and 'Contact' use this feature because there is no need to have a list for just one story. 

The rest of the content lists in our configuration will be built using the exact same techniques as above. So by the end of this step, we should have a populated (but not necessarily finished) site explorer. 


Step 7: OK so this website is beginning to fill out but we have neglected one important feature up until now and that is style. We need to put our own style on the site and this is achieved through the style centre. To get here, select 'Style' from the main menu. First of all you should enter the name of your organisation or business in the 'Site Title' section. I have entered 'Faketown Community Online' here. 

The other style options are completely up to yourself. Check out the style centre help section for information on the different parameters here. If you use style images then much of the Colours Fonts & Styles section will not apply. For the sake of the tutorial we will examine a few different options here.

First of all lets say we're not going to use style images. Uncheck all 3 images boxes under 'Images'. Under Colours Fonts & Styles select whatever details you want. I've selected Verdana as my Font, a blue colour (#0000CC) for the primary colour, a navy colour (#000066) for the secondary colour, a light blue colour (#6666FF) for the highlighted colour and a yellow colour (#FFFF00) for the text. I've also enabled the blending & highlighting options. For the time being, I'm going to leave all 3 options under Misc (breadcrumbs, Smart-Menu & Hitcount) checked. After clicking on the Update Style button we can now see that our homepage looks like this.

Ok so now lets switch on the style images. First of all we need to create and upload 3 suitable images. In an image editing program (such as photoshop), create 3 images. A header image (should be 760 pixels wide and between 100 & 200 pixels high), a side image (for the background for Smart-Menu, should be no more than 114 pixels wide - doesn't matter how high).and a background image (doesn't matter how big it is but the smaller it its the more quickly the public pages will load. Below is the 3 images that I have created for my portal.

Save your 3 images to somewhere on your pc and upload them from the style centre. Finally tick the check boxes for the style images. and save the style settings. Magically your home page will now look like this.


Step 8: So thats the bulk of the site built. We've built our structure, uploaded images, added content and created our own style settings. Portals however require more than just initial set up. They also need maintenance and regular updates. To help with the administration of our site, we should add up some users.

We can delegate the church section to somebody in the church and the GAA section to a member of the GAA club. The user will have access to add up new content items and edit existing items. They can screen and approve suppressed messages for the messageboard & guestbooks that they have access to. Basicly the admin user can set up these users and assign their permissions and then (in theory) doesn't need to worry about the assigned section. Of course the admin user has permission to update that section too but the idea is for the new user to assume responsibility for the section.

For the sake of the tutorial lets say that we have identified a user to look after the GAA section of the site called Philip O'Brien. We want to add up 'Philip' and give hom access to the GAA->Club news section. From the Add New User screen we enter in philips details and assign him a password to login with. In the permisssions box select  and highlight 'GAA-Club News' and add the new user. Now when we view Philip's details in the user details screen we can see that he has permission to the GAA scction. See here for a screenshot.

If Philip was to log on with the password that the admin set up for him and go to the site explorer, he would see something like this. As you can see this is a restricted subset of the admin explorer (See here).

Philip now has control over the 'GAA' base page and the 'Club News' Content List. He can add & delete stories from the list and update existing stories. If the admin was to add a messageboard to the GAA base site, then Philip could also manage suppressed messages.

can set up as many users as you like, and they are a good way of delegating tasks in the site so that the admin doesn't need to do everything. Clear-Site is designed to limit the damage that a user could do by accident and for this reason a user may not add new pages or delete existing configurations. Only the admin can do this



By applying the techniques and tricks in steps 1-8 above, our site can grow and change over time. The site will need ongoing monitoring also as in step 4 we set up a messageboard with censorship. We should log in regularily to review messages waiting to be published. 

The most difficult part of setting up a site most often can be deciding on the structure of the site (i.e. coming up with the list from the top of this page). Once we have this defined, its quite easy to build in Clear-Site. By following the steps in this tutorial, you should be able to apply the same practices to your own site to achieve success for your website.

Click here to view the final site.