2011-11-04 11:49:02A Users Guide To Importing Graphics and Images Into Blog Posts and Rebuttals
Daniel Bailey
Daniel Bailey

A Users Guide To Importing Graphics and Images Into Blog Posts and Rebuttals

We've all been there.  Writing out first blog post or rebuttal.  We've managed to hack out some prose that perhaps someone somewhere can parse.  On a good day it almost reads like Engrish.  But it's missing a certain... je ne sais quoi.

What to do...How about spiffing it up with some graphics or images?  Gee, that's fine to say but how to do it, there's the rub.

Enter a nifty little piece of freeware called MWSnap.  Suffice to say, if you need a screen grab, this baby will be your best friend.  Let's suppose you're perusing a copy of Hansen's latest presentation, Drawing a Line in the Tar Sands: Why Stopping the Pipeline is Vital to the Future of Our Children & Our Planet, and wanted to grab a copy of the timeline available on slide 21.  MWSnap to the rescue!  A quick screengrab, save it to your hard drive, upload it to SkS & then import it here, thusly:


Click for larger image


What?  Slow down you say?  Ok, here goes:

  1. Save the desired graphics/images to your computer hard drive (.png seems to work best, YRMV)
  2. Remember (this is the most important step) where you saved them!
  3. Using the Author Image Upload form, locate the graphics/images where you saved them & upload them one at a time (http://www.skepticalscience.com/admin_author.php?Action=UploadImageForm)
  4. When the upload form gives you each SkS URL, open the SkS URL in a new window (one per graphic/image)
  5. Open the post for editing
  6. Position your cursor within the text where you want the graphic/image to appear and then click on the icon in the WYSIWYG editor panel that looks like a small green maple tree (for any Canucks out there) Insert Image Icon
  7. On the General tab of the dialogue box that appears, paste the SkS URL that you generated for the first graphic/image you uploaded; then in the fields immediately below the URL field, paste any descriptive text that accompanies the graphic/image
  8. On the Appearance tab, in the Dimensions field, if your graphic/image is wider than 500 pixels enter 500.  The Alignment field can be played with to gain experience with the other placement options
  9. Click Insert when done with the dialogue box
  10. With the image still hilited, click on the insert/edit link icon in the WYSIWYG editor panel (HINT: it looks like a section of chain links)  Insert Link Icon
  11. In the dialogue box that appears, insert the URL in the Link URL field and then click Insert (this is mostly useful if you restricted your image size to 500 pixels; by performing this step you make the image clickable, with a click bring up the image in its larger resolution; skip this part if the image is in its native resolution)
  12. Repeat steps 6-11 as necessary for the other graphic/images you may have.

Easy-Peasy, Lemon-Squeezy.