What is an embedded app?
With SuperOkay, you can embed the apps you use most often right in the client portal your clients can see. This helps you keep all sources of client-facing information in one place. An embedded app can be a Google Data Studio report, a Figma prototype, a Miro board, a Trello board, an Airtable base, or even a YouTube video.
The possibilities are endless with embedded apps.
How do embedded apps work?
SuperOkay uses iframes to make this possible. You can think of iframes as portals to other webpages on the internet. This way you can see and interact with other websites straight from your SuperOkay portal.
What apps can you embed in SuperOkay?
Any web page that people can see without having to log in first can be embedded in SuperOkay. Because of privacy and security concerns, there are quite a few limitations on what can happen within an iframe, therefore the embedded app.
How can you embed an app if you know the link?
If you're using one of the apps we support Quick Embeds for, just click the icon of that app and you'll see instructions on how to get your link and use it in SuperOkay
If you want to embed any other app or webpage, follow these instructions:
Step 1: In SuperOkay, click the "Embed another app" button on your Project Settings » Embedded apps page
Step 2: Configure your embedded app:
| 1) Pick an icon from our predefined lists
2) Pick a short name your clients will see under the icon
4) Add the Embed Code how to create an embed code
5) Add a short description that your clients will see under the app name & icon. |
Creating an embed code if you don't have one:
💡A valid embed code starts with <iframe> and ends with </iframe>
A quick code snipped you can use and customize is this 👇
<iframe src="[your page link goes here]" width="100%" height="1200" frameborder="0"></iframe>
Just replace [your page link goes here] with the link you want and then paste the code in the Add New App screen in SuperOkay.
You can change the value of the height attributed if you feel the canvas for your embedded app is too large.
🚨We don't recommend adding style attributes to the iframe element as they might conflict with the styling of the SuperOkay app and might cause errors.
Troubleshooting embedded apps
⁉️ I got an embed code from an app but it's not working!
A couple reasons this might happen:
Only <iframe>...</iframe> embed codes work in SuperOkay, for now. If your app gives you a code that begins with <script> or other words, it will not work.
Your iframe code might have formatting issues. We recommend using the code snippet above and just replacing the link with the one you have in the embed code your app gave you.
Your iframe code has conflicting style attributes. Example:
Please remove these from the embed code as they might cause issues.
A couple things to expect from apps you connect via Embedded Apps:
Your client will not be logged in to the app you embed. That means they will most likely only be able to read the content and have limited interactions.
SuperOkay cannot control the look & feel of the pages you embed. Depending on how the app you embed is built, pages embedded might have some user interface glitches.
SuperOkay cannot interact with the page embedded via iframe.
The webpage in the iframe cannot interact with the SuperOkay portal.
We are constantly working on improving SuperOkay and the way Embedded Apps work. If you have any suggestions, don't hesitate to reach out :)