HTML
A content area to embed HTML and CSS markup.
HTML supports most HTML tags and presentational attributes. Scripting is not supported but the event handlers are available. To attach an event handler to a specific element in the HTML, add a data-<event type>-target
attribute. For example:
<button data-click-target="primary">Trigger event</button>
To embed web pages, use an IFrame component. For functionality that isn't available in other components, or to use React or HTML and JavaScript, use a Custom Component.
Settings
HTML includes the following configurable options when building apps in the IDE.
CSSHTMLShow on desktopShow on mobileMaintain space when hiddenMarginAlways show in edit modeStylesHelper text |
Properties
All properties for HTML with supported data types or values. You can write JavaScript almost anywhere in Retool to manipulate or read property values.
clickable
Whether there is an enabled Click event handler.
global
Whether the object is globally scoped for use in all app pages.
id
The unique identifier.
isHiddenOnDesktop
Whether the component is visible in the desktop layout.
isHiddenOnMobile
Whether the component is visible in the mobile layout.
maintainSpaceWhenHidden
Whether the component takes up space on the canvas if hidden
is true
.
pluginType
The plugin type.
showInEditor
Whether to remain visible in the editor if hidden
is true
.
tooltipText
The tooltip text to display.