New Features in Obsidian Excalidraw Plugin

Obsidian's new features enhance drawing with canvas candy support, improved context menus, PDF imports, and customizable laser tools.

### New Features in Obsidian EXC Calit Draw: Enhancements for Better User Experience
* 🖌 The demonstration begins with the introduction of the **new canvas candy support**, allowing users to **enhance their drawings** by seamlessly integrating them into the demo canvas.
* 📊 A flowchart illustrates how to use the canvas candy feature, emphasizing the **importance of editing the front matter** to achieve the **desired visual outcome**.
* 🎨 Users can add a CSS class to **remove borders around drawings**, creating a **more immersive experience** on the canvas, which is highlighted as a **significant improvement**.
* 📂 The new context menu actions enable users to **insert files or links quickly**, making it easier to manage content within the Excalidraw environment, especially beneficial for **mobile users**.
* 📄 The PDF import options allow users to choose how to import pages, either **left to right in rows** or **top to bottom in columns**, providing flexibility in how content is displayed.
* 🔒 The ability to **lock imported pages** while allowing for grouped or ungrouped elements enhances usability, making it **easier to manage the imported content**.
* 💡 The final feature discussed is the **laser pointer configuration**, where users can **customize the color and behavior**, allowing for **more effective presentations and explanations**.
* ✨ Overall, these new features aim to **improve user experience and functionality** within Obsidian EXC Calit Draw, catering to **various needs and preferences**.

hey everyone jolt here I quickly wanted to demonstrate to you four new features in obsidian EXC calit draw I'd like to start with showing you canvas candy support then we'll look at the new context menu actions then we'll look at the PDF import options and finally we'll

look at the laser tool configurations so let's dive in to demonstrate canvas candy I thought I would also show you the mermaid to excal draw feature so here I created this flowchart that explains how the canvas candy support works so let's first drop this drawing into our

demo canvas so I'm just going to simply drag and drop this item in here and what you can see is well this doesn't look exactly great it has a background color it doesn't match the background of my canvas so let's look at some things that

we can do so I'm going to head back to my drawing and I'm going to do one thing here I'm going to switch over to markdown view mode and here I'm going to be editing the front matter of this document now if you don't see the front

matter then there can be two reasons for that you might be seeing the properties so then here in the obsidian editor settings you have this set to visible and then you will see the properties in the document in xro I personally don't like the properties mode so I will now

demonstrate to you the features with source mode but of course you can do this with properties as well it's just a little bit more difficult so I recommend first practicing in source mode because then you can follow the way I'm doing it in the video so first of all I'm going

to add an excal draw export transparent here and I'm I'm going to set export transparent to true I'm going to come back here close the demo canvas and open it again now you can see that this is not yet a perfect result because now the drawing is not

visible so I need to come back to my drawing I'm going to switch to excal drawing and I'm just going to switch this to dark mode now we are getting somewhere because if now I come back to my canvas then you can see that now

I have my drawing it's visible but it has its border around it so now I'm going to come back here and I'm going to add a canvas candy CSS class to this document I'm going to write CSS classes and I'm going to just write CC for

canvas candy and I'm going to write border none like this I'm going to save this and when I come back here I need to close the demo canvas and open the demo canvas again you will see the magic that now I have the drawing right

here but it doesn't have the border around it I think this just looks beautiful on the canvas it's like a drawing that you've placed on the canvas right here and if we look at the process itself our process you need to get canvas candy of course I'll include the

link in the video description then you need to create an excal draw drawing you need to switch to markdown view mode as I just shown you you need to turn on the properties if you don't see them so you can do that in the obsidian editor

settings and then you need to add the canvas candy CSS class. Now, I have to say most of the CSS classes have no effect on the drawing, but I think the border-none CSS class is a super useful class and it makes your drawings much more immersive on your

canvas. And then all you need to do is to celebrate. So that's about the canvas candy support. Now, looking at the new context menu action, so first of all, now you can insert any file or insert a link to a file simply by clicking here. So, for

example, if I want to insert how to read a paragraph, the link to the PDF file, then I can just simply insert it here. Or if I have an object and I want to add a link to this object, again I can right click and I can add

insert link to file and here I can add my link, for example, to the visual PKM logo, and now that link was added and you can see the image right here. Similarly, and this is more interesting for mobile use cases, you can open a link by right

clicking or long clicking on an item and choosing to open the link. This is especially good when you have embedded Excalidraw drawings that you want to navigate to. Now, it is easy also on a mobile because you can just simply open a link. And finally, if if you have text

