Embed a Retool App

With PixieBrix, you can embed a Retool App in any web application, providing context from the page.

Prepare your Retool App for Embedding

Double-Check the Mobile Layout Setting

The PixieBrix Sidebar with 400px wide. Therefore, Retool’s β€œEnable mobile layout” setting will take effect when your App is embedded in the PixieBrix Sidebar.

Read more about Retool’s mobile layout.

Locating the β€œEnable mobile layout” App Setting

Configure Custom URL Parameters

Custom URL query parameters and hash parameters are used to pass information to the embedded Retool App. Follow Retool’s Configure Custom URL Parameters documentation

For example, to reference a URL query parameter, use the urlparams variable:

Showing all urlparams in a table

Embedding a Retool App via the Sidebar

New to PixieBrix? See the Page Editorguide.

  1. In the PixieBrix Page Editor, add a Sidebar Panel Starter Brick

  2. Remove the default Render Document brick

  3. Add the Construct URL Brick and IFrame Brick

  4. Configure the Construct URL brick with your Retool App URL and URL Query Parameters:

  5. In the IFrame brick, provide the constructed URL:

Troubleshooting

My component doesn’t show up in the sidebar!

If the β€œEnable mobile layout” setting is toggled on for your Retool App, components will only display if β€œShow on mobile” is set for the component.

The component setting is available under Appearance > Advanced > Appearance.

Locating the Component > Appearance > Advanced > β€œShow on mobile” setting

Last updated