For this post I will teach you to to resize multiple images in Blogger by batch or instantly.
First thing first, download the Notepad++ and install it because you will be needing the application later.
How to resize multiple images in Blogger by batch or instantly - Original size
1. Open your Blogger and create a New Post.
2. Inside your post, start uploading all your images.
3. After uploading your images, switch from Compose View to HTML View by clicking the Pen icon located in the upper left of your working space.
4. When already in HTML View, select all the texts or codes inside there and Copy all of it.
5. Now, open your Notepad++
6. Inside Notepad++, press Ctrl+V (shortcut for Paste), or right-click on the white space and press Paste.
7. We will now begin to resize all the images at once. For this post I want all of my images to be sized on its original form. Inside Notepad++ press Ctrl+F. In the prompt that will appear, click the Replace tab.
8. In "Find what," type width="
9. There are two kinds of widths there, the data-original-width="IMAGE-SIZE", and the width="IMAGE-SIZE", just select the width="IMAGE-SIZE".
10. Again, back to your Replace tab, type width="IMAGE-SIZE". Replace IMAGE-SIZE with the exact value that you see in your images. Leave the "Replace with" blank. Press "Replace All" button.
11. Still in the Replace tab, in the "Find what" type s320 and in the "Replace with" type s16000. Then, click the "Replace All" button.
12. Do not worry, when you are used to doing these steps it won't take that long to do. Still inside your Notepad++, select all the codes again and Copy all of it.
13. Back to Blogger post (still in HTML VIEW), paste the codes you copied.
14. Now, from HTML view, switch back to Compose View.
15. And all of your images are resized to its original size. Done!
Tip: If you want to change the size of your image to Large (for example). All you need to do is resize one image first to LARGE size. Switch to HTML view and find its <img> tag. Example:
<div class="separator" style="clear: both; text-align: center;"><a href="https://1.bp.blogspot.com/-17w_AhdLnfY/YAOC4MTlbdI/AAAAAAAAPZM/Ho1J-8v1bgAdOzRPDaE9hP8Co5MuMXw0ACLcBGAsYHQ/s400/675745634.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="300" data-original-width="400" height="300" src="https://1.bp.blogspot.com/-17w_AhdLnfY/YAOC4MTlbdI/AAAAAAAAPZM/Ho1J-8v1bgAdOzRPDaE9hP8Co5MuMXw0ACLcBGAsYHQ/w400-h300/675745634.jpg" width="400" /></a></div>
As you can see the red texts above, for mine I got w400-h300. All you need to do is repeat the steps above and instead of s16000, just type s400-h300. Make sure you type the size that you see inside your HTML code. We might have different image sizes, so you might not see a s400-h300 size there but a different one.
The same process is done for the Small, Medium, and Extra Large.