Site Object

This article provides detailed design information about the site design object, its configuration options, and how to design one. To learn more about what a site object is and how it is used, refer to the Sites article.

Properties

The Properties section allows designers to modify the primary site configurations that determine how users experience the site.

Field Description
Name The name is displayed to users in the browser title bar.
Description An optional description that is displayed to designers only.
Web Address Identifier The section of the site's URL that identifies it.
  • It appears in the URL and in log files.
Show site name on navigation bar Option to show the site name on the navigation bar.
Show Tempo link in navigation menu Option to show or hide the Tempo link in the navigation menu.
  • Designers can select to always show it, never show it, or for one or more selected groups.
Show Record News Option to show or hide the news view on records.
  • When enabled, all records displayed in the site will include the news view. In addition, the latest news will be displayed on the summary view when viewing user records.
Show Task List (Mobile Only) Option to show a default task list in the Appian for Mobile Devices application.
  • When enabled, a list of all tasks assigned to the user is presented from the slide out menu in the Appian for Mobile Devices application. Mobile users can access any offline-enabled tasks from this list, even when they are not connected to the Internet.
  • Designers can select to always show the task list, never show it, or show it only for select groups.

Pages

The pages section allows designers to add, remove, modify, or re-order the pages that are displayed in a site. Designers can configure up to 5 pages per site.

Each page within a site can be configured with an action, a report (task report or Tempo report), or a record type.

Field Description
Title The page title is displayed to users in the navigation bar.
  • The title is a required parameter.
  • Designers can configure the value as a static string or as an expression.
Web Address Identifier The section of the URL that identifies the page.
  • The web address identifier appears in the URL and in log files for network devices and servers.
  • The value must be unique across pages within the same site.
Width Determines the width of the content area for the page. Default is standard.
Icon The icon displayed to users in the navigation bar.
Page Type Indicates whether the page will contain an action, report (Tempo or task report), or record type.
Page Content The name of the design object for the page content.
  • The list of available objects based on the page type selected.
  • Actions must have a start form to be used in a site page.
  • Related actions based on quick tasks are not supported in site records.

Branding

The branding section allows designers to customize the look and feel of a site. These configurations can be set as static values or dynamic values using expressions for greater flexibility.

You can preview your configurations for the site logo, colors, page icons, navigation bar style, and button shape in the Branding Preview.

Field Description
Logo The logo appears on the top right corner of the site and is automatically resized for use in the site.
  • The logo file should be a JPG, PNG, BMP, JPEG or GIF file with a transparent background and must be less than 100KB.
  • The default logo is the Appian logo.
  • Use the document option to use an image within an Appian Document folder or Knowledge Center
  • Use the web address option to point to a static image hosted on a separate web server.
    • Use this option when your company web assets, such as logos, are hosted on a content delivery network.
  • Use the expression option to dynamically display different logos based on a expression rule.
    • Expressions that resolve to a document will use that document.
    • Expressions that resolve to a integer will use the document that has the integer as the id.
    • Expressions that resolve to a text value will use the text value as the web address.
    • The default logo will be shown if the expression does not resolve to a valid document, integer with corresponding document, or web address.
Logo Alternative Text The alternative text provided in this configuration is used for the logo's alt attribute and announced by screen readers. The value should describe the logo to visually impaired users, including any text that is part the logo.
  • The default value is `Logo`.
  • Use the static option to specify alt text when the Logo is set via either the Document or Web address options.
  • Use the Expression option to specify alt text when the Logo is set via the Expression option
Favicon The favicon (short for "favorite icon") is the small icon that appears in the browser tab or URL bar.
  • Provide an ICO file with sizes 16x16 and 32x32 that is less than 100KB.
  • The default favicon is the Appian "A" icon.
  • Use the document option to use an icon image within an Appian Document folder or Knowledge Center
  • Use the web address option to point to a static image hosted on a separate web server.
    • Use this option when your company web assets, such as logos, are hosted on a content delivery network.
  • Use the expression option to dynamically display different icon images based on a expression rule.
    • Expressions that resolve to a document will use that document.
    • Expressions that resolve to a integer will use the document that has the integer as the id.
    • Expressions that resolve to a text value will use the text value as the web address.
    • The default favicon will be shown if the expression does not resolve to a valid document, integer with corresponding document, or web address.
Button Shape The shape applied to all buttons on all pages in a site. This includes all buttons for:
  • record view tabs
  • record actions
