Is it possible to resize images?

Is it possible to resize the images I drag and drop into the editor?

Not natively but there are a few things you can do.
Personally if I need a resized image I just use HTML instead of markdown i.e. rather than

![image](:/5d2e97f37b2649b583d1cc03e987c6e7)

I use:

<img src=":/5d2e97f37b2649b583d1cc03e987c6e7" width="400">

There is also a plugin (or plugins) that can do this such as the Attache plugin where it takes the source image and resizes it for you.

4 Likes

You can also change the size that images display using the plugin Joplin Enhancement


First, insert your image, and go to the markdown editor which will show, for example:

![My inserted image](:/123456abced78910321)

Now by adding, again for example, {width=50%}, so it looks like this:

![My inserted image](:/123456abced78910321){width=50%}

the image will appear at half the original size (the image remains the same size it's just displayed according to what you've added in the curly braces)

4 Likes

Using a plugin for resizing images is definitely an amazing and effective solution.

Buidling upon the above answer, I use (though I can't remember where I found it and who to credit!):

<figure>
<img src=":/272198a227744a058467bd1c66140daf" width="500" height="100">
<figcaption> Fig. 1: My figure caption. </figcaption>
</figure>

I can never remember the syntax though so I save it in another note.

The only thing I'd like is to make the caption text italicised, but it doesn't accept the markdown syntax for that

2 Likes

If you add the below to userstyle.css and quit and restart Joplin all your <figcaption>s will be italic.

figcaption {
    font-style: italic;
}

More info on the <figure> tag can be found here.

1 Like

Thank you, that's great! :pinched_fingers: I'd never used the userstyle.css before, but now see lots of people tinker with it, now I have started too!

1 Like