**Created**:: [[2024-02-02 Friday]] **Link**:: https://youtu.be/4wp6vLiIdGM **Duration**:: 10:09  # Summary In this video, Zsolt demonstrates the new PDF cropping feature available in Excalidraw within Obsidian. He explains how users can efficiently capture and crop images from PDF documents while maintaining a connection to the original source, enhancing note-taking capabilities. Additionally, he discusses custom settings for file management and introduces a new feature for rounding image corners. # Key Takeaways - Users can crop images directly from PDF documents in Excalidraw, preserving links to the original source for better reference. - The cropping tool allows for customization, including the option to change the background color of cropped images and manage where cropping files are saved. - New enhancements in Excalidraw include the ability to round the corners of images for a more visually appealing note presentation. # Content Hey everyone, Zsolt here. So, when you're reading a PDF document in Obsidian, what do you do when there's an image that you want to capture for your notes? Well, what I do is I start the screen capture tool, I select the image, and then I press paste, and I have my image here. This solution is only sort of good. The main problem with this solution is that this image has now lost its connection to its original source. Of course, I can use a naming convention; I can give this image a name, and with that, I can reference back to the source, but it is not really such a good solution. So, I've extended the Excalidraw image cropping feature to support PDF documents. This is how it works. So, for example, now I'm on the canvas, but I'm going to show you the same via in Obsidian in a markdown note and with Excalidraw as well. So here I'm now in a canvas note, and I'm reading this PDF document. I'm on this active page, and I want to capture this image. All I need to do is press Control or Command P and type in "crop," and with this, the image cropper opens. I can just simply drag from the top and drag from the bottom. I can also drag from the side to make this image exactly the size I want, and with that, I have the cropped image here. Now, if you're interested, the cropper has additional features, so I recommend you watch my other video on cropping; for example, I can mask out parts of the image. But we'll talk about that in the other video. What I want to show you now is the big difference here is when I double-click on this image, then this menu opens, and here I can choose to either open the cropper so I can change the cropping of this image, or I can open the original location of the file. So, when I click here, then my PDF opens on the page from which I cropped the image. [* ](https://youtu.be/4wp6vLiIdGM?t=0) Now, let me show you how this feature works in a markdown note. So, let's create a new markdown note, and I'm just going to add "how to read" a paragraph here. So, what doesn't work is if I read a document here, I don't know which page you're on. So that, unfortunately, doesn't work. What does work is when you're on a page, you can add "#page=9," for example, and with this, the PDF document opens on page nine. So you can see the page number right there—that's the page number. Now, if I stand with the cursor on this line, so this line is the active line, I can again open the command palette and choose "crop and mask image," and it will take this page and open it in the cropper. Now, in the cropper, I can again just simply do my cropping like this, and when I'm done, then getting back to my document, you can see that it's now the image, and the image even has a link reference at the bottom. But of course, if I double-click on the image, then I can still open the original file as well, just as in the case of the canvas. [* ](https://youtu.be/4wp6vLiIdGM?t=40) Now, to show you maybe a better way of achieving this, the way I would do this is I would read a PDF document in the PDF reader like here, and when I get to a page where I have an image that I want to capture, I would simply select a part of the text from this page. So, I'm now in the PDF reader, I select a part of the page, and I copy a link to the section like this. Then I head back to my markdown document, and I simply add this link to the section, and after adding the link to the section, I can open the cropper, and it will open that section, and again, I can simply do my cropping. So, you will see that I can crop the image like this and like this. Now, what you will also notice is this is hard to read or sometimes hard to read, so some of the PDF documents have a transparent background. There are two things that you should know about this. First of all, if you find this hard to read, you can always click here and change the background, maybe to white, and then the text will be visible very nicely. The other thing I want to show you is here. If I open the properties panel, you will see that I have a special property here: CSS classes—"excalidraw-crop-PDF-page." So, if I remove this, then what you will see is when this image refreshes, so I will need to change this and change it back, then this image will not have a background color. So, you might or might not want this. What I want to highlight is here: you can create or define your own CSS classes. So, if instead of white you want a yellow background or whatever other color for the page color of the PDF, you can change the CSS classes here. Here the only thing is you need to refresh the link so the CSS class is applied when the image is embedded. And then finally, let me show you how this works in Excalidraw. It works pretty similarly to the previous ones. So, I'm going to add "how to read a paragraph" as an embeddable. So now I have the "how to read a paragraph" document embedded into Excalidraw. I can—oops—I can click on this, and I can scroll to the part that I want to crop. So, I'm here now. If I press "crop image," then this page opens, and everything works similar, so I can just simply crop this page like this, and when I'm done with cropping, then I can turn back to Excalidraw; my image is going to get updated, and here you go. So I can now close this, and I can navigate with this image. There are two more small things that I want to show you regarding cropping, and then there's one more thing I want to show you as a new feature in this version of Excalidraw in Obsidian. So first, about cropping, there are two new settings that you can use. Setting number one is under basic. Here, there's a crop file folder. So the way Excalidraw crops an image is it creates an image cropper, so the image remains your PDF file. The cropping will always read the PDF and create the crop out of that or the cropped image out of that. But you might want to save the Excalidraw cropping file to a specified folder. So if you set a folder here, then the cropping file will go to that folder. If not, then the cropping file will follow your files and links settings. So, in my case, it's going to go in a subfolder under the current folder called "attachments." So that's your option that you can define a dedicated folder for your crop files. The other setting I added is under saving and file name, and here you can add a prefix for the crop file. I now have "cropped," but maybe you just want to add "C" or whatever. If this is empty, then "cropped" will be added or used, so you can add an underscore if you want to leave this sort of empty—that's another setting. And then finally, the new feature I wanted to show you is just a small new feature. So, I'm going to insert an image, and I'm going to choose my lovely monkey here. So the new feature is now you can round the corners of images. So here in the properties, I can click "rounded corner," and then the image will have rounded corners. So if you like rounded images, now with an image, you can easily achieve that. So that's all I wanted to show you today. I think this cropping feature is really powerful. You can crop and mask images; you can crop and mask PDF pages. PDF pages retain their links to the original source, and overall, since I've implemented this feature, I'm amazed at how many cases I've used it. This is such a cool feature. I recommend you try it out and play with it. Enjoy! Thank you! [* ](https://youtu.be/4wp6vLiIdGM?t=577) # YouTube Details ## YouTube Description ✏️ Sign up for the Visual Thinking Workshop: https://www.visual-thinking-workshop.com/ 🚀 Cohort 8 starts on April 6, 2024. 📔 We will be summarizing Atomic Habits by James Clear into a book-on-a-page ----- The Excalidraw-Obsidian 2.0.19 update extends the powerful Image Cropping and Masking superpowers to PDF documents in Excalidraw, Canvas, and Markdown Notes. If you find my videos helpful, please say thanks by buying me a coffee: https://ko-fi.com/zsolt 📩 If you want to connect, you can reach me: (@zsviczian) on the Obsidian Members Group (OMG) on Discord, or on 🐦 Twitter: https://twitter.com/zsviczian ----- 🍿Watch next: 📽️ Image cropping and masking: https://youtu.be/uHFd0XoHRxE 📽️ Vintage Mask Script: https://youtube.com/shorts/ST6h4uaXmnY?feature=share 📽️ Visual Zettelkasten - using both sides of the sheet https://youtu.be/uoNHkCLsp3g 📽️ Deconstructing Visual Ideas with Obsidian Excalidraw using Excalidraw Scripts https://youtu.be/HRtaaD34Zzg 📽️ Block Reference Images https://youtu.be/yZQoJg2RCKI 📽️ The Fourth Font https://youtu.be/eKFmrSQhFA4 --------- Visual Thinking Workshop: https://www.visual-thinking-workshop.com/ Full catalog of videos: https://excalidraw-obsidian.online/Hobbies/Excalidraw+Blog/Catalogue+of+Videos My blog: https://zsolt.blog/ Obsidian: https://obsidian.md Excalidraw-Obsidian: https://github.com/zsviczian/obsidian-excalidraw-plugin/ 2.0.19 Release Notes: https://github.com/zsviczian/obsidian-excalidraw-plugin/releases/tag/2.0.19 #excalidraw #sketchnotes #obsidianmd #pkm ## YouTube Transcript [hey everyone jol here so when you're](https://youtu.be/4wp6vLiIdGM?t=0) [reading a PDF document in obsidian what](https://youtu.be/4wp6vLiIdGM?t=2) [do you do when there's an image that you](https://youtu.be/4wp6vLiIdGM?t=6) [want to capture for your noes well what](https://youtu.be/4wp6vLiIdGM?t=8) [I do is I start the screen capture tool](https://youtu.be/4wp6vLiIdGM?t=11) [I select the image and then I press](https://youtu.be/4wp6vLiIdGM?t=14) [paste and I have my image](https://youtu.be/4wp6vLiIdGM?t=16) [here this solution is only sort of good](https://youtu.be/4wp6vLiIdGM?t=19) [the main problem with this solution is](https://youtu.be/4wp6vLiIdGM?t=23) [that this image has now lost its](https://youtu.be/4wp6vLiIdGM?t=26) [connection to it original source of](https://youtu.be/4wp6vLiIdGM?t=29) [course I can use a naming convention I](https://youtu.be/4wp6vLiIdGM?t=31) [can give this image a name and with that](https://youtu.be/4wp6vLiIdGM?t=35) [I can reference back to the source but](https://youtu.be/4wp6vLiIdGM?t=38) [it is not really such a good](https://youtu.be/4wp6vLiIdGM?t=40) [solution so I've extended the exol draw](https://youtu.be/4wp6vLiIdGM?t=43) [image cropping feature to support PDF](https://youtu.be/4wp6vLiIdGM?t=47) [documents this is how it works so for](https://youtu.be/4wp6vLiIdGM?t=50) [example now I'm on canvas but I'm going](https://youtu.be/4wp6vLiIdGM?t=54) [to show you the same VI an obsidian an](https://youtu.be/4wp6vLiIdGM?t=56) [markdown note and with exol draw as well](https://youtu.be/4wp6vLiIdGM?t=60) [so here I'm now in a canvas node and I'm](https://youtu.be/4wp6vLiIdGM?t=64) [reading this PDF document I'm on this](https://youtu.be/4wp6vLiIdGM?t=68) [active page and I want to capture this](https://youtu.be/4wp6vLiIdGM?t=71) [image so all I need to do is press](https://youtu.be/4wp6vLiIdGM?t=73) [control or command p and type in crop](https://youtu.be/4wp6vLiIdGM?t=76) [and with this the image Cropper opens](https://youtu.be/4wp6vLiIdGM?t=80) [and I can just simply drag from the top](https://youtu.be/4wp6vLiIdGM?t=83) [and drag from the bottom I can also ra](https://youtu.be/4wp6vLiIdGM?t=87) [from the side to make this image exactly](https://youtu.be/4wp6vLiIdGM?t=90) [the size I want and with that I have the](https://youtu.be/4wp6vLiIdGM?t=93) [cropped image here now if you're](https://youtu.be/4wp6vLiIdGM?t=96) [interested the Cropper has additional](https://youtu.be/4wp6vLiIdGM?t=98) [features so I recommend you watch my](https://youtu.be/4wp6vLiIdGM?t=100) [other video on cropping for example I](https://youtu.be/4wp6vLiIdGM?t=103) [can mask out parts of the image but](https://youtu.be/4wp6vLiIdGM?t=105) [we'll talk about that in the other video](https://youtu.be/4wp6vLiIdGM?t=109) [what I want to show you now is the big](https://youtu.be/4wp6vLiIdGM?t=112) [difference here is when I double click](https://youtu.be/4wp6vLiIdGM?t=115) [on this image then this menu opens and](https://youtu.be/4wp6vLiIdGM?t=117) [here I can choose to either open the](https://youtu.be/4wp6vLiIdGM?t=121) [Cropper so I can change the cropping of](https://youtu.be/4wp6vLiIdGM?t=123) [this image or I can open the original](https://youtu.be/4wp6vLiIdGM?t=126) [location of the file so when I click](https://youtu.be/4wp6vLiIdGM?t=130) [here then my PDF opens on the page from](https://youtu.be/4wp6vLiIdGM?t=133) [which I cropped the image now let me](https://youtu.be/4wp6vLiIdGM?t=137) [show you how this feature Works in a](https://youtu.be/4wp6vLiIdGM?t=140) [markdown note so let's create a new](https://youtu.be/4wp6vLiIdGM?t=143) [markdown note and I'm just going to add](https://youtu.be/4wp6vLiIdGM?t=147) [how to read a paragraph here so what](https://youtu.be/4wp6vLiIdGM?t=150) [doesn't work is if I read a document](https://youtu.be/4wp6vLiIdGM?t=154) [here I don't know which page you're on](https://youtu.be/4wp6vLiIdGM?t=157) [so that unfortunately doesn't work what](https://youtu.be/4wp6vLiIdGM?t=160) [does work is when you're on a page you](https://youtu.be/4wp6vLiIdGM?t=163) [can add hash page equals for example 9](https://youtu.be/4wp6vLiIdGM?t=165) [and with this the PDF document opens on](https://youtu.be/4wp6vLiIdGM?t=170) [page nine so you can see the page number](https://youtu.be/4wp6vLiIdGM?t=174) [right there that's the page number now](https://youtu.be/4wp6vLiIdGM?t=177) [if I stand with the cursor on this line](https://youtu.be/4wp6vLiIdGM?t=179) [so this line is the active line I can](https://youtu.be/4wp6vLiIdGM?t=182) [again open the command pallet and choose](https://youtu.be/4wp6vLiIdGM?t=185) [crop and mask image and it will take](https://youtu.be/4wp6vLiIdGM?t=188) [this page and open it in the Cropper now](https://youtu.be/4wp6vLiIdGM?t=192) [in the Cropper I can again just simply](https://youtu.be/4wp6vLiIdGM?t=195) [do my cropping like this and when I'm](https://youtu.be/4wp6vLiIdGM?t=198) [done then getting back to my document](https://youtu.be/4wp6vLiIdGM?t=202) [you can see that it's now the image and](https://youtu.be/4wp6vLiIdGM?t=205) [the image even has a link reference at](https://youtu.be/4wp6vLiIdGM?t=208) [the bottom but of course if I double](https://youtu.be/4wp6vLiIdGM?t=211) [click on the image then I can still open](https://youtu.be/4wp6vLiIdGM?t=213) [the original file as well just as in](https://youtu.be/4wp6vLiIdGM?t=217) [case of](https://youtu.be/4wp6vLiIdGM?t=220) [canvas now to show you maybe a better](https://youtu.be/4wp6vLiIdGM?t=222) [way of achieving this the way I would do](https://youtu.be/4wp6vLiIdGM?t=225) [this is I would read a PDF document in](https://youtu.be/4wp6vLiIdGM?t=228) [the PDF reader like here and when I get](https://youtu.be/4wp6vLiIdGM?t=232) [to a page where I have an image that I](https://youtu.be/4wp6vLiIdGM?t=235) [want to capture I would simply select a](https://youtu.be/4wp6vLiIdGM?t=238) [part of the text from this page so I'm](https://youtu.be/4wp6vLiIdGM?t=242) [now in the PDF reader I select a part of](https://youtu.be/4wp6vLiIdGM?t=244) [the page and I copy a link to the](https://youtu.be/4wp6vLiIdGM?t=247) [section like this and then I head back](https://youtu.be/4wp6vLiIdGM?t=251) [to my markdown document and I simply add](https://youtu.be/4wp6vLiIdGM?t=254) [this link to the section and after](https://youtu.be/4wp6vLiIdGM?t=257) [adding the link to the section I can](https://youtu.be/4wp6vLiIdGM?t=260) [open the Cropper and it will open that](https://youtu.be/4wp6vLiIdGM?t=262) [section and again I can simply do my](https://youtu.be/4wp6vLiIdGM?t=266) [cropping so you will see that I can crop](https://youtu.be/4wp6vLiIdGM?t=270) [the image like this and like this now](https://youtu.be/4wp6vLiIdGM?t=273) [what you will also](https://youtu.be/4wp6vLiIdGM?t=277) [notice is this is hard to read or](https://youtu.be/4wp6vLiIdGM?t=279) [sometimes hard to read so some of the](https://youtu.be/4wp6vLiIdGM?t=282) [PDF documents have a transparent](https://youtu.be/4wp6vLiIdGM?t=284) [background and there are two things that](https://youtu.be/4wp6vLiIdGM?t=287) [it's good to know that you should know](https://youtu.be/4wp6vLiIdGM?t=290) [about this first of all if you find this](https://youtu.be/4wp6vLiIdGM?t=292) [hard to read you can always click here](https://youtu.be/4wp6vLiIdGM?t=295) [and change the background](https://youtu.be/4wp6vLiIdGM?t=298) [maybe to White and then the text will be](https://youtu.be/4wp6vLiIdGM?t=300) [visible very nicely the other thing I](https://youtu.be/4wp6vLiIdGM?t=303) [want to show you is here if I open the](https://youtu.be/4wp6vLiIdGM?t=306) [properties panel you will see that I](https://youtu.be/4wp6vLiIdGM?t=310) [have a special property here CSS classes](https://youtu.be/4wp6vLiIdGM?t=313) [excal draw crob PDF page so if I remove](https://youtu.be/4wp6vLiIdGM?t=318) [this then what you will see is when this](https://youtu.be/4wp6vLiIdGM?t=323) [image refreshes so I will need](https://youtu.be/4wp6vLiIdGM?t=326) [to change this and change it back then](https://youtu.be/4wp6vLiIdGM?t=330) [this image will not have a background](https://youtu.be/4wp6vLiIdGM?t=334) [color so you might or might not want](https://youtu.be/4wp6vLiIdGM?t=336) [this what I want to highlight is here](https://youtu.be/4wp6vLiIdGM?t=338) [you](https://youtu.be/4wp6vLiIdGM?t=342) [can create or Define your own CSS](https://youtu.be/4wp6vLiIdGM?t=343) [classes so if instead of white you want](https://youtu.be/4wp6vLiIdGM?t=347) [a yellow background or whatever other](https://youtu.be/4wp6vLiIdGM?t=350) [color for the page color of the PDF you](https://youtu.be/4wp6vLiIdGM?t=352) [can change the CSS classes here here the](https://youtu.be/4wp6vLiIdGM?t=356) [only thing is you need to refresh the](https://youtu.be/4wp6vLiIdGM?t=360) [link so the CSS class is applied when](https://youtu.be/4wp6vLiIdGM?t=363) [the image is](https://youtu.be/4wp6vLiIdGM?t=368) [embedded and then finally let me show](https://youtu.be/4wp6vLiIdGM?t=370) [you how this works in exol draw it works](https://youtu.be/4wp6vLiIdGM?t=373) [pretty similar to the previous ones so](https://youtu.be/4wp6vLiIdGM?t=376) [I'm going to add how to read a paragraph](https://youtu.be/4wp6vLiIdGM?t=379) [as an embeddable so now I have the how](https://youtu.be/4wp6vLiIdGM?t=382) [to read a paragraph document in embedded](https://youtu.be/4wp6vLiIdGM?t=387) [into exol draw I](https://youtu.be/4wp6vLiIdGM?t=390) [can oops I can click on this and I can](https://youtu.be/4wp6vLiIdGM?t=393) [scroll to the part that I want to crop](https://youtu.be/4wp6vLiIdGM?t=397) [so I'm here now if I press crop image](https://youtu.be/4wp6vLiIdGM?t=400) [then this page opens and everything](https://youtu.be/4wp6vLiIdGM?t=405) [works similar so I can just simply crop](https://youtu.be/4wp6vLiIdGM?t=407) [this page like this and when I'm done](https://youtu.be/4wp6vLiIdGM?t=411) [with cropping then I can turn back to](https://youtu.be/4wp6vLiIdGM?t=413) [xolor draw my image is going to get](https://youtu.be/4wp6vLiIdGM?t=417) [updated and here you go so I can now](https://youtu.be/4wp6vLiIdGM?t=420) [close this and I can navigate with this](https://youtu.be/4wp6vLiIdGM?t=424) [image there are two more small things](https://youtu.be/4wp6vLiIdGM?t=428) [that I want to show you regarding](https://youtu.be/4wp6vLiIdGM?t=432) [cropping and then there's one more thing](https://youtu.be/4wp6vLiIdGM?t=434) [I want to show you as a new feature in](https://youtu.be/4wp6vLiIdGM?t=437) [this version of excal obsidian so first](https://youtu.be/4wp6vLiIdGM?t=439) [about cropping there are two new](https://youtu.be/4wp6vLiIdGM?t=443) [settings that you can use setting number](https://youtu.be/4wp6vLiIdGM?t=445) [one is under basic here there's a crop](https://youtu.be/4wp6vLiIdGM?t=448) [file folder so the way exol draw crops](https://youtu.be/4wp6vLiIdGM?t=454) [an image is it creates an image Cropper](https://youtu.be/4wp6vLiIdGM?t=457) [so the image remains your PDF file](https://youtu.be/4wp6vLiIdGM?t=462) [remains your PDF file so the cropping](https://youtu.be/4wp6vLiIdGM?t=465) [will always read the PDF and create the](https://youtu.be/4wp6vLiIdGM?t=468) [crop out of that or the cropped image](https://youtu.be/4wp6vLiIdGM?t=472) [out of that but you might want to save](https://youtu.be/4wp6vLiIdGM?t=475) [the ex call it draw cropping file to a](https://youtu.be/4wp6vLiIdGM?t=478) [specified folder so if you set a folder](https://youtu.be/4wp6vLiIdGM?t=481) [here then the cropping file will go to](https://youtu.be/4wp6vLiIdGM?t=484) [that folder if not then the cropping](https://youtu.be/4wp6vLiIdGM?t=487) [file will follow your files and links](https://youtu.be/4wp6vLiIdGM?t=490) [settings so it's in my case it's going](https://youtu.be/4wp6vLiIdGM?t=494) [to go in a sub folder under the current](https://youtu.be/4wp6vLiIdGM?t=497) [folder called attachments so that's your](https://youtu.be/4wp6vLiIdGM?t=500) [option that you can define a dedicated](https://youtu.be/4wp6vLiIdGM?t=503) [folder for your crop files the other](https://youtu.be/4wp6vLiIdGM?t=507) [setting I added is under saving and file](https://youtu.be/4wp6vLiIdGM?t=511) [name and here you can add a prefix for](https://youtu.be/4wp6vLiIdGM?t=514) [the crop file I now have cropped but](https://youtu.be/4wp6vLiIdGM?t=519) [maybe you just want to add C or whatever](https://youtu.be/4wp6vLiIdGM?t=522) [if this is empty then cropped will be](https://youtu.be/4wp6vLiIdGM?t=526) [added or used so you can add an](https://youtu.be/4wp6vLiIdGM?t=529) [underscore if you want to leave this](https://youtu.be/4wp6vLiIdGM?t=532) [sort of empty that's another setting and](https://youtu.be/4wp6vLiIdGM?t=535) [then finally the new feature I wanted to](https://youtu.be/4wp6vLiIdGM?t=539) [show you is just a small new feature so](https://youtu.be/4wp6vLiIdGM?t=541) [I'm going to insert an](https://youtu.be/4wp6vLiIdGM?t=544) [image and I'm going to choose my lovely](https://youtu.be/4wp6vLiIdGM?t=548) [monkey here so the new feature is now](https://youtu.be/4wp6vLiIdGM?t=551) [you can round the corner of images so](https://youtu.be/4wp6vLiIdGM?t=554) [here in the properties I can click](https://youtu.be/4wp6vLiIdGM?t=557) [rounded corner and then the image will](https://youtu.be/4wp6vLiIdGM?t=561) [have a rounded corner so if you like](https://youtu.be/4wp6vLiIdGM?t=564) [rounded images now with an image you can](https://youtu.be/4wp6vLiIdGM?t=567) [easily achieve that so that's all I](https://youtu.be/4wp6vLiIdGM?t=571) [wanted to show you today I think this](https://youtu.be/4wp6vLiIdGM?t=574) [cropping feature is really powerful you](https://youtu.be/4wp6vLiIdGM?t=577) [can crop and mask images you can crop](https://youtu.be/4wp6vLiIdGM?t=581) [and mask PDF Pages PDF Pages retain](https://youtu.be/4wp6vLiIdGM?t=583) [their links to the original source and](https://youtu.be/4wp6vLiIdGM?t=587) [overall since I've implemented this](https://youtu.be/4wp6vLiIdGM?t=592) [feature I'm amazed at in how many cases](https://youtu.be/4wp6vLiIdGM?t=595) [I've used it this is such a cool feature](https://youtu.be/4wp6vLiIdGM?t=598) [I recommend you try it out and you play](https://youtu.be/4wp6vLiIdGM?t=602) [with it enjoy thank you](https://youtu.be/4wp6vLiIdGM?t=604)