Microsoft Content Management Server Web Author Dynamic Console

Stephen Huen

Rate me:

4.56/5 (9 votes)

22 Jan 2004CPOL3 min read

43.1K

A dynamic Web Author console for use in Microsoft Content Management Server (CMS).

Download source files - 64.5 Kb

Introduction

This collection of files creates a dynamic Web Author console for use in Microsoft Content Management Server (CMS). This dynamic console does not take up space in your web page. Authors click on an icon to expand or collapse the console. It contains 4 different themes (even a matrix theme!) for different look and feel. Users can design their own theme by customizing the included stylesheet.

File Description

Theme1.gif, Theme2.gif, Theme3.gif, Theme4.gif.
Screen dumps showing the dynamic console in various themes.
UserControls/PublishingModeLink.ascx.
This is an user control for displaying "Switch to Edit Site" and "Switch to Live Site". The switch is taken out of the console for more flexible and better user friendly placement.
UserControls/DynamicConsoleTrigger.ascx.
This is an user control for displaying an icon. When user clicks on the icon, the dynamic console shows or hides itself.
Console/DynamicConsole.ascx.
This is an user control for the dynamic console content.
Console/DynamicConsole.js.
This is the support JavaScript file for the dynamic console.
images/console/on.gif, images/console/off.gif.
These are the icons for (3).
Style/console.css.
This is the stylesheet for the dynamic console feature in Theme.gif.
Extra stylesheet and image files are available in the Theme directories.

Installation Procedures

Copy Console/* into your console directory.
Copy both user controls into your user controls directory.

In the page or user control where you would like to show the Publishing Mode link and console trigger icon, register the user controls. For example:

ASP.NET

<%@ Register
TagPrefix="CMSUser" 
TagName="PublishingModeLink"
Src="../UserControls/PublishingModeLink.ascx"
%>
<%@ 
Register
TagPrefix="CMSUser" 
TagName="DynamicConsoleTrigger"
Src="../UserControls/DynamicConsoleTrigger.ascx"
%>

In the HTML tags where you want to show the link and icon, reference the controls. For example:

ASP.NET

<td align="right" nowrap><CMSUser:PublishingModeLink 
id="PublishingModeLink" runat="server" /><CMSUser:DynamicConsoleTrigger 
id="DynamicConsoleTrigger" runat="server" /></td>

Copy console.css into your stylesheet directory or append the code into your site stylesheet. Use console.css in the Theme directories for other themes.
Copy images/* into your images directory. Check the Theme directories for extra images.
Check the Theme directories for the stylesheet to use. In the stylesheet, you need to specify the positions of the dynamic console. For example, the following says the console is positioned at 120 pixels from the top of the container/browser window and 10 pixels from the right of the container/browser window:
HTML
```
.StyleConsoleLayer {
...
right: 10;
top: 120;
...
}
```
The following says the console is positioned at 120 pixels from the top of the container/browser window and 10 pixels from the left of the container/browser window:
HTML
```
.StyleConsoleLayer {
...
left: 10;
top: 120;
...
}
```
If your site does not use a stylesheet or you would like to keep console.css as a separate file rather than appending the content into your site stylesheet, insert a stylesheet reference in the header section (<head></head>) of your page templates. For example:
HTML
```
<head>
....
<link rel="stylesheet" 
href="../style/console.css">
....
</head>
```
Also change references to the console control from the default one to the dynamic console.
Rebuild your site solution in Visual Studio and you are all set.

Note: By default, MCMS will render a base tag with the href of a template so that the relative links to images, scripts or stylesheets will resolve based on the template URL instead of the Posting URL seen in the browser. All the links are formatted relatively based on this assumption. If this is not the case, you may need to reformat the relative links or change them to absolute links.

History

V1.0 (2004.01.17) - New.
V1.1 (2004.01.23) - Error console now shows up correctly with updated styles.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Written By

Stephen Huen

Software Developer (Senior)

Canada

A Microsoft Certified Professional Developer and Technology Specialist.

Experience and expertise in SharePoint 2016 / 2013 / 2010 / 2007.

Role ranges from a developer in a multi-person team to a solution consultant with expert-level skills, leading a project to completion status.

Proven experience working effectively in a team environment and a self-managed environment.