How to Upload an Image

How to Upload Images
and Insert them into Posts

This guide assumes you have an understanding of:


Uploading an Image

After you’ve created your blog post and entered some textual content, position the caret where you wish to insert the image and click the Add Media button.

Screenshot - WordPress - Post - Caret

The caret is the flashing vertical bar which indicates the proposed insertion in a text.

This will activate the Media Library.

To upload an image:

  • Drag the file from the desktop folder onto the Media Library.
  • Or click the Upload files tab then click the Select Files button and locate the files you wish to upload.
Screenshot - WordPress - Post - Add Media

In this example a photo of the box art of the set 6267 Lagoon Lockup is being uploaded.

Once your image has successfully uploaded, a smaller version of that image will appear as the first thumbnail in the left column.

The other thumbnails are images which have been previously uploaded to the Media Library.

The white check mark with the blue background indicates this is the image currently selected.

Selecting Multiple Images

Be aware that:

  • You can insert an image which has been previously uploaded.
  • You can insert more than one image at a time. To do so, hold down the CTRL button while clicking on the other image(s) you wish to insert.

Entering the Attachment Details

In the right column you will find the Attachment Details.

By default the Image Title will inherit the image’s file name.

For example:

LEGOPirates-6267-Lagoon_Lockup.jpg

Becomes…

LEGOPirates-6267-Lagoon_Lockup

However, this could be improved for the benefit of Search Engines and Screen Readers.

This text will NOT appear in your Blog Post but instead provides descriptive information to help Search Engines and visually impaired people understand what the image contains.

Screenshot - WordPress - Post- Add Media - Alt Text

Improved Image & Alt Text

First, remove any unnecessary grammar, insert the correct spacing and add descriptive wording.

For example:

LEGOPirates-6267-Lagoon_Lockup

Could become…

Photo of LEGO Pirates set 6267 Lagoon Lockup Box Art

The Image Title text can then be copied and pasted into the Alt Text.


Image Captions

WordPress - Post - Add Media - Image Caption

You may also enter a brief caption to compliment your image. As Captions appear in your Blog Post they don’t need to be descriptive but can be used to provide brief (witty) commentary outside the narrative of your blog post.


Attachment Display Settings

These are basic settings which, for the most part, you won’t need to change.

WordPress - Post - Attachment Display Settings

Alignment

This only applies to small images.  Most of the images you upload will occupy the entire width of the Blog Post and won’t require aligning.

Link to

You may need to link the image to an external webpage, like a LEGO Ideas Project or topic in the LEGO Pirates forum.

This requires changing the Drop Down to Custom URL and entering the URL the user will be taken to after clicking the image.

Size

This is the dimensions of the image (width x height).

The images used in your post should be around 960 pixels wide so if you’ve uploaded a large image, select Medium Size to reduce download times.

Smaller images are permissible so use the Full Size version if they are less than 960 pixels wide.


Inserting the Image

The final step is to click the blue Insert into Post button.

WordPress - Post - Media Library - Insert Image Button

To the left you will find the thumbnail(s) of the image(s) selected for insertion.


Editing an Image Inserted into a Post

After you’ve inserted an image into a post you may need to edit the image’s settings, particularly if you want to add a Caption.

WordPress - Post - Edit Image

To Edit

  1. Click on the image you wish to edit and a Toolbar will appear.
  2. Click the Pencil Icon

This will open the Image details dialogue box.

Image Details Dialogue Box

Here you will be able to edit the Attachment Details and Attachment Display Settings.

After you make changes, click the Update button and you will be returned to the Post Editor.


Advanced Options

Unless you have an understanding of web design you will not need to change these options.

WordPress - Post - Image_Details - Advanced Options

The one exception is the Open link in a new tab checkbox.

If you are linking to external webpages (I.e. webpages which are outside of Classic-Pirates.com) then select this checkbox.


Replacing an Image

Sometimes you may need to replace an image but want to keep the same settings.

For example: a higher quality version of the image becomes available.

WordPress - Post - Image Details - Replace Button

The quickest way to achieve this is to click the Replace button which will launch the Media Library.


What Next?