Embed external, 3rd party content directly in the pages of your Coda doc
Embedding 3rd party content in your Coda doc allows for even more versatility, customization, and convenience. From videos, to wikis and blogs, to documents and PDFs you can embed all kinds of content in your doc. This means people won’t have to open another tab to see that PDF or that webpage — they can view and even interact with it right in your doc. Read on to learn how to set up and troubleshoot these embeds.
📣 If you want to embed a Coda doc - or pages of a doc - within another Coda doc, we have a separate feature for that. Check out this article on sync pages to learn more.
Within this article, you’ll find...
Embed as a full page
You can create a full-page embed by linking to your content in Amplitude, Mode, Miro, Figma, Google Sheets, and more. For instance, your team might work out of one doc in Coda but consistently need to reference context e.g., feature usage in Mode or designs in Figma, and other tools shared by your collaborators. Embedding as a full-page can give your team all the context they need to complete a workflow from start to finish, without constant tab and context switching.
To get started with adding a full-page embed to your doc, just follow these steps:
-
At the bottom of your page list (left side of your doc), click on the dropdown (v icon) next to New page. If your page list is collapsed, hover your mouse in the bottom left corner and wait for this to appear. Select New embed from the options.
Alternatively, you can click the three horizontal dot menu ( ... ) next to the name of an existing page, then choose Add page > New embed.
-
You’ll see a grid of different tools you can embed from, as well as a “generic” link option for embedding from other sources. Select the embed of your choice and paste in the link to the content you’d like to embed.
Among the options shown, you can choose to embed a link to Figma, Google Docs, Google Sheets, Amplitude, Canva, and a host of other common tools.
After your embed has been added, you can name the page and assign an icon, just like any other page in Coda.
Modify existing full page embed
To change the link you’ve embedded, you can select Embed options from the three dot menu ( ... ) next to the page name. Or you can find the Embed options icon in the upper right corner of the page (to the right of Open link). Then you can paste in your new link, and click Update.
Embed on the canvas
Sometimes you may not want a full page embed. Maybe you just want to embed a piece of content within or alongside the other content on your page. No problem! The easiest way to embed content into your canvas is to type /embed on a blank line on the page. Choose Embed from the dropdown. Then simply paste in the link to your content, and click Create.
You can then resize your embedded content by clicking and dragging on its outline.
Once your embed is created, you can modify it by hovering over and clicking the small pencil icon that appears in the upper right corner. From here, you can paste a new link and update. You can also click the three dots in the upper right corner to change how the link is embedded, including from card, URL, and standard embed.
Troubleshoot your embed
If you run into an issue trying to embed external content in your Coda doc, it may have to do with the permissions or other settings of said content. Before embedding, make sure that the link has the appropriate permissions and is embeddable. If you ever have any issues, we recommend trying the Embed formula with Compatibility mode enabled (see below).
Use compatibility mode
Many URLs will work out-of-the-box with our embed feature, but some may not display as desired by default. For instance, content that needs you to log into an account to view or that does not support the oEmbed format (such as a private dashboard) may result in an error or show only basic information.
In this case, you can try Compatibility mode. To do so, click on the pencil icon in the upper right corner of your canvas embed or Embed options of your page embed. You should then see a popup, with a Compatibility mode toggle option. Toggle this on to and then click Update. With this setting enabled, the content will be embedded directly in an iframe in your browser. Note that this can help in many cases, but may not always be sufficient - depending on the settings of the 3rd party content.
Ensure that you're using a link intended for embedding
In some cases, external sites will have the option to copy a link that's specifically intended for embedding elsewhere. When possible, make sure you're using this embed-specific link. Tip: type “embed” and the name of your tool you’re trying to embed in your favorite search engine, and select results from that tool’s website.
Test your embed in a 3rd party code editor
Try testing out the link you're wanting to embed in a 3rd party code editor, using HTML. If you encounter an error there, then this content likely has some settings that are preventing it from being embedded externally. In this case, forcing Compatibility mode in Coda likely cannot help.
Embedding content from Mode Analytics
When embedding from Mode Analytics, make sure to grab the entire URL from the URL bar of the recent report, then add "/embed" to the end of the link (using the Embed formula). Otherwise, the report won't render in Coda.
Browser extensions or add-ons: Ad-blocker, privacy, and others
If you’re experiencing issues successfully logging in or loading your embeds from Google or other apps, try turning off all ad-blocking or privacy related browser extensions and refresh to see if that resolves your issue.
Alternatively, you could run your browser in incognito mode, which typically doesn’t have extensions enabled, sign in and see if you’re able to successfully login and load.
Once confirmed, some options to allow you to continue working with embeds are either removing / turning the off the extensions completely, or checking if they support allowlists to stop blocking the app you’re trying to embed e.g., Google Sheets.
Can’t login to Figma embed in Safari
If you’re having issues logging into a Figma embed or stuck in a loop while using Safari, the following steps may help:
Open Safari.
Open Settings, and then navigate to the Privacy tab.
Ensure that the option to Prevent cross-site tracking is unchecked.
FAQs
Can I embed something in my doc’s canvas using formulas?
Yes! Coda actually has an Embed() formula. This formula even includes a parameter to “force” Compatibility mode to help with troubleshooting your embeds. You can read more about using formulas in Coda here.
Can I embed a Coda form (from a different Coda doc) in my doc?
Yes! To do this, you’ll need to first create and publish your Coda form. Follow those instructions to copy the link to your published form. Then go to the doc where you’d like to embed the form, and type /embed into the doc canvas. Paste in the link to your publish form, and hit Create.
How can I embed pages from another Coda doc in my doc?
You actually won’t use the embed feature to do this. Instead, you can use our sync pages feature. This allows for even more convenience and cohesion. You can read all about it here.
Why is my embed showing a prompt (such as a login) instead of just displaying the content?
Some embeds will show a prompt before loading external content, depending on the embed settings of the third party platform. Third parties may not allow embedding of the content at all, or may require you to log in. Unfortunately, this is not something that can be modified in Coda. We recommend exploring the share or embed settings of the third party site.
How do full-page embeds impact performance?
The impact of loading full-page embeds is similar to having browser tabs, with the caveat that we’re more intentional how much memory we use by applying the following rules below.
We only load the page embed once you select or interact with you e.g., click into it to load the content, until then it's not loaded. So, if you have 100 page embed, it won’t load any of them until you access them.
We keep the last 5 page embed you've viewed in a cache on desktop, so you can quickly switch back and forth, and don't cache at all on mobile due to memory pressure.
We remove any cached page embed that you haven’t looked at or is in the background from cache after ~4 hours.
How do I resize an embed on the canvas?
When you first create an embed on the canvas, you should see grab bars on either side of the embed that you can click and drag to resize. If you ever want to resize the embed in the future, simply highlight the embed to reveal the grab bars again. If you're having any trouble, you can click to the right of the embed then use the left arrow key to select the embed.
Related resources
-
Sync guide: Sync everything into Coda, and back out again.