**Created**:: [[2021-11-27 Saturday]] **Link**:: https://youtu.be/tsecSfnTMow **Duration**:: 7:31  # Summary This video demonstrates the new Markdown embed feature in Excalidraw for Obsidian, showcasing how to easily integrate and manipulate Markdown files within visual spaces. The presenter explains various customization options, including adjusting font types, colors, and file dimensions. Additionally, it covers practical tips for editing and transcluding sections of longer documents, enhancing the user experience in visual note-taking. # Key Takeaways - The new Markdown embed feature allows for easy integration of Markdown files as images in Excalidraw. - Users can customize settings such as width, height, font type, and color for their embeds on both a global and individual file level. - There are efficient ways to reference specific sections of documents using the control and alt-click options, facilitating the management of longer Markdown files. # Content Hi, welcome to a demonstration of the new Markdown embed feature in Excalidraw for Obsidian. If I drag a file from the file explorer and hold down the control key as I drop it onto the canvas, then an image copy of the Markdown file is created. If I hold down the control key and hover over this, then the preview of the file will appear. If I control-click on it or if I control and shift-click on this image, it will open; control-shift will open it on the side. If I'm going to put a couple of exclamation marks here, then as you would expect, those exclamation marks will appear in the image as well. [* ](https://youtu.be/tsecSfnTMow?t=0) You can also do some settings for all of your embeds. Let's look at the settings here. There are four settings that you can configure: you can set the default width of the transcluded Markdown document, the default height, which is the maximum height of the document, and if the document is shorter, then the height will be smaller. You can set the default font as well as the color. So let's do a couple of changes: let's make this a bit skinnier, let's change the font to Cascadia, and let's make the text maybe sky blue. You can use CSS color names or RGB colors here. If I close the settings, then what you will see is the font type has changed, this is now blue, and it's a bit skinnier as well. [* ](https://youtu.be/tsecSfnTMow?t=46) You can also do these settings on a file-by-file level. So if I open my Markdown file and I add the front matter key here, I'm going to add `excalidraw font`, and I can also specify the font here. So let's say I want `virtual font` for this specific file; then if I come back here, you'll see that this changes back to `virtual`. To go a step further, you can also add custom fonts. You can see I have already two custom fonts uploaded here, so if I change this to a custom font, this is a Wolf 2 font. You need to add the file extension as well; then Excalidraw will load that font and display the Markdown file using that font. I can also try this; I was trying some of the Chinese fonts because that has been a request for a number of months now, so hopefully, this is going to take you a step closer to using a Chinese font. This is a TrueType font, and if I come here, then the font, of course, updates to this. [* ](https://youtu.be/tsecSfnTMow?t=106) Now what you will notice is that I don’t see the bottom part because of the height. So I can also alt-control-click on the image, and with that, I can edit and make some modifications here. First of all, I can just simply add the pipe character and add a custom width and a custom maximum height. I'm going to make this 2000 high, and if I press enter, then you can see that now the entire image is available here. Of course, I can zoom in, and this is going to look nice. Also, if I just want to reference a specific section of the document, I can control-alt-click on the image and I can add my reference. Now I can actually decrease the height back to, say, 800. Now, if I press enter, then what you will see is only this chapter, or this section of the document, is transcluded, and the hover preview will show this section of the document as well. [* ](https://youtu.be/tsecSfnTMow?t=188) There's another front matter key, which is `excalidraw font color`, and I set this to, let's say, red. With that, you will see that the transcluded text in this case will turn red. You can also open this in Markdown mode, and here you will see the file, so this is another way of selecting a chapter from the file by simply using Obsidian's function. I'm just going to select the bullet point list heading, and if I come back, then the file is right here. It's now, of course, the 500 width is too much, so in this case, you would probably want to decrease this to say 200, and with that, this is now the transcluded section. [* ](https://youtu.be/tsecSfnTMow?t=267) What I also want to show you is if I take a longer document—so I have this article here that is a bit longer. I'm going to drop it in here. I'm going to delete this one. I can show you that you can make this as long as you want. So I'm now going to control-alt-click on this, and I’m going to set up the width to be 600. This is a really long document, and I'm going to make this 10,000 pixels long, and if I hit enter, then you can see that the entire document is—or actually, it's still not the entire document—but the document is here. You can zoom in if you want, you can also enlarge this, and you can go ahead and make your notes next to it. For example, oops, scroll back to the content, I can just do my highlights here and can process a long document like this. [* ](https://youtu.be/tsecSfnTMow?t=336) One thing that does not work—so let me show you something that doesn't work, but there's also a workaround. So if I drag this Markdown document here and drop it in, you will see that there's a link to Obsidian MD, but that link doesn't work like this. What you can do is hold down the control key and bring up the preview, and within the preview, you can scroll down to the link and click on the link, and then of course, it will open, and it will display the page. So that's the solution in a nutshell, and I hope you find it useful. Thank you. [* ](https://youtu.be/tsecSfnTMow?t=444) # YouTube Details ## YouTube Description Thank you Michael Gartner for the timestamps: [0:00](https://youtu.be/tsecSfnTMow?t=0) - Markdown Embeds [0:52](https://youtu.be/tsecSfnTMow?t=52) - Global Settings [1:46](https://youtu.be/tsecSfnTMow?t=106) - File-by-file Settings [3:10](https://youtu.be/tsecSfnTMow?t=190) - Customize Link [3:50](https://youtu.be/tsecSfnTMow?t=230) - Block Reference [4:30](https://youtu.be/tsecSfnTMow?t=270) - Font Color [4:46](https://youtu.be/tsecSfnTMow?t=286) - Markdown Mode [5:30](https://youtu.be/tsecSfnTMow?t=330) - Really Long Document [6:44](https://youtu.be/tsecSfnTMow?t=404) - Limitation (links) Not mentioned in the video. There is also a command palette action to insert markdown files into drawings. ------- If you find the plugin and/or my videos helpful, please say thanks by buying me a coffee: https://ko-fi.com/zsolt If you'd like to request a feature or report a bug, please raise it on GitHub: https://github.com/zsviczian/obsidian-excalidraw-plugin If you want to connect, you can reach me (@zsviczian) in the Obsidian Members Group (OMG) on Discord or on Twitter. Links --------- My Blog: https://zsolt.blog Obsidian: https://obsidian.md Excaldiraw: https://excalidraw.com ## YouTube Transcript [hi welcome to a demonstration of the new](https://youtu.be/tsecSfnTMow?t=0) [markdown embed feature in xcalidro](https://youtu.be/tsecSfnTMow?t=2) [obsidian if i drag a file from the file](https://youtu.be/tsecSfnTMow?t=5) [explorer and hold down the control key](https://youtu.be/tsecSfnTMow?t=8) [as i drop it onto the canvas then an](https://youtu.be/tsecSfnTMow?t=11) [image copy of the markdown file is](https://youtu.be/tsecSfnTMow?t=14) [created if i hold down the ctrl key and](https://youtu.be/tsecSfnTMow?t=16) [hover over this then the preview of the](https://youtu.be/tsecSfnTMow?t=20) [file will appear if i control click on](https://youtu.be/tsecSfnTMow?t=22) [it or if i ctrl and shift click on this](https://youtu.be/tsecSfnTMow?t=25) [image it will open control shift will](https://youtu.be/tsecSfnTMow?t=29) [open it on the side if i'm going to put](https://youtu.be/tsecSfnTMow?t=32) [a couple of exclamation marks here then](https://youtu.be/tsecSfnTMow?t=36) [as you would expect those exclamation](https://youtu.be/tsecSfnTMow?t=39) [marks will appear](https://youtu.be/tsecSfnTMow?t=41) [in the image as well](https://youtu.be/tsecSfnTMow?t=43) [you can also do](https://youtu.be/tsecSfnTMow?t=46) [some settings for all of your embeds](https://youtu.be/tsecSfnTMow?t=48) [let's look at the settings here there](https://youtu.be/tsecSfnTMow?t=51) [are four settings that you can do you](https://youtu.be/tsecSfnTMow?t=53) [can set the default width of the](https://youtu.be/tsecSfnTMow?t=55) [transcluded markdown document you can](https://youtu.be/tsecSfnTMow?t=57) [set the default height which is the](https://youtu.be/tsecSfnTMow?t=60) [maximum height of the document if the](https://youtu.be/tsecSfnTMow?t=61) [document is shorter then the height will](https://youtu.be/tsecSfnTMow?t=64) [be smaller you can set the font the](https://youtu.be/tsecSfnTMow?t=66) [default font and as well as you can set](https://youtu.be/tsecSfnTMow?t=70) [the color so let's do a couple of](https://youtu.be/tsecSfnTMow?t=73) [changes let's make this](https://youtu.be/tsecSfnTMow?t=74) [a bit skinnier](https://youtu.be/tsecSfnTMow?t=76) [let's change the](https://youtu.be/tsecSfnTMow?t=78) [font to cascadia](https://youtu.be/tsecSfnTMow?t=80) [and let's make the text](https://youtu.be/tsecSfnTMow?t=85) [maybe](https://youtu.be/tsecSfnTMow?t=88) [sky blue you can use css color names or](https://youtu.be/tsecSfnTMow?t=89) [rgb colors here](https://youtu.be/tsecSfnTMow?t=93) [if i](https://youtu.be/tsecSfnTMow?t=95) [close settings then what you will see is](https://youtu.be/tsecSfnTMow?t=96) [the font type has changed this is now](https://youtu.be/tsecSfnTMow?t=99) [blue and it's a bit skinnier](https://youtu.be/tsecSfnTMow?t=102) [as well](https://youtu.be/tsecSfnTMow?t=104) [you can also do these settings on a file](https://youtu.be/tsecSfnTMow?t=106) [by file level so if i open my markdown](https://youtu.be/tsecSfnTMow?t=109) [file and i add the](https://youtu.be/tsecSfnTMow?t=112) [front matter key here i'm going to add](https://youtu.be/tsecSfnTMow?t=115) [excalid raw](https://youtu.be/tsecSfnTMow?t=119) [font](https://youtu.be/tsecSfnTMow?t=121) [and i can also specify the font here so](https://youtu.be/tsecSfnTMow?t=122) [let's say i want](https://youtu.be/tsecSfnTMow?t=126) [virtual font](https://youtu.be/tsecSfnTMow?t=127) [for this specific file then if i come](https://youtu.be/tsecSfnTMow?t=129) [back here then you will see that this](https://youtu.be/tsecSfnTMow?t=132) [changes back to](https://youtu.be/tsecSfnTMow?t=134) [virtual](https://youtu.be/tsecSfnTMow?t=136) [to go a step further you can also add](https://youtu.be/tsecSfnTMow?t=137) [custom fonts so you can see i have](https://youtu.be/tsecSfnTMow?t=140) [already two custom fonts uploaded here](https://youtu.be/tsecSfnTMow?t=143) [so if i change this to](https://youtu.be/tsecSfnTMow?t=146) [a custom font this is a wolf 2 font you](https://youtu.be/tsecSfnTMow?t=149) [need to add the file extension as well](https://youtu.be/tsecSfnTMow?t=152) [then xcalidraw will load that font and](https://youtu.be/tsecSfnTMow?t=156) [display the markdown file using that](https://youtu.be/tsecSfnTMow?t=160) [font i can also try this i was trying](https://youtu.be/tsecSfnTMow?t=163) [some of the chinese fonts because that](https://youtu.be/tsecSfnTMow?t=166) [has been a request for a number of](https://youtu.be/tsecSfnTMow?t=169) [months now so hopefully this is going to](https://youtu.be/tsecSfnTMow?t=172) [be taking you a step closer to using a](https://youtu.be/tsecSfnTMow?t=175) [chinese font so this is a true type font](https://youtu.be/tsecSfnTMow?t=177) [if i come here then the](https://youtu.be/tsecSfnTMow?t=181) [font of course](https://youtu.be/tsecSfnTMow?t=183) [updates to this now what you will notice](https://youtu.be/tsecSfnTMow?t=185) [as well that here i don't see the bottom](https://youtu.be/tsecSfnTMow?t=188) [part because of the height](https://youtu.be/tsecSfnTMow?t=190) [so i can also](https://youtu.be/tsecSfnTMow?t=193) [alt control click on the image and with](https://youtu.be/tsecSfnTMow?t=195) [that i can edit do some edits here so](https://youtu.be/tsecSfnTMow?t=199) [first of all i can](https://youtu.be/tsecSfnTMow?t=203) [just simply add the pipe character and](https://youtu.be/tsecSfnTMow?t=205) [add a custom width and a custom maximum](https://youtu.be/tsecSfnTMow?t=209) [height i'm going to make this 2000](https://youtu.be/tsecSfnTMow?t=213) [high and if i press enter then you can](https://youtu.be/tsecSfnTMow?t=216) [see that now the entire image is](https://youtu.be/tsecSfnTMow?t=219) [available here of course i can zoom in](https://youtu.be/tsecSfnTMow?t=223) [and then this is going to](https://youtu.be/tsecSfnTMow?t=225) [look nice](https://youtu.be/tsecSfnTMow?t=228) [also if i just want to](https://youtu.be/tsecSfnTMow?t=229) [reference a specific section of the](https://youtu.be/tsecSfnTMow?t=232) [document again i can control alt click](https://youtu.be/tsecSfnTMow?t=234) [on the image and i can add](https://youtu.be/tsecSfnTMow?t=238) [my](https://youtu.be/tsecSfnTMow?t=240) [reference](https://youtu.be/tsecSfnTMow?t=241) [and now if now i can actually decrease](https://youtu.be/tsecSfnTMow?t=242) [the height to back to say 800](https://youtu.be/tsecSfnTMow?t=246) [now if i](https://youtu.be/tsecSfnTMow?t=249) [press enter then what you will see is](https://youtu.be/tsecSfnTMow?t=251) [only this](https://youtu.be/tsecSfnTMow?t=255) [chapter or this section of the document](https://youtu.be/tsecSfnTMow?t=257) [is transcluded and the hover preview](https://youtu.be/tsecSfnTMow?t=260) [will show this section of the document](https://youtu.be/tsecSfnTMow?t=263) [as well](https://youtu.be/tsecSfnTMow?t=266) [there's another](https://youtu.be/tsecSfnTMow?t=267) [front matter key which is x colored raw](https://youtu.be/tsecSfnTMow?t=268) [font color](https://youtu.be/tsecSfnTMow?t=272) [and i set this to let's say](https://youtu.be/tsecSfnTMow?t=274) [red](https://youtu.be/tsecSfnTMow?t=277) [and with that](https://youtu.be/tsecSfnTMow?t=278) [you will see that the transcluded text](https://youtu.be/tsecSfnTMow?t=280) [in this case will turn red](https://youtu.be/tsecSfnTMow?t=283) [you can also open this in markdown mode](https://youtu.be/tsecSfnTMow?t=286) [and](https://youtu.be/tsecSfnTMow?t=290) [here you will see the](https://youtu.be/tsecSfnTMow?t=291) [file so this is another way of selecting](https://youtu.be/tsecSfnTMow?t=293) [a chapter from the file](https://youtu.be/tsecSfnTMow?t=296) [by](https://youtu.be/tsecSfnTMow?t=299) [simply using obsidian's function so i'm](https://youtu.be/tsecSfnTMow?t=300) [just going to select the bullet point](https://youtu.be/tsecSfnTMow?t=303) [list](https://youtu.be/tsecSfnTMow?t=306) [heading and if i come back then](https://youtu.be/tsecSfnTMow?t=307) [the](https://youtu.be/tsecSfnTMow?t=310) [file is right here it's](https://youtu.be/tsecSfnTMow?t=311) [now of course the width the 500 width](https://youtu.be/tsecSfnTMow?t=313) [is too much so in this case you would](https://youtu.be/tsecSfnTMow?t=317) [probably want to](https://youtu.be/tsecSfnTMow?t=320) [decrease this to say 200](https://youtu.be/tsecSfnTMow?t=321) [and with that](https://youtu.be/tsecSfnTMow?t=324) [this is now](https://youtu.be/tsecSfnTMow?t=327) [the transcluded section](https://youtu.be/tsecSfnTMow?t=328) [what i also want to show you is if i](https://youtu.be/tsecSfnTMow?t=331) [take a longer document so i have this](https://youtu.be/tsecSfnTMow?t=333) [article here that is](https://youtu.be/tsecSfnTMow?t=336) [a bit longer so i'm going to](https://youtu.be/tsecSfnTMow?t=338) [drop it in here](https://youtu.be/tsecSfnTMow?t=341) [i'm going to delete this one](https://youtu.be/tsecSfnTMow?t=343) [i can show you that you can make this as](https://youtu.be/tsecSfnTMow?t=345) [long as you want so i'm now going to](https://youtu.be/tsecSfnTMow?t=348) [control alt](https://youtu.be/tsecSfnTMow?t=352) [click on this](https://youtu.be/tsecSfnTMow?t=354) [and i'm going to](https://youtu.be/tsecSfnTMow?t=355) [set up the width to be](https://youtu.be/tsecSfnTMow?t=357) [600 this is a really long document and](https://youtu.be/tsecSfnTMow?t=360) [i'm going to make this](https://youtu.be/tsecSfnTMow?t=363) [10 000](https://youtu.be/tsecSfnTMow?t=364) [pixels long and if i hit enter then you](https://youtu.be/tsecSfnTMow?t=366) [can see that the entire document](https://youtu.be/tsecSfnTMow?t=369) [is or actually it's still not the entire](https://youtu.be/tsecSfnTMow?t=373) [document but the document is here](https://youtu.be/tsecSfnTMow?t=375) [you can zoom in if you want you can also](https://youtu.be/tsecSfnTMow?t=379) [enlarge this and you can go ahead](https://youtu.be/tsecSfnTMow?t=383) [and make your notes next to it so for](https://youtu.be/tsecSfnTMow?t=386) [example](https://youtu.be/tsecSfnTMow?t=389) [oops scroll back to content i can](https://youtu.be/tsecSfnTMow?t=391) [just do my highlights here](https://youtu.be/tsecSfnTMow?t=395) [and](https://youtu.be/tsecSfnTMow?t=398) [can process a long document like this](https://youtu.be/tsecSfnTMow?t=399) [one thing that does not work so let me](https://youtu.be/tsecSfnTMow?t=403) [show you something that doesn't work but](https://youtu.be/tsecSfnTMow?t=405) [there's also a workaround so if i drag](https://youtu.be/tsecSfnTMow?t=408) [this markdown document here](https://youtu.be/tsecSfnTMow?t=411) [and drop it in](https://youtu.be/tsecSfnTMow?t=414) [you will see that there's a link](https://youtu.be/tsecSfnTMow?t=416) [to obsidian md but that link doesn't](https://youtu.be/tsecSfnTMow?t=418) [work like this what you can do is you](https://youtu.be/tsecSfnTMow?t=421) [can hold down](https://youtu.be/tsecSfnTMow?t=423) [the control key and bring up the](https://youtu.be/tsecSfnTMow?t=425) [preview and within the preview you can](https://youtu.be/tsecSfnTMow?t=429) [scroll down to the link and you can](https://youtu.be/tsecSfnTMow?t=431) [click on the link and then of course it](https://youtu.be/tsecSfnTMow?t=434) [will](https://youtu.be/tsecSfnTMow?t=436) [open](https://youtu.be/tsecSfnTMow?t=437) [and it will](https://youtu.be/tsecSfnTMow?t=438) [display the page](https://youtu.be/tsecSfnTMow?t=440) [so that's](https://youtu.be/tsecSfnTMow?t=443) [the solution in a nutshell](https://youtu.be/tsecSfnTMow?t=444) [and i hope you find it useful thank you](https://youtu.be/tsecSfnTMow?t=447)