Let me ask you a question: how did you get started with Notion? I'm willing to bet it was probably something simple, like maintaining your to-do list or creating a company wiki.
Notion then quickly overflows to other aspects of your life and becomes your go-to tool for literally everything! The Notion app was designed to be your all-in-one tool.
%20(1).svg){kind=icon}
And although Notion can do so much, it’s still missing small features to be “complete” for your unique use case. This can create an awkward situation where you have your life consolidated in Notion, and you still need to refer to other apps, again and again, which breaks your flow.
Plus, you don’t want to open a million of tabs and context switch to view information from other places.
What's the solution to this? Embedding those apps into your Notion system. This way, you can bring all your favorite tools from all over the web right to Notion!
There's another way to reduce switching between apps. It's a slick workflow automation tool for your browser called Bardeen. Learn more.
In this article, you will learn everything you need to know about embedding things to Notion and explore the best 10 widgets that can make your Notion so much better.
How do you embed & connect apps in Notion?
Inserting an Embed
- Click the '+' that appears to the left when you hover over a new line in Notion. Choose 'Embed' or one of the common embed types listed.
- In the menu that appears, paste the content's URL or embed link.
- You can also use '/embed' to upload and display your own image, audio, video, or file. Select 'Upload' and choose the file from your computer.
Note: Some websites prohibit their content from being embedded elsewhere. If you receive a 'Failed to Load' error, that's why.
In Notion, you can embed HTML files, PDF files, audio, video, and images.
Connecting Other Apps
Notion allows for integration with various apps like Zoom, Google Drive, and Google Calendar, enhancing your workspace's functionality. For instance, you can embed a view-only Google Calendar or search your Google Drive from inside Notion and embed content without navigating away from the app. Additionally, Notion supports Zoom meeting link previews and managing weekly Zoom meetings in calendar view.
Note: On Enterprise plans, the ability to add connections and install workspace-wide security and compliance integrations can be restricted to workspace owners.
Streamline your Notion workflow by automating app integration and content embedding with Bardeen's Notion playbooks.
What can you embed in Notion?
To set the stage, let’s talk about what embedding is. When you embed something, you bring a piece of external web content to Notion.
Most people don’t really know how powerful embeds can be. And because of this, entire businesses like Chillipepper have sprung up. It’s a form that you can embed into Notion. But, with some very basic understanding of embeds, you don’t really need any external tools or widgets.
Later in this article, you will learn how to create your own embeds!
Now, in terms of what you can embed, it’s a very long list. Notion was designed from the ground up to be modular and versatile, so it allows for a wide range of possibilities.
Generally, there are two types of Notion embeds: “official” and everything else.
First, let’s check out some the Notion app officially embeds.
1. Videos (Loom & Youtube)
Who wants to click through a link to watch content in a separate tab?
You can paste a link to a Youtube video or a Loom with a walk-through to a Notion page and click on “embed video” in the popup that opens.
2. Google Maps
If you are a business with a public Notion page or if you run events, embedding Google Maps is super useful.
Here is how we did it on the page for our company offisite:
To embed maps, use the /slash command and pick Google Maps. Then copy a link from google.com/maps there.
3. Miro
Miro is a collaborative whiteboard application. It features an infinite canvas that allows you to unleash your creativity. If you do your group sessions in Miro, you definitely want them embedded in Notion.
Like before, use the slash command and type in ‘Miro.’ Then enter a public link to your Miro board.
Once it’s successfully embedded, you can resize and edit the board as you want.
4. Figma
Designers live in Figma. And good luck trying to get them out of it.
Figma is a go-to for product and design, so if you are in tech, you can’t avoid it.
Using Figma link previews will allow you to bring your updated designs into your Notion.
Like you’ve done just earlier, paste a link to a specific frame to Notion.
You may be asked to authenticate with Figma. Then you’ll see the image.
That’s it!
5. Jira
Jira is the go-to tool to track issues and bugs for software development. So again, it’s probably inescapable for startups. However, you can try using Notion for project management entirely.
If you use Jira, embedding it into Notion can be a great way to consolidate all your tasks in one place.
The new Jira integration allows you to embed single issues and entire boards!
Let’s embed an issue, first. Just paste the Jira issue link to Notion. There are two views: block and inline.
And now, it gets even better. You can create a 2-way-synced database! Or embed a Jira board. To do this, copy the link to the Jira board and paste it in Notion.
If you want to transition entirely from Jira to Notion, the sync won’t work because you will need a paid Jira subscription. Instead, you can transfer Jira tickets to Notion using this automation.
6. Embed Google Calendar
Using the Notion calendar view for any length of time will quickly reveal its weak points and limitations.
When using it, it's easy to think back to the good old Google Calendar browser tab. But that might not be a good option want to share a calendar on a public page for your business.
Well, the good news is that Google Calendar can be embedded in Notion too! And you can automate the workflow between Google Calendar and Notion in various ways.
In this post, we’ve laid out 4 ways you can use Google Calendar with Notion, including how to import events, enable 2-way sync, and automations.
7. Google Docs and Sheets (Different)
If you tried embedding Google Doc or Sheets to Notion, you know that it will only let you see the preview. You can’t interact with it and edit docs, which is limiting and restrictive.
Here is how pasting a Google Doc link to a Notion embed block will look:
Here he is the another way, which you are about to learn:
Which one is better? With the second method, you can work on the document and view it entirely. More ways to automate Google Docs and Notion.
All you need to do is create a special <iframe> code and paste it in a Notion embed block. Before doing this, make sure that the Doc or Sheet you’re embedding is public, and make sure to copy the link that gives editing-level access, or it won’t work.
Explore more about integrating Google Sheets with Notion.
8. Pomodoro timer
Assuming you are into productivity, you’ve heard about the Pomodoro technique.
Developed by Francesco Cirillo, if the idea is that you are focused for only ~25 min period of time (remember Ted talks’ avg. legth). Hence, you should commit to 25-minute work sessions, and take 5-minute breaks in between.
Although there are countless Pomodoro timer apps and websites out there, YES, you can also embed one directly to Notion.
Just copy this link, paste it into your Notion page of choice, and from the dropdown menu select ‘Create embed.’
You can resize it based on your Notion page layout. Plus, this timer is themed around Studio Ghibli, which is always a great thing.
9. Investment tracker
If you have many investments, you might often get the urge to check how they are doing every now and again. Instead of breaking up your workflow and going to another application, bringing your portfolio to Notion itself can be useful. With this template by Renan Greca, you can do exactly that.
So, how do you implement this? It’s easy. Once you open the link, click the ‘Duplicate Template’ button. This will copy it over to your Notion account. From then on, Renan has created a neat little tutorial to get you settled in and start tracking your investments in terms of liquid value, yearly growth, returns, and more.
10. Spotify playlist
Spotify playlists literally made this app #1 music app in the world. In fact, I am writing this very article while listening to my “flow” playlist (save it).
I don’t know about you, but music can often help me 10X my productivity. Whether it’s chillstep by Lakey Inspired or a cinematic piece by Hans Zimmer, listening to music while working can often bring new life to the task I’m doing. If you’re the same, I know for a fact that you’d love to embed your Spotify playlist to your Notion sheet.
11. Counter
Goals are so much more powerful when made visible. You can embed a counter using a free tool called Indify.
You can +1 or -1 by clicking on the arrows.
Here is how I keep my content goals visible:
12. Life Progress Bar
Indify, can also get some fire under your but reminding you that the time is ticking. Well, and that we are all mortal if you add the “life” counter.
What Else Can Be Embedded In Notion?
Notion itself has claimed that “pretty much any online content can be embedded on a page.” Let your imagination run wild: media players (both audio and video), data charts, products, dashboards, and so much more. Some more apps that can be embedded into Notion that I didn’t mention before are Loom, Tango, and Screenful, to name a few.
Check out Apption or Simple.ink to view a catalog of other Notion embeds. These websites provide additional tutorials with embed codes.
%201.svg){kind=icon}
You can also search Embed.ly’s database too, which includes over 700 content providers. If you come across any errors, Notion has also created a support page dedicated to embeds and apps.
Embed custom button and web forms
When building the Notion Automation Hub (the go-to resource for pre-built Notion automations), our designer wanted to make the template look amazing.
To his surprise, there was no way to add a link to a page that would look the way he envisioned it. So we had to embed a button.
To get full control of the embed, we’ve created a dedicated web page that has only one element: a button.
https://www.bardeen.ai/support/button
You can style yours however you want.
Because we didn’t want to create a new page for each destination URL when you click the button, we had done some simple code magic.
This JavaScript code snippet will grab the destination link from the embed URL and direct there when clicked.
https://www.bardeen.ai/support/button?redirect=https://www.bardeen.ai/playbooks/upload-zoom-recording-to-drive
<button class="tryitbtn" onclick="myFunction()">Try it!</button>
<script>
function myFunction() {
var currentURL = window.location.href;
var playbookLink = currentURL.split('?redirect=').pop();
console.log(playbookLink);
window.open(playbookLink, "_blank").focus();
}
</script>
The code will extract the URL after ‘?redirect=’ and will launch it when clicked (onclick) in a new tab (_black).
You can use our button, or create your custom button with the code snippet above.
We did the same to embed Webflow forms and fancy buttons to Notion.
FAQs
There you go! We just went through ten apps that can be embedded in Notion. Here are some common questions you might be curious about.
Will Notion embeds work offline?
Most of us enjoy stable and high-speed Internet connections 365/24/7. However, in the case of a network outage or if you're on a plane, that might not be the case. Fortunately, with offline functionality, Notion has you covered.
In the context of this article, let's talk about if embeds work offline. As @NotionHQ indicates in this tweet, if an embed is preloaded and cached locally, it will work when you're offline, such as an image. On the other hand, if it's dynamic and needs server-side support, like a live map, it won't work.
Overall, you can use Notion offline, albeit with a few limitations. Most of the changes you make while offline will be synced to the cloud when you’re back online.
Can you embed a Notion page into another website?
Being able to embed a Notion page into another website can open up a vast range of possibilities. With basic coding knowledge, you can publish any Notion sheet or template using a web builder like WordPress, Wix, or Squarespace. Alas, this feature isn't supported natively.
However, you can use a website named Embed Notion to do it instead. Before you begin, you need to make sure that the page you want to embed is public. To do that, simply toggle the ‘Share to web’ option at the top right of the page.
Done? Now follow these steps:
- Click ‘Copy’ to save the page’s unique URL to your clipboard
- Open http://embednotion.com
- Paste the URL below ‘Your Notion Link’ and click ‘Create embed for free’
- A block of HTML and CSS code with the <iframe> tag will be generated for you. Copy it with the ‘Copy Code’ button
- Now, you can inject that code into any website you want
That’s it!
The downside is that this will cost you $5.99 per month, if you want to remove the watermark and enable auto-update. But other than that, you can use it for free. It’s a big BUT, however.
Endnotes
By now, you know well enough that Notion is a powerful tool. It’s not just limited to organizing your life, but also improving it in the areas that matter to you and bringing value to others. In addition to native features, bringing all the other tools on the web can enhance your user experience even further, giving you an even bigger productivity boost.
We hope you found at least a few of these embeds useful and started using them. Are there any more apps that you want us to add to this list? Let us know on our Twitter page!