There are three options for button shape: squared, semi-rounded, and rounded. Squared is selected by default.
Navigation Bar Style The style of the navigation bar of the site. The style determines if there are icons displayed with page titles in the tabs, which side the logo is on, and the selected highlight color. There are two styles; "HELIUM" and "MERCURY"`.
  • The "HELIUM" style displays the logo on the right and icons in the page tabs.
    • The default style is "HELIUM".
  • The "MERCURY" style displays the logo on the left and no icons in the page tabs.
    • If there is a single page on a site, this style displays no page tabs.
The navigation bar style only applies to desktop and mobile browsers. It will not be reflected in the Appian for Mobile Devices application.
Navigation Bar Background Color The background color of the navigation bar of the site in web. The color of the app header, tab bar and status bar in iOS. The app header bar and navigation bar in Android.
  • The default value is #46708c.
  • Use the hex code option to provide a valid 3 or 6 digit hex code or use the color picker by clicking on the color preview bar.
  • Use the expression option to dynamically display different colors based on the expression rule.
    • The default navigation bar background color will be displayed if the expression does not resolve to a valid hex code.
Selected Highlight Color The color of the selected tab or selected tab's underline in web and iOS.
  • The default value is #083d5c.
  • Use the hex code option to provide a valid 3 or 6 digit hex code or use the color picker by clicking on the color preview bar.
  • Use the expression option to dynamically display different colors based on the expression rule.
    • The default selected highlight color will be displayed if the expression does not resolve to a valid hex code.
Accent Color Affects the color of many elements in all interfaces, including buttons, links, active field border colors, milestone bars, section titles, etc.
  • Avoid grayscale colors (black, white, and gray) that are similar to colors used for interface elements and avoid green/red colors that are used to indicate positive/negative values.
  • The default value is #1d659c.
  • Use the hex code option to provide a valid 3 or 6 digit hex code or use the color picker by clicking on the color preview bar.
  • Use the expression option to dynamically display different colors based on the expression rule.
    • The default accent color will be displayed if the expression does not resolve to a valid hex code.
Loading Bar Color The color of the bar at the top of the page that indicates when the system is processing.
  • Select a loading bar color with sufficient contrast against the navigation bar color to ensure users notice it.
  • The default value is the accent color.
  • Use the hex code option to provide a valid 3 or 6 digit hex code or use the color picker by clicking on the color preview bar.
  • Use the expression option to dynamically display different colors based on the expression rule.
    • The accent color (default) will be displayed if the expression does not resolve to a valid hex code.

You can configure a custom typeface for sites from the Aministration Console. Typefaces are universally applied to all sites on the environment.

Designing sites

You can create a new site object in Appian Designer. After creating it, simply open the site object to configure it.

Create a new site

  1. In Appian Designer, open the application that you want the site to be in.
  2. From the New menu, click Site.
  3. For Name, enter a name.
  4. For Description, optionally enter a description.
  5. For Web Address Identifier, optionally add a web address identifier.
  6. Click Create to create and open the site to configure it.

Configure new site

Open the site object to edit the site's properties, configure the site contents, and add custom branding to the site.

screenshot of the sites page

Edit properties

The properties defined during the creation of the site can be updated when configuring the site. In addition, there are some additional properties that should be reviewed and updated as necessary. For further details on what each setting is, refer to the Properties section of this document.

Add pages

Pages allow the developer to add content to the site. Each site can contain up to 5 pages that can be configured to show an action, a report (task report or Tempo report), or a record type. For further details on configuring a page, see Pages.

  1. Under the Pages grid, click Add Page.
  2. Complete the Add Page dialog and click OK images/SiteAddPageModal.png

Configure site branding

Use the branding section of the site to modify the site logo, favicon, button shape, navigation bar style, and colors. Check out the Branding Preview at the bottom of the page to get a better idea of what your site configurations and branding will look like.

For further details on configuring site branding, see Branding.

screenshot of the branding section of the sites page

Save and review

To save and test your site:

  1. In the header bar, click Save Changes.
  2. In the properties section under Web Address, click the site URL to test the site.

Design considerations

While creating a site is easy, there are some design considerations to keep in mind:

  • Designers should identify some guiding principals to how they will build sites. Will they be based on functional areas of the business? Will they be based on employee roles? Will they use a custom navigation experience?

  • Reports can be used to create pages that combine various content types (e.g. actions and reports) as well as create custom navigation experiences. This can be very effective for giving the users a good experience, but two considerations need to be take into account when using this approach. First, adding these reports will add to the list of reports in Tempo which may confuse Tempo users. Second, building the custom navigation experience does require additional planning and effort to be effective.

  • When configuring a site page for web users, consider updating the page width to match the content. For example, actions may have only a few fields and benefit from a narrow page width to avoid having the form look stretched. Another example is a dense report that can benefit from a wide page width or, if users have extra wide monitors, a full page width.

  • Configuring sites to show record news can help improve the collaboration around records. Users can collaborate on existing record news entries in sites, but not create new entries. However, records can be designed to include related actions that can generate new record entries via process.

  • Actions in sites can be designed to be available to iOS users while they are offline. Learn more about designing for offline mobile.

  • Safe links and news entry links will take the user out of the site, so consider this when designing sites that include them.

A user must have at least Viewer permissions to a site to access it. In addition, a user must have visibility to site pages and at least Viewer permissions to each report, record type, or process model configured as a site page's content.

The security role map of a site controls which users can see or modify it and its properties. By default, only the site creator and system administrators have access to the site. See Editing Object Security to modify a site's security.

The following table outlines the actions that can be completed for each permission level in a site's security role map:

Actions Administrator Editor Viewer
View the site Yes Yes Yes
View the definition Yes Yes Yes
View the security Yes Yes Yes
Update the definition Yes Yes No
Update the security Yes No No
Delete the site Yes No No

Logging

The usage of sites is logged in <APPIAN_HOME>/logs/audit/sites_usage.csv. See Sites Usage Audit for details.

Sites metrics are logged in <APPIAN_HOME>/logs/data-metrics/sites.csv. See Sites Metrics Log for details.

Open in Github Built: Thu, Feb 23, 2023 (02:59:22 PM)

On This Page

FEEDBACK