User Guide
C1 CMS user interface
C1 CMS is 100% web-based and is accessed through Chrome, Internet Explorer, Firefox or Safari. You open your browser, log on with your username and password and you will then be able to insert content on your website.
Log on to C1 CMS by typing the address of your website followed by /Composite. For example: www.contoso.com/Composite
How to log on to C1 CMS:
- Open a browser and type in the website address (<URL>)/Composite.
- Now the Start page will be shown.
Figure 2: C1 CMS’s Start page
- Click the “Start…” button.
Figure 3: Login page
- Now you can log on with your username and password and you will access the administrative console.
The CMS Console consists of the perspectives each featuring the tree view the browser view.
The tree view (on the left) and the browser view (on the right) are located on the navigation tab always first in the tab row. This tab cannot be closed.
Figure 4: The two main views in the CMS Console
On the left vertical panel, different perspectives are presented by their corresponding icons.
A website is both built and maintained through the same administrative console - the CMS Console, but the various tasks are organized within separate perspectives. For example, all pages are placed in the Content perspective and all tasks concerning user administration and permissions are placed in the Users perspective.
It is possible to select which perspectives users should have access to.
You can also expand the perspective pane by clicking the "sandwich" button in the top left corner. This will give you a better overview of the perspectives.
Figure 5: The Perspectives pane expanded
On the left pane of the navigation tab, there is the tree view that allows you to navigate, and work with, the elements of the current perspectives. For example, on the Content perspective, you can navigate and manage websites, web pages and website-related items.
The browser view on the right pane allows you to preview the content of the element currently selected in the tree.
For example, if you select a page in the tree, its content will appear in the browser view.
When you edit an element in the tree, it opens in its editor on a separate tab, which takes up almost the entire area of the CMS Console.
Figure 6: Pages opened in the editor each on its own tab
You can click the navigation tab to switch back to the tree / browser view, or click any other tab of the currently opened element.
The toolbar buttons are always relevant to the current element selected in the tree or opened in the editor on its own tab.
In each perspective, there are context sensitive toolbars and menus.
When you select an item, the toolbar will only show the menu commands associated with the selected item.
Figure 7: Context sensitive toolbars
When you select an item, and right click, a menu will appear. These menus will typically contain more menu commands than the context-sensitive toolbar.
Figure 8: Context-sensitive menus
The menu commands that are shown are also dependent on the single user’s permissions.
The Content Perspective is the most used perspective for editors.
The Content perspective contains the pages of one or more websites arranged in a tree structure that reflects the structure of actual websites. The Content perspective is examined closer in the Pages section.
Figure 9: Navigation perspectives
Navigation perspectives | |
Content | The pages of the website arranged in a tree structure |
Media | In order to insert a media on a webpage, the media has to be uploaded to the system first. The Media perspective consists of the Media archive, which displays all the uploaded medias that can be used, when you are editing pages from the content editor. It is possible to upload single, as well as multiple media files, from within the Media perspective. |
Data | From within the Data perspective you can create different kind of datatypes. A datatype is a preconfigured structure for data. A datatype can be either global or local (Page data folders) or can be used for meta data. |
Layout | Page types, page layout templates and page template features are placed in the Layout perspective. All pages are based on a page type, which may limit what templates are available, define page type specific meta data and influence what type of subpages you can create. |
Functions | The Functions perspective gives developers the possibility to create different kinds of functions. They could be Razor, User Control, C#, XSLT, SQL, or Visual functions. |
System | This perspective features the overview of available and installed packages, language administration which allows you to add new languages to the solution, user administration with all users assigned to user groups, full access to all the website files, showed in the same structure as on the web server, and the server log viewer. |
Because the Content perspective is most commonly used by end users, we will take a brief look at its structure.
All pages are placed in the Content perspective. Pages are arranged in a tree structure that reflects the logic design of the website. Pages at Level 1 in the tree structure are typically shown in the top navigation on the front-end. Pages at Level 2 in the tree structure will typically be shown as the sub-navigation on the front-end. Depending on the actual design there is an infinite amount of possibilities for sub-navigation structures.
Figure 10: The page tree structure in the CMS Console matches the structure on the front-end.
When you want to edit a page, simply select the page in the tree structure and click “Edit Page” on the toolbar. You will now see the page tabs that belong to this page.
Figure 11: Each page has tabs with various editorial possibilities
Page tabs in the working area hold different information about the single pages. A standard page has three tabs which offer you editing options of various page settings, editing of content and the possibility to see a preview of the selected page. The options under the different page tabs will be examined in the following sections.
Each page has 3 or 4 page tabs and each of these tabs has various editing possibilities. The fields and possibilities under each tab will be examined in the following sections.
Page tabs | |
Settings tab | Information about the page type, publication date, friendly URL and other general settings. |
Content tab | HTML editor – allows you to insert and edit content. A page can have several content areas which all can contain diverse content. |
Preview tab | Displays a preview of the selected page. |
Meta data | Custom specific fields. The options under this field will vary from each implemented solution. |
Multiple pages can be open at the same time
The user interface allows you to have several pages open at the same time. You can also navigate between the different navigation perspectives without having to close the pages or other elements you might be working on.
Figure 12: Several pages can be open at the same time
If you select a page in the tree, its content shows up in the browser view.
With multiple pages opened in the editor, if the page is selected in the tree, its tab gets focused given the page is opened in the editor.
Figure 13: The page linked to the editor tab and relevant buttons on the toolbar
This works the other way round, too. When a tab with a page is selected in the CMS Console, the corresponding page is automatically selected in the tree (although not seen). You can see it when you switch back to the Content tab.
The main toolbar always shows buttons (for example, Publish) relevant to the current element selected in the tree.