Skip to Main Content

Breadcrumb

About

An inline popup displays a region on the current page within a small popup component. It is similar to a dialog, however does not have a header bar, title, or close button.

Create a region, set its "Position" attribute to Inline Dialogs, and use Inline Popup as its Region template.

Examples

Template Options

  • General

    • Use Template Defaults
    • Auto Height
      This option will set the height of the dialog to fit its contents.
    • Remove Body Padding
      Removes the padding around the region body.
    • Remove Page Overlay
      This option will display the inline dialog without an overlay on the background.
    • Display Popup Callout
      Use this option to add display a callout for the popup. Note that callout will only be displayed if the data-parent-element custom attribute is defined.

  • Dialog Size

    • None
    • Small (480x320)
    • Medium (600x400)
    • Large (720x480)

  • Callout Position

    Determines where the callout for the popup will be positioned relative to its parent.

    • Default
    • Before
      Positions the callout before or typically to the left of the parent.
    • After
      Positions the callout after or typically to the right of the parent.
    • Above
      Positions the callout above or typically on top of the parent.
    • Below
      Positions the callout below or typically to the bottom of the parent.
    • Inside
      Positions the callout inside of the parent. This is useful when the parent is sufficiently large, such as a report or large region.
  • Advanced

    Heading Level

    • Default
    • H1
      H1
    • H2
      H2
    • H3
      H3
    • H4
      H4
    • H5
      H5
    • H6
      H6
  • Advanced

    Item Spacing

    Sets the padding around items within this region.

    • Default
    • Standard
      Uses the standard spacing between items.
    • Slim
      Reduces form item spacing.
    • None
      Removes spacing between items.
  • Advanced

    Item Size

    Sets the size of the form items within this region.

    • Default
    • Large
    • X Large
  • Advanced

    Item Width

    Sets the width of the form items within this region.

    • Default
    • Stretch Form Fields
  • Advanced

    Label Alignment

    Set the label text alignment for items within this region.

    • Right
    • Left
      Align form labels to left.
  • Advanced

    Label Position

    Sets the position of the label relative to the form item.

    • Inline - Default
    • Show Form Labels Above
      Show form labels above input fields.
  • Advanced

    Top Margin

    Set the top margin for this region.

    • Default
    • None
      Removes the top margin for this region.
    • Small
      Adds a small top margin to the region.
    • Medium
      Adds a medium top margin to the region.
    • Large
      Adds a large top margin to the region.
  • Advanced

    Bottom Margin

    Set the bottom margin for this region.

    • Default
    • None
      Removes the bottom margin for this region.
    • Small
      Adds a small bottom margin to the region.
    • Medium
      Adds a medium bottom margin to the region.
    • Large
      Adds a large bottom margin to the region.
  • Advanced

    Left Margin

    Set the left margin for this region.

    • Default
    • None
      Removes the left margin from the region.
    • Small
      Adds a small left margin to the region.
    • Medium
      Adds a medium right margin to the region.
    • Large
      Adds a large right margin to the region.
  • Advanced

    Right Margin

    Set the right margin for this region.

    • Default
    • None
      Removes the right margin from the region.
    • Small
      Adds a small right margin to the region.
    • Medium
      Adds a medium right margin to the region.
    • Large
      Adds a large right margin to the region.