Excalidraw-Obsidian 2.0.19: PDF Cropping
Summary
TLDRThe video demonstrates new features in Excalidraw for Obsidian that allow cropping images and PDF pages directly within documents. It shows how to launch the image cropper, make selections, customize backgrounds, save cropped images to specified folders, and round image corners. The presenter explains how cropped images retain links to their original source documents for reference. They emphasize how the enhanced connectivity through backlinks and context makes this a particularly valuable feature for knowledge management and note taking. Overall, the video highlights innovative capabilities to incorporate visuals into notes while maintaining their relationships to source material.
Takeaways
- 😀 When cropping images from a PDF in Obsidian, the new Excalidraw feature retains the connection to the original PDF source
- 📷 The cropped image can be clicked to open the original PDF at the exact page the image was captured from
- ✂️ The image cropping feature allows flexible selections - drag to crop, mask parts out, adjust corners etc
- 🖼️ Cropped images can have transparent backgrounds visible in Obsidian using custom CSS classes
- 📁 A dedicated folder can be set to store all cropped image files separately
- 🔖 A custom file name prefix can be set for cropped images
- 🌆 Images embedded in Obsidian notes can now have rounded corners easily applied
- 📎 When referencing a PDF page to crop, copy a section link to that page for accurate context
- 🖥️ The cropping works similarly across Canvas, Markdown and Excalidraw in Obsidian
- 🎯 Overall the cropping feature enables easy capture of images from PDFs while retaining source context
Q & A
What does the speaker do when he wants to capture an image from a PDF document in Obsidian?
-The speaker starts the screen capture tool, selects the image, presses paste, and now has the image in his notes. However, this method disconnects the image from its original source in the PDF.
How does the extended image cropping feature in Excalidraw work for PDF documents?
-When cropping a PDF document in Excalidraw, the speaker can press Ctrl/Command+P to open the image cropper, then drag to select the desired area of the page to crop. The cropped image retains a link to the original PDF location.
How can you open a PDF document to a specific page when referencing it from an Obsidian note?
-Add a hash tag followed by page equals and the page number. For example, #page=9 will open the linked PDF document to page 9.
What are two ways to make the cropped text from a PDF more readable in Excalidraw?
-You can click on the cropped image and change the background color to white or another color. Or, modify the CSS classes for the image to set a background color.
Where does Excalidraw save the separate crop files by default?
-The crop files are saved by default in a subfolder called 'attachments' under the current folder, unless you specify a different crop file folder in the Excalidraw settings.
How can you set a file name prefix for cropped images in Excalidraw?
-In the Saving and File Name settings section, add your desired cropped file prefix. For example, add 'C' or 'cropped_' as a prefix.
What is the new image feature demonstrated at the end of the video?
-There is now an option to add rounded corners to images in Excalidraw. Just click the 'Rounded Corner' button in the image properties.
Why does the speaker think the PDF cropping feature is so useful?
-Because it allows easily cropping images and text while retaining links to the source PDF. He has found himself using it often since implementing it.
What naming convention does the speaker suggest to reconnect a cropped image with its original PDF source?
-He suggests using a naming convention to give the cropped image a name that references back to the source PDF. However, he says this is not a great solution.
How could you customize the background color for cropped PDF images?
-In the image properties, modify the CSS classes field to apply your own class with custom styling, like a yellow background color.
Outlines
📘 How to capture images from PDFs in Obsidian
Paragraph 1 explains how to capture images from PDF documents in Obsidian using the Excalidraw image cropping feature. It allows cropping a section of a PDF document, embedding it in your notes with a link back to the original source page. This retains context and connection to the original document.
💡 Tips for working with cropped PDF images
Paragraph 2 provides tips for working with cropped PDF images in Excalidraw. It shows how to change background color for clarity, use custom CSS classes to define background colors, and refresh links to apply CSS. It also covers the crop file folder setting to save copies separate from original PDFs.
👋 Recap and new rounded image corners
Paragraph 3 concludes by recapping the PDF cropping feature and its usefulness. It also shows a new capability to round the corners of images for visual appeal.
Mindmap
Keywords
💡cropping
💡PDF documents
💡markdown notes
💡image cropper
💡embedded images
💡links to source
💡CSS classes
💡rounded images
💡cropping files
💡crop prefix
Highlights
ExcalDraw's image cropping feature now supports PDF documents
To crop a PDF, press Ctrl/Command+P, type crop, and drag to select the area to crop
Cropped images retain links to the original PDF source
Double click a cropped PDF image to open the original location
To capture an image from a PDF, copy the section link and paste into notes
The cropper allows masking parts of images and changing backgrounds
Set CSS classes to define background colors for cropped PDF images
Refresh links for CSS classes to take effect after embedding images
Set a folder to save ExcalDraw crop files separately from attachments
Add a file name prefix for crop files using the saving and file name setting
Rounded corners can now be applied to inserted images
ExcalDraw's cropping is a powerful feature for capturing images from PDFs
Retained links allow tracking images back to their source context
Recommend trying the new cropping features out for PDF annotations
This is a useful addition for working with and referencing PDF content
Transcripts
hey everyone jol 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 noes 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 it 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 exol draw
image cropping feature to support PDF
documents this is how it works so for
example now I'm on canvas but I'm going
to show you the same VI an obsidian an
markdown note and with exol draw as well
so here I'm now in a canvas node and I'm
reading this PDF document I'm on this
active page and I want to capture this
image so all I need to do is press
control or command p and type in crop
and with this the image Cropper opens
and I can just simply drag from the top
and drag from the bottom I can also ra
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 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 hash page equals for example 9
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 pallet 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
case of
canvas 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 and 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 and there are two things that
it's good to know 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
excal draw crob 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 exol draw it works
pretty similar 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 in embedded
into exol draw 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
xolor draw 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 excal 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 exol draw crops
an image is it creates an image Cropper
so the image remains your PDF file
remains your PDF file so 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 ex call it draw 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 it's in my case it's going
to go in a sub folder 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 corner of images so
here in the properties I can click
rounded corner and then the image will
have a rounded corner 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 in how many cases
I've used it this is such a cool feature
I recommend you try it out and you play
with it enjoy thank you
Ver Más Videos Relacionados
Playground v2.5 & Creative Upscale Level Up Your Creative Game!
Crop multiple images at the same site using ImageJ
This Free Ai Changed The Vfx Forever | Viggle Ai Tutorial
Mastering Leonardo AI: A Comprehensive Step-by-Step Tutorial for Beginners
How to Use DALL.E 3 - Top Tips for Best Results
STOP Using Midjourney, Try This FREE AI Image Generator Instead!
5.0 / 5 (0 votes)