How to add more photos to a post – cursor seems invisible and is jumping around

WordPress is fantastic for building your personal or commercial website, and it’s great that you can update almost everything yourself – but sometimes it can be a little tricky and time consuming to figure things out which don’t work as they should. Even though many time they are very small problems, they can be very frustrating.

Our workshop ‘LinkThink – Connect & Develop‘ yesterday in Dublin was very useful and enjoyable for all of us again, and a few of you mentioned problems with adding images to post and pages, especially when adding more photos after the post was published.

Here is a snippet of one of the e-mails I received: “When there are a number of images on a page or post it can be difficult to edit the images later, particularly to insert a new image in the desired location. I think the rule is that the image follows the cursor, the problem is the cursor is invisible most of the time!”

OK, first of all there are a few points to remember when inserting images into a WordPress post or page:

  1. Always place the cursor at the location where you would like to insert a new photo or gallery.
  2. When inserting your image be aware of your setting for alignment and image size.
  3. Edit your photos before you upload them so that they are a small, web friendly size.
  4. If you would like to make changes to a gallery, delete the gallery in your post first, then go back to ‘Add an image’, make your changes by uploading or deleting the desired photos, then ‘Insert Gallery’ again.

And now here’s a simple tip if you’d like to add additional images in between existing photos as mentioned in the e-mail above.

  • wordpress visual and html editorIf you have added a few individual photos to your post or page, and would like to add another photo to it but can’t get the cursor to show up in the correct location (e.g. between two photos underneath each other), simply click on the ‘HTML’ tab on the top right of your post field.
  • Your photos in html code will look something like that:

<img title=”One Image” src=”http://www.your-domain.com/wp-content/uploads/2011/08/Image-No-256.png” alt=”Image Text 1″ width=”356″ height=”256″ />

<img title=”One More Image” src=”http://www.your-domain.com/wp-content/uploads/2011/08/Image-No-257.png” alt=”Image Text 2″ width=”356″ height=”256″ />

<img title=”Another Image” src=”http://www.your-domain.com/wp-content/uploads/2011/08/Image-No-258.png” alt=”Image Text 3″ width=”356″ height=”256″ />

  • Above you can see 3 photos, each one in between these brackets <….>. Insert your cursor after one of the brackets and add a couple of letters or a word, like this:

<img title=”One Image” src=”http://www.your-domain.com/wp-content/uploads/2011/08/Image-No-256.png” alt=”Image Text 1″ width=”356″ height=”256″ />
Hit enter once,
add your word
and hit enter again

<img title=”One More Image” src=”http://www.your-domain.com/wp-content/uploads/2011/08/Image-No-257.png” alt=”Image Text 2″ width=”356″ height=”256″ />

<img title=”Another Image” src=”http://www.your-domain.com/wp-content/uploads/2011/08/Image-No-258.png” alt=”Image Text 3″ width=”356″ height=”256″ />

  • Now go back into your ‘Visual editor’ (see above) and you will have ‘your word’ in between the two photos, click behind ‘your word’, insert a new image into your post and then just delete ‘your word’.

I hope that helps and please let me know if you have any further questions.

Leave a Reply

Your email address will not be published. Required fields are marked *