Tag Archives: Screenshots

Images on WordPress / Asking Tech Questions

One of my goals for this course is that we all work together to develop our tech skills. If you run into a small technical frustration, you might want to post the question here (and let me/your project group know you’ve done so). I’ll categorize these questions as “Tech Tips,” and hopefully me/your classmates will help you find an answer that I/they post in the comments.

A student emailed me last night frustrated that he had been having trouble incorporating screenshots into his posts. In Microsoft Word, he can just press PrintScreen (he uses Windows) and then paste an image into the Word document. It doesn’t work the same way in WordPress, though, as he found out. The reason for this is that on the web, images are actually posted separately from text files/documents. WordPress hides the underlying code from you, but when you add an image to your post, what you’re actually doing is creating an HTML tag that looks like this:

<img src=”image.jpg” />

So instead of just pasting an image into your WordPress post, getting an image up involves two separate processes:

1. Creating a screenshot as an image file


2. Uploading and linking to that image file in WordPress.

For (1), you can find directions here for Windows and here for Macintosh. The Mac already create a file of the screenshot by default. If you’d like to crop/very lightly edit your image, the Preview application gives you some ability to do so. In Windows, many users press “PrintScreen” and then open Paint to edit the image.

Now that you’ve got an image file (gif, jpg, or png), you can add it to your WordPress post by following these instructions.

Once you’ve done it once, this process makes more sense. So if you haven’t done it yet, give it a shot. It’s a skill that will be helpful throughout the semester.