Hack The HTML Code to Resize Images

There are many products we use that have HTML in the background.  For instance, you are reading this blog post on Blogger, which I have edited in this happy little editor, however - in the background is HTML code commanding what you see.  Sometimes my editor doesn't give me the options to do what I'd like to do, so I can edit the HTML code to modify my post.

Perfect example:

I'm working on a blog post right now about forcing a copy of a Google Doc.  I inserted a picture into my post and the original size was too large, so I had four choices in my editor: Small, Medium, Large, and Extra Large.  I picked Extra Large because it looks best in the editing window.  The other three sizes are just too small.  The picture looks great!

When I preview my post though, I get this:

My picture overlaps the sidebar on my blog.  What can I do?  Well...I can edit the HTML!  In the upper left hand corner of my Blogger post, I have a button that allows me to make the switch between my nice easy compose editor and the HTML code.

Once I get into the HTML code, I'm going to search for the image code.  I'll know it because it will list a long web address (the URL of the picture) and I'll see the words height and width with some numbers next to them.  Like this:

I can change these numbers and my picture will still look ok, as long as I keep the ratio the same.  So I've tested and figured out that using 80% of these numbers will get me a nice size that fits into my post.  So I will take 640 and multiply by .8 to get 512.  Then I will multiply 115 x .8 and get 92.  I'll change the numbers accordingly and then click in the top left to return to the compose editor.  

Now my picture looks smaller in the editor.  

When I go to preview now, it is perfectly sized!

You can almost always find access to the HTML code of your website - you just have to hunt for it.  I've edited the HTML in Google Sites, Blogger, and Weebly.  If you aren't sure how to edit the HTML to do what you want it to do, just do a search on Google for it.  I can almost guarantee someone will have a post about how to do it.  

Don't feel stuck by the options in your editor, hack that HTML code to make your site look the way you want!