Web Content Component

Web Content [Preview]

This is a preview version of the Web Content component. It is not yet supported on mobile devices, or in the following browsers: Internet Explorer 11, Edge, and Safari. On those browsers, this component will display a link to the content instead of the content itself. See Usage Guidance for more information.

SAIL Function: a!webContentField()

Displays content from an external source.

Parameters

Name Keyword Type Description
Label label Text Optional text to display as the field label.
Label Position labelPosition Text Optional text to determine where the label appears. Valid values include
  • "ABOVE" (default) Displays the label above the component.
  • "ADJACENT" Displays the label to the left of the component.
  • "COLLAPSED" Hides the label. The label will still be read by screen readers; see accessibility considerations for more information.
  • "JUSTIFIED" Aligns the label alongside the component starting at the edge of the page.
Instructions instructions Text Optional text displayed below the label.
Help Tooltip helpTooltip Text Displays a help icon with the specified text as a tooltip. The tooltip displays a maximum of 500 characters. The help icon does not show when the label position is "COLLAPSED".
Source source SafeURI Location of the external content.
Show Border showBorder Boolean Determines whether the field has an outer border. Default: true.
Height height Text Determines the field height. Valid values include "SHORT", "MEDIUM" (default), and "TALL".
Alternative Text altText Text Equivalent alternate text provided to assistive technology.
Visibility showWhen Boolean Determines whether the component is displayed on the interface. When set to false, the component is hidden and is not evaluated. Default: false.

Notes

  • Not all content can be embedded. The best way to know if your content can be embedded or not is to test it. If it can't be embedded, the field will be empty. Some sources explicitly prevent being embedded, such as https://www.google.com and https://www.yahoo.com/.
  • This component supports displaying external content only. Internal Appian interfaces and Appian URLs are not supported.
  • On Appian for Mobile Devices, the web content field appears as a safe link to the source. The value provided in altText is used for the link label.
  • Screen readers will typically announce the embedded page's title (found in the <title> attribute). When no title is provided, the altText value is used.

Examples

1
2
3
4
5
6
=a!webContentField(
  source: "https://www.appian.com/",
  height: "MEDIUM",
  showBorder: true,
  altText: "Appian Corporation"
)

Preview Usage Guidance

For the best user experience, use the web content field in Chrome or Firefox. In those browsers, content is embedded per the behavior described on this page. In Edge, Internet Explorer 11, and Safari, the web content field appears as a link to the source. The value provided in altText is used for the link label.

It's important to consider which browsers are used by your end users and designers. For example, if an interface is designed and tested in Chrome, but deployed to an Internet Explorer 11 user population, the end user experience is different from what was tested. The opposite scenario must also be considered. If an interface is designed in Internet Explorer 11 and deployed to Chrome users, it won't be fully tested the way users will experience it.

FEEDBACK