Skip to main content




Applies only to Traditional Web Apps




  • Edit
    Collaborate with us
    Edit this page on GitHub
  • Display additional information in one view.

    Use Iframe to display information from other apps on the screen in small previews.

    How to use

    1. Drag the Iframe pattern into the preview.

    2. Set the mandatory values.

    3. Publish and test.

    Input Parameters

    Input Name Description Type Mandatory Default Value
    SourceURL The target URL to load on the Iframe. Text Yes none
    Title Title for the iframe element. Text No none
    Height Iframe height, default is 100%. Text No 100%
    Width Iframe width, default is 100%. Text No 100%

    Layout and Classes

    Advanced Use Case

    Change the Iframe width according to the device

    This can be very useful if you are using a fixed width.

    1. Set the Width to If(IsDesktop(), "500px", "100%").

    2. Publish and test.

    You can change the condition of the width used. This code makes the width 500px on desktop, but on mobile, it is still full-width as the fixed width would probably overflow the screen.

    • Was this article helpful?