Customising layout and design

eSpaces provides allows for full control over how content is displayed, and where it is displayed on the site.

Folder display options

Display View

Within eSpaces, site structure is developed using folders, some of which can be nested inside of each other and moved around as required. How each folder appears to a visitor or site user depends on what content items are inside that folder and how the folder’s display view is configured. For instance, a folder with a number of images inside could be displayed as a gallery; a folder with files could list those files; or a folder with a page inside can be customised to display a home-page instead of an automated list.

eSpaces provides several different manners in which to display the contents within a folder. The standard views are listed below.

Note

Keed in mind that the top-level of any site is also a folder, and has the same configurability for display.

Folder view Description
Summary view Lists the title and description of the content
Tabular view Lists the content items in a table format
Thumbnail view Lists images in thumbnail form and other items below the thumbnail gallery.
Standard view Lists all content items in the folder and gives title, description, creator and date details in a compact format.
All content Displays the underlying main text from all content items inside the folder. For example, if you have a folder with several Page items, then the folder would then display the full text of each of these pages, one after the other.
Content item as default Lets you set a particular item as the home page (default view) for this folder. See Change the home page for a folder for more information.

Determining the current view

In order to determine the current view for a given folder:

  1. Browse to the given folder you would like to change.
  2. Click the Display drop-down menu.
  3. Note the highlighted view in the menu listing. This is the current view configuration.

Changing the view

In order to change the view of a given folder:

  1. Browse to the given folder you would like to change.

  2. Click the Display drop-down menu, and choose the different view you would like to apply.

    Folder display menu
  3. The page will reload and display the new style of view. Other visitors to the content item will see this change immediately.

Each type of folder view can easily be changed as required, especially in order to try out other appearances.

Deselecting a default view

If a folder has a default view configured, you can de-select this by simply selecting another Display View. If you’d like the default appearance for a folder to be restored, choose Summary view.

Change the home page for a folder

By default, eSpaces displays a list of the contents of all folders and a brief description. In order to change this view, you will need to create a new page and set the folder to use this page as the default view for the folder.

Note

If you’re ever curious or unsure about how a folder is configured for display, click the Display drop-down menu and note the selection. This explains whether a folder is configured as an automated listing or with a default view set.

  1. After logging in to the portal, click into the folder you’d like to change. Make sure you’ve already created a page to set as its default view.
  2. Click Display ‣ Select a content item as default view.
select_content_item
  1. Select the item that you would like to be displayed as the default page of the folder and click the Save button.
  2. You should now be able to see the page appear as the default view for the folder. Keep in mind that you will need to publish this page for other users to see it.

Sorting a folder

Sorting manually

The contents of a given folder are displayed in numerous ways across the site, including in navigation portlets, as top-level tabs, and in folder listings displayed on pages. There will come times where the ordering is incorrect and you’d like to change this. To manually adjust ordering:

  1. Browse to the folder that contains the content to be reordered.

  2. Click onto the Contents link.

  3. Click and drag the handle at the far-left of any content item up and down to reorder the content. Note how your cursor changes into an up-down arrow when hovering over the handle. The content can be ordered in any fashion you would like.

  4. Once finished, click your browser’s reload button, or browse to another folder where a listing appears. Notice how the order has now adjusted to suit your changes.

  5. Repeat as required if the ordering isn’t quite right

    Note

    If there are many content items in the folder, the Contents view may paginate the listing into groups. If this is the case, you can view the complete listing using the Show all items link at the bottom of the page.

Sorting based on criteria

eSpaces provides a helpful view for re-ordering the contents of folders, and allows sorting on a number of different criteria, including title, modification date, and more.

Note

Remember that folder ordering is not automatically applied. You will need to follow this process whenever the order should be updated.

To access the sorting view:

  1. Browse to the folder that you wish to re-order. Ensure you are looking at the View tab, which will be the main folder view.

  2. Click to Actions ‣ Sort folder to access the sorting controls.

    Sort folder menu
  3. Choose the criteria you wish to sort on, including enabling the reverse sorting option, if so desired.

  4. Click Sort to complete the process.

  5. Inspect the results in the contents listing. To re-order contents, click back to the View tab and start again.

Enabling next/previous folder navigation

To make viewing the contents of a large folder more intuitive, you may wish to enable the ability for users to skip forwards and backwards through a folder’s contents. This is called the Next/Previous Navigation feature and enabling this for a folder displays controls to jump to the next or previous page when looking at a folder’s contents.

