Embed Code File

by Abdullah Almariah
5
4
3
2
1
Score: 23/100

Description

Category: Coding & Technical Tools

The Embed Code File plugin allows users to seamlessly embed code files from their Obsidian vault or remote sources, such as GitHub, directly into their notes. This plugin supports specifying file paths, highlighting specific lines, and adding custom titles to code blocks for better organization and readability. Designed to work optimally with Obsidian's live preview feature, it enhances code visualization and interaction within the note-taking environment. Users can define additional programming languages for compatibility, making it a versatile tool for developers and technical writers.

Reviews

No reviews yet.

Stats

72
stars
8,429
downloads
14
forks
1,341
days
632
days
1,338
days
6
total PRs
4
open PRs
0
closed PRs
2
merged PRs
15
total issues
15
open issues
0
closed issues
0
commits

Latest Version

4 years ago

Changelog

  • Add support for remote file
  • Fix YAML parse exception

README file from

Github

Embed Code File (Obsidian Plugin)

This plugin allows to embed code files from Obsidian vault or remote file (eg., GitHub). It works better with live preview feature of Obsidian.

Settings

The plugin include multiple language by default (c,cpp,java,python,go,ruby,javascript,js,typescript,ts,shell,sh,bash). You can include any needed language to the comma separated list.

How to use

First you need to activate the plugin from Community Plugins. Then you can embed the code as follow:

```embed-<some-language>
PATH: "vault://<some-path-to-code-file>" or "http[s]://<some-path-to-remote-file>"
LINES: "<some-line-number>,<other-number>,...,<some-range>"
TITLE: "<some-title>"
```

Examples:

Vault File:
```embed-cpp
PATH: "vault://Code/main.cpp"
LINES: "2,9,30-40,100-122,150"
TITLE: "Some title"
```
Remote File:
```embed-cpp
PATH: "https://raw.githubusercontent.com/almariah/embed-code-file/main/main.ts"
LINES: "30-40"
TITLE: "Some title"
```

where PATH, LINES and TITLE properties are set as YAML key-value pairs:

  • The PATH should be a code file in the vault or remote. If you have used GitHub for example, make sure to use https://raw.githubusercontent.com/...

  • The LINES will include only the specified lines of the code file. Every set of included lines either range or explicit line will append dots (...) to included line in a newline. If you want to get rid of dots, minimize the number of sets by using one range as much as you can.

  • If TITLE is not set, then the title of the code block will be PATH value.

You can use also TITLE with normal code block (without embed-), but make sure that the title value is set with double quotes:

```cpp TITLE: "Some title"
// some code
...
```

Using live preview feature will enhance the embedding experience.

Demo

Embed code file

Gif

Embed lines from code file

Gif

Embed lines from remote file (eg., GitHub)

Gif

Add title to normal code block

Gif

Similar Plugins

info
• Similar plugins are suggested based on the common tags between the plugins.
Execute Code
4 years ago by twibiral
Obsidian Plugin to execute code in a note.
Link Embed
4 years ago by SErAphLi
This plugin allow you to convert URLs in your notes into embeded previews.
VSCode Editor
3 years ago by Sun Xvming
Edit Code Files like VSCode in Obsidian.
Better File Link
5 years ago by Marc Julian Schwarz
A plugin for the note taking app Obsidian to add better external file links to your notes.
Shiki Highlighter
2 years ago by Moritz Jung
An Obsidian plugin that offers better code highlighting via shiki and Expressive Code.
Code Files
3 years ago by Lukas Bach
Plugin for ObsidianMD to show and edit code files along other notes.
Code Block
4 years ago by Patrik Lindefors
Code block from selection
5 years ago by Dmitry Savosh
Obsidian plugin. Adds code block for the selected text.
Local Quotes
4 years ago by ka1tzyu
📜 Collect your quotes from all over the vault and embed them in different locations with refresh delays
GitHub Embeds
3 years ago by Gino Valente
Embed GitHub issues, PRs, and code snippets directly in Obsidian
Local Media Embedder
2 years ago by seyf1elislam
an obsidian plugin allows you to Embed videos and images and audios from your local device in your notes.
Code Block Labels
4 years ago by Sean Bowers
Provides labels for codeblocks in Obsidian
Stenography
5 years ago by bramses
Notion Video Embed
4 years ago by lastknightcoder
Code::Stats
3 years ago by MiskaMyasa
The Code::Stats plugin allows you to track your coding progress and earn XP for writing markdown in the Obsidian editor.
Send to Canvas
10 months ago by wenlzhang
An Obsidian plugin that allows you to send tasks, blocks, and notes to Canvas files as plain text, links, and embeds.
Simple Code Formatter
2 years ago by SY
Format current code block in obsidian.
Figma Embed
2 years ago by Kyle Kochanek
Obsidian plugin to embed live Figma files in your markdown notes.
Alt-Click to Copy
2 years ago by Veer Sheth
Code Language Completer
2 years ago by Stanley Wang
minimal Obisdian plugin, fine-tuned to speed up developer note-taking
Svelte Syntax Highlighter
2 years ago by Typhoon-Kim
This plugin adds Svelte syntax highlighting to Obsidian.
Model Viewer
a year ago by Janis Pritzkau
An Obsidian plugin to view and embed 3D models using Google’s <model-viewer> component.
Snippetsaurus
a year ago by Christian Humbert
Inline Code Copy
a year ago by Hongchen Lin
ruby.wasm
2 years ago by geeknees
Obsidian RubyWasm Plugin
Paste as Embed
2 years ago by Matt Laporte
Obsidian plugin to paste contents of clipboard into a new note, and embed it in the active note.