Many new to the WordPress blog platform will have several questions. Among the many how do I’s will be the question of how to resize an image. Once a WordPress blog is set-up and you begin posting text content, you’ll probably want an image to go along with it. After all, text can be made quite more interesting by simply adding an image.
The Importance of Images
Images are an integral part of a blog simply because they add “dimension” to text. Novels might be 300 pages in length, without one single image set within the text. Aside from the cover, there aren’t usually any images. But when you read the New York Times, Wall Street Journal, UK Guardian or Toronto Star, nearly every piece is accompanied by an image.
Look at any of those news organizations online publication and practically every article has an image attached to it. Then, take a gander at blogs like TechCrunch and Wise Bread. Every post is appended with an image. The reason is the Internet is a visual medium. Much like television, images help to “sell” or “tell” the accompanying text. Readers are attracted as much to the image as they are to the informational content in a blog post.
Resizing Images in WordPress
So you’ve got your blog post idea and title. With a little research, you begin writing away. Before you know it, you’ve pounded out five or six hundred words. Maybe even surpassed the 1,000 word mark. That’s a lot of content. To dress it up, you want to put in an image. Searching Creative Commons, you come across the perfect image. Quickly, you download it and then insert it into your post. But once you click on “Preview Post”, you’re shocked to see it’s much too big. Crowding out your precious post, the image is more of an intruder than a welcome guest.
Rather than spend time resizing the image in a photo software suite, you can just shrink it using the HTML option in the post dashboard. While many new to WordPress unfamiliar with coding won’t typically use the HTML feature, it’s nothing to be frightened of and in this instance, is a quick fix to making an image the right size.
In the WordPress post editor, look to the right side for a gray tab titled “HTML”. Click on it and your text will appear in HTML mark-up.
Now, find your image by typing “Ctrl+F” simultaneously. A search box will appear at the top right corner of your browser, usually below the toolbar/ navigation bar. In the search box, type the name or partial name of your image. Then, click on the arrows attached to the search box to find your image within the HTML code. The name of your image will appear in a code sequence that looks something like this:
[sourcecode language=”html” wraplines=”true”]
<a href=”http://myblog.files.wordpress.com/2011/12/myimagejpg”><img title=”myblogimage” src=”http://myblog.files.wordpress.com/2011/12/myimagejpg?w=150&h=118″ alt=”" width=”150″ height=”118″ />
To make your image larger or smaller, simply change the numbers inside the width=”150” and height=”118”. To keep the proportions correct, change each number with an equal percentage. For instance, using the above example, of 150 wide by 118 high, to make it larger by 25 percent, multiple each number by 1.25 (150 x 1.25 = 187.5 and 118 x 1.25 = 147.5). Round the products up or down to 188 by 148 or down to 187 by 147.
Click on the “Visual” tab to the left of the “HTML” tab and behold! Your image will now be the size of your choosing. Change the width and height numbers until you strike the right balance between text and image.