To add enable next/previous navigation:

  1. Browse to the folder you wish to apply navigation to.
  2. Click the Edit tab.
  3. Click the Settings tab.
  4. Enable the checkbox marked Enable next previous navigation.
  5. Click the Save button.

Managing portlets

What are portlets?

Portlets are small panels of information that you can display to either help your users or improve page display. If you’ve used eSpaces, you’ll already have used portlets - likely without even knowing. Here’s an example:

Portlet example Manage portlet

The area highlighted in red contains the portlets. Portlets may exist (by default) on the right hand side of the page. On the example image, you can see a Navigation portlet on the right.

You can customise your portlets to suit by adding static information, live updated listings (such as events, news, or collections), RSS feeds from external sites, flexible navigation, search and more.

Behaviour and inheritance

Portlets applied to a given folder (or the top-level of the site) will, by default, be shown for all content items beneath that folder. For example, if a navigation portlet is configured on a folder called News, then all news items inside that folder will also see the same portlet. It is possible to override this behaviour on sub-folders or individual content items, however.

Permission to change portlets

By default, portlet management is only available to users that are Site administrators. However, for eSpaces this restriction has been relaxed to allow content editors the ability to control their portlets.

To determine if you can add or edit portlets, look for the Manage portlets link. If you see it, then you have sufficient permission. If not, then you’ll need to contact a site administrator to have them make the changes for you or otherwise give you access.

Adding new portlets

To add a new portlet:

  1. Browse to the area of the site the portlet should be shown. For example, if you add a portlet at the top-level of your site, it will appear everywhere, except when overriden.

  2. Click the Manage portlets link at the bottom of the page, or at the bottom of either left or right portlet column.

    Manage portlet
  3. On the Manage portlets page, click the Add portlet menu at the top of the column you’d like to add a portlet to.

  4. Examine the different types of available portlets. Most are simple and self-descriptive as to what that they provide. For example, if you want to add some static content like images or text, then choose Static Text Portlet. Feel free to experiment here. You can easily remove new portlets later.

  5. Click the name of the portlet you’d like to add.

  6. On the next page, configure the portlet accordingly. Each portlet is different in their options. Configuration fields will customise how the portlet and its information are displayed. You can come back at any time to adjust settings further.

  7. Once you’re ready, click the Save Settings button to create the portlet.

  8. Click the Return link of the Manage portlets page to go back to see your results. You may need to clear your cache (or hold the Shift key and click your browser’s Refresh button) to see the change.

Editing existing portlets

Edit portlet

To edit an existing portlet:

  1. Browse to the area of the site that the portlet is applied to. If you can’t find specifically where this is, don’t worry - just browse to somewhere you see the portlet as the site directs you accordingly.
  2. Click the Manage portlets link at the bottom of either left or right portlet column.
  3. On the Manage portlets page, click the name of portlet you’d like to modify. In the example given here, you could click Calendar or RSS: ABC News to modify the options.
  4. Change the options you’d like to modify. Each portlet’s options are different, so we encourage you to experiment with different configurations. You can always come back.
  5. Once you’re ready, click the Save button to save modifications to the portlet.
  6. Click the Return link of the Manage portlets page to go back to see your results. You may need to clear your cache (or hold the Shift key and click your browser’s Refresh button) to see the change.

Managing portlets

You can also re-order, hide, override and remove portlets from your site or from a specific area on the site. To manage your portlets:

Edit portlet
  1. Browse to the area of the site that you’d like to manage portlets for.

  2. Click the Manage portlets link at the bottom of the portlet column.

  3. On the Manage portlets page, you’ll see a list of existing portlets. There are several actions you can now perform:

    To re-order portlets:

    Use the up and down arrows in the listing. Up arrows move the given portlet up one position, and down arrows move the given portlet down one position.

    To hide a portlet:

    Click the Hide link next to the portlet’s name. This is a safe alternative to removing a portlet if you think you might want to show it again at some point.

    To remove a portlet:

    Click the 'X' icon next to the portlet’s name. This will remove the portlet and is not reversible. If you think you might need the portlet later, we suggest you just Hide it.

    To override the portlets in an area:

    Click the relevant drop down menu under 'Block/unblock portlets' and choose the option you’d like. By selecting Block under Parent portlets for instance, you will prevent parent folders’ portlets from being displayed here. Remember that by default, portlets from parent folders are applied to child content.

  4. Once you’re done managing your portlets, click the Save settings button at the bottom of the column.