for example, in this case I have these text boxes right here. I'm going to place this here. Now, if I'm brainstorming on my Excalidraw canvas, I might want to convert some of these into embedded markdown files and continue my brainstorming there. So, imagine that in this case I have a couple

of bullet points so bullet one, bullet two, etc. So I have this piece of text and I want to convert this into its own markdown document. Now you can do it because you now right-click on this element and you can just simply select "Convert to File". And when you do this, I'm

going to give this a file name. So this is the file name, I'm going to press enter, and with this the document was added, and I can now resize it so it will get the size of the original object. And from now on this is a separate markdown file that

you can continue to edit here in Skolar Draw. So that's about the new context menu actions. Now let me clear everything here and show you the new PDF import features. So if I choose "Insert any file" now, I can choose it from here as well. If

I choose "Insert any file", I'm going to choose "How to Read a Paragraph" to demonstrate the feature to you. I want to import this as a PDF, I want to import pages 1 through 15. Now there are two things that you can do when

importing. First of all, you can set if the import should go from left to right and then go in rows, or if it should go top to bottom in columns. So let me show you first. First, I'm going to import this left to right in three columns. So this

is how the pages will go. Then I click "Import PDF", the "Import PDF" runs, and you will see, let me just switch over to light mode so we can see the text better. You can see that the pages were imported like this. Now also what you can see, but I didn't

show you yet is now the elements are grouped together but let me show you the other way of importing as well so I'm going to place this to the side and now I'm going to choose insert any file how to read a paragraph and I'm going to

import this as a PDF again I'm importing Pages 1 through 15 now I'm going to turn off group elements and I'm going to switch to top down so now this is going to create three rows and the rows will be as long as required so you can

imagine you will see what you see here but transposed and when I click import PDF then the pages are going to be imported like this and of course it looks different because the geometry of the pages are different but you can see that here I have three rows and the text

actually goes like this so you read top down and this is how the pages go so you can see based on the empty pages how they come after one another and also what I want to show you is now the elements are not grouped but one by one

why is grouping important well let me just show you the final demonstration so I'm going to actually delete these two I'm going to once more import how to read the paragraph again I'm now I'm just going to import Pages 1 through 10

and I'm going to click here to lock Pages after import but I'm not going to group the pages so when I do this locking the pages has the benefit that I can easily write over this and I cannot select the item so they are locked to

the background this is super useful but now I need to unlock elements one by one which can be pretty tedious if you want to move the pages around and this is why it's great to import how to read a paragraph again Pages 1 through 10 but

this time I'm going to group the elements and I'm going to import it like this again the end result is this is locked but now I can unlock all of the elements with a single click instead of the previous case where I unlocked two pages but the rest I haven't so that's

the difference between the two approaches so just in a nutshell the new features here are a that you can now group or not group elements as you import them and you can choose whether you want to go top down so you want to import in columns or you

want to import in rows and the final feature I want to show you is how you can configure the laser pointer so you can see that my laser pointer now is this yellow color if you come to EXC color plug-in settings and you look under appearance

and behavior you will find the laser pointer here and you can set what color you want your laser pointer to be so you can go back to this red and also you can create a longer delay how the laser pointer disappears as well as a longer decay length so if I

increase these two then what you will see is as I draw the line will disappear much slower so you can see that it disappears but it disappears slower so if you want to mark multiple items on a drawing and you want to explain like this then this gives you more freedom to

do this and of course with the length and with the delay time you can configure this to fit your needs. So those were the four elements I wanted to show you. I hope you find them useful and I hope to see you next time. Thank you.

Excalidraw-Obsidian 2.0.0 Feature Walkthrough

A channel about visual tools and techniques for Personal Knowledge Management

Zsolt's Visual Personal Knowledge Management

Canvas Candy Support and Excalidraw Integration

Demonstrates importing an Excalidraw flowchart into Obsidian canvas.

Addresses initial background color mismatch issues.

Explains editing the front matter in markdown view for transparency.

Shows how to achieve transparency using 'export transparent: true' in front matter.

Uses CSS class 'CC border-none' to remove borders for seamless integration.

Inserting files or links via right-click.

Opening links directly from the context menu (useful for mobile).

Converting text elements into separate markdown files.

Importing specific page ranges from PDFs.

Choosing between left-to-right (rows) and top-to-bottom (columns) import order.

Grouping imported elements for easier manipulation.

Locking pages after import to prevent accidental changes.

Customizing laser pointer color in Excalidraw plugin settings.

Adjusting the delay and decay length of the laser pointer.