You are here

Editing widget display

You can customize the following aspects of system or custom widgets for your homepages:

  • Titlebar: text and font color.
  • Titlebar background: fill type and color.
  • Titlebar shadow effects: color, vertical size, and blur level.
  • Titlebar border: style, color, and width.
  • Widget shadow: color, vertical and horizontal size, shadow spread, and blur level.
  • Widget border: style, color, and width.
  • Widget shape: corner roundness or sharpness

Custom widgets provide additional options that enable you to create widgets that blend into the homepage background:

  • Widget background: transparency.
  • Widget padding: change the spacing around the content within the widget to blend more seamlessly into the background of the page.

A custom widget with a hidden titlebar, transparent background (with homepage background showing through), and rounded corners.

A custom widget with a gradient titlebar, titlebar dropshadow, large internal padding, and sharp corners. The page background is visible around the edges of the widget.

Edit widget display

To Do this
Hide the titlebar Clear the Display Titlebar check box
Prevent users from closing the widget on the homepage Select the Prohibit minimizing widget check box
Set a custom title Select the Custom radio button, and enter your text in the field
Change the font color of the title Select a font color from the Color selector in the Titlebar area
Change the background of the titlebar
  • Select Gradient or Solid from the Fill Type drop-down list.
  • Tip A gradient fill type creates a three-dimensional look for your homepage.

  • Select a color style: soft, light, or dark. These colors are set by your administrator.
  • Or, select a custom color for your widget's titlebar background.
  • Note If you select a gradient fill type, two color selectors appear: the gradient's top color on the left, and bottom on the right.

Create a shadow effect on the titlebar
  • Select a font color from the Color selector in the Titlebar Shadow area
  • Set a Vertical amount and a Blur level in the fields provided
Change the border on the titlebar
  • Clear the Display Border check box to remove the border
  • Select a line type from the Border Style drop-down list
  • Select a border color from the Color selector
  • Select a border width from the Width drop-down list
Show the page background in a custom widget
  • Select the Transparent check box in the Widget Background area
Create a shadow effect on the widget
  • Select a shadow color from the Color selector
  • Set the Vertical and Horizontal pixels, the Spread of the shadow, and the Blur level in the fields provided
Change the border of the widget
  • Clear the Display Border check box to remove the border
  • Select a line type from the Border Style drop-down list
  • Select a border color from the Color selector
  • Select a border width from the Width drop-down list
Change the shape of the corners on the widget
  • Set a pixel value for each corner of the widget in the fields provided
  • Tip The higher the value, the more rounded the corners appear. The lower the value, the sharper the corners appear. The lowest value you can enter is 0.

Change the padding on custom widgets
  • Set a pixel value for each side of the widget in the fields provided

Note To help you meet visual accessibility standards, there is a built-in WCAG (Web Content Accessibility Guideline) checker on the Widget Settings page. Be aware that if you choose a shade that does not meet these guidelines (for example, the contrast between the text color and the background color is too low), the  check mark by WCAG AA will be replaced by a warning or error icon to alert you to possible accessibility issues.

Audience: