Website Display
Custom Display Shell
- The Display Shell uses the HTML Editor to create a custom look-and-feel.
- The Display Shell is the standard admin-side Editor.
- The Display Shell includes three "special" DDFs (Dynamic Data Fields).
- Navigation Row is optional, but recommended for any Website with more than one tab.
- The Website will replace the <(Navigation Row)> text with a row containing labels and hyperlinks to all visible web pages in the order listed on the Websites: Setup tab.
- The display style of the navigation row is defined in the standard CSS inline style section.
- Profile Info is optional and not applicable for Web Sites that don't require User Authentication.
- The Website will replace the <(Profile Info)> text with the First Name and Last Name of the Profile who is currently logged into the site.
- Page Content is required.
- The Website will replace the <(Page Content)> text with the custom content as defined on subsequent tabs within the Websites area.
- All HTML before <(Page Content)> will become the shell's header.
- All HTML after <(Page Content)> will become the shell's footer.
- Custom HTML Attributes
- Text entered here will be inserted into the Website's tag.
- This is useful for custom javascript, meta tags, etc.
- This requires advanced knowledge of HTML.
- Custom Inline Style Attributes
- This CSS is used to define standard and custom styles used within the Website.
- In addition to the general CSS styles for HTML elements such as body, a, table, p, etc., the display shell has a few "special classes" with specific significance:
- a.nav - Style of navigation row hyperlinks
- a.selectedNav - Style of the currently selected page's hyperlink in the navigation row
- title - Style of page titles
- subtitle - Style of page subtitles
- header - Style of section headers on a page (typically, this is light text shown against a dark background)
- highlight - Style of highlighted text
- subheader - Style of text below section headers
- error - Style of error messages
- text - Style of regular text (this can also be defined in the body style)
- fine - Style of fine print text
- table.nav - Style of the navigation row table
- table.nav td.selected - Style of the cell of the currently selected page within the navigation row table
- table.page - Style of the page's main table (of the display shell)
- table.section - Style of each section's table within a page
- table.form - Style of tables that contain forms within a page
- table.data - Style of tables that generate dynamic data, e.g. the Events List
- table.data th.c1 - Style of column 1 header in a dynamic table
- table.data th.c2 - Style of column 2 header in a dynamic table
- table.data th.c3 - Style of column 3 header in a dynamic table
- table.data th.c4 - Style of column 4 header in a dynamic table
- table.data tr.dataRow - Style of data rows in a dynamic table
- table.data tr.dataRowSelected - Style of the data row being hovered over in a dynamic table
- The use of CSS styles and the above special classes allow wide flexibility over the look and feel of the Website display shell.
Was this article helpful?
- Yes
- No
- 0 out of 0 found this helpful
Have more questions? Submit a request
Related articles
- Session SCHEDULER (in Speaker and Session Management)
- Import Room Reservations
- Extended Display
- Site Setup (Event Website)
- Event Websites
Comments
- 0 comments
- Please sign in to leave a comment.