Join our discord server: join now
Obsidian Open Gate is a plugin for Obsidian, a popular note-taking app. This plugin allows you to embed any website into Obsidian, providing a seamless browsing and note-taking experience. Whether you're researching, studying, or just browsing the web, Obsidian Open Gate keeps everything you need in one place.
Click here to install the plugin: Direct Install
- Embed any website in your Obsidian UI as a "Gate"
- Open a Gate on the left, center, or right of the Obsidian UI
- Embed a Gate directly within a note
- Auto generate icon based on the site's favicon
- Embed any site that can not be embedded by iframe
- Support for mobile
- Inject custom CSS to match the look and feel of Obsidian
- Link to Gates from within your notes
To use Obsidian Open Gate, follow these steps:
- Open the command palette and type
New gate
. - Enter the URL and title of the website you want to embed.
- Click
Create
.
You will then see the icon of the website in the left sidebar of Obsidian. Clicking on it.
Add new gate does not require to restart Obsidian. But editing and deleting gate requires to restart Obsidian.
You can quickly open gates using a single shortcut. The default is Ctrl+Shift+G
or Cmd+Shift+G
. You can change it in the Hotkeys section of Obsidian.
You can also open a new Gate from within a note. By using the obsidian://opengate
protocol.
You can use a link in your notes to open a configured UI Gate and optionally open a specific URL in that Gate.
By default, the plugin will find the first Gate that matches the title or URL provided.
Example 1: Open the Gate with a title of "googledocs".
Will simply open the gate as configured.
[Open Google Gate](obsidian://opengate?title=googledocs)
Sometime, you want to change the url of the configured gate. You can do that by adding url
parameter to the link.
Example 2: Open the Gate with a title of "googledocs" and go to a specific document.
Will navigate to the provided URL in the "googledocs" Gate.
Note: The original URL is: https://docs.google.com/document/d/abc123/edit but has been URL Encoded
[Open Google Gate](obsidian://opengate?title=google&url=https%3A%2F%2Fdocs.google.com%2Fdocument%2Fd%2Fabc123%2Fedit)
The gate will have them same configuration as the one you configured in the settings, but the url will be changed to the one you provided.
If no Gate is found, the plugin will open a temporary Gate with the provided URL, this gate will not be saved and will be deleted when you close it. To prevent multiple temporary Gates from being opened, which can lead to performance issues like Chrome tabs, the plugin only allow you to open one temporary Gate at a time.
The usage is exactly the same as the pre-configured Gate, but you no need to match the title or url.
Select a link in your note, then right click and select Convert to Gate Link
. The plugin will convert the link to a Gate link.
If the link is already a Gate link, the plugin will convert it back to a normal link.
You can use a code block with the language set to gate
to embed any website directly within a note, including custom css.
```gate
url: https://12bit.vn
height: 300
zoomFactor: 1
css: |
html { filter: invert(90%) hue-rotate(180deg)!important; }
```
zoomFactor: 1 means 100% zoom, 0.5 means 50% zoom, 2 means 200% zoom.
You can use file://
protocol to open local file. For example:
- Windows:
file:///C:/Users/username/another-vault/note.md
- Mac:
file:///Users/username/Documents/another-vault/note.md
- Right-click on the editor
- Select
Insert Gate Link
if there are a normal link selected, the plugin will convert it to a gate link and vice versa.
Please read CONTRIBUTING.md for details on our code of conduct, and the process for submitting pull requests to us.
Thanks goes to these wonderful people.
andrewmcgivery 💻 |
Digital Alchemist 💻 |
Liam Swayne 💻 |