Managing images, documents, videos and other media is an important part of creating a website. These tutorials will show you how to source your files properly, prepare them for web use, upload, edit, replace and more.
Videos on this page:
Preparing and Uploading Images
Be sure you have the proper permission to use every image on your site. For optimum page loading performance, you should prep your images for web use by using photo editing software like Photoshop or GIMP first. You can then either upload your images directly into the Media Library or while you are editing pages/posts.
0:00 – intro
0:08 – copyright considerations – source your images properly!
0:45 – what qualifies for adequate permission
1:37 – sources for public domain or copyright-free images
3:05 – preparing images for web use
3:22 – using Photoshop to resize large images
3:45 – optimizing photos is important for site performance! (esp. on mobile!)
4:35 – changing resolution (should be 72 pixels/inch)
5:42 – adjusting width & height (no larger than 2000 px)
6:40 – exporting options (turn down quality to 80-90%)
8:05 – adding an image to a page/post
8:44 – uploading a new photo
9:20 – alt text field is required to meet accessibility requirements!
9:25 – how does alt text work?
9:45 – how to write good alt text
10:40 – caption and description fields
11:15 – image alignment
11:50 – image sizes
12:15 – insert image into page
12:28 – edit image details (adding caption)
Editing and Replacing Images
You can change the captions on your images as well as the size they appear on the page. Beyond that, WordPress offers some limited image editing capabilities but as of this writing most of them are unreliable. For best results, you should edit your image using photo editing software like Photoshop or GIMP and then replace the old image in your media library.
0:00 – intro
0:17 – warning: some built-in WordPress image editing tools are unreliable
0:35 – editing existing captions
1:00 – adding a new caption
1:45 – options for changing an image’s size on the page
3:30 – recommend NOT using “Edit Original” button in image editing screen
4:50 – replacing an image with new/different version
Creating Image Galleries
The image alignment buttons built into the text editor are not designed to handle complex photo layouts. Using image galleries will allow you to create attractive photo layouts with automatic thumbnail generation, multiple layout options, captions, descriptions and a large-size lightbox feature.
0:00 – intro
0:28 – existing gallery demo
0:55 – how to close the Lightbox mode when logged in (Esc key)
1:14 – begin example
1:44 – how to create a new gallery
2:17 – edit captions or order if desired
2:44 – change Link To setting to Media File
2:56 – change gallery type; recommend Titled Mosaic or Thumbnail grid
3:30 – finish and insert gallery
3:32 – appearance in editor is not how it will look when page is saved
3:42 – preview to see tiled mosaic gallery
3:58 – edit gallery to shuffle order of images
4:30 – see thumbnail grid style
5:15 – update page
Uploading Documents for Download
You can either upload your documents directly into the Media Library or while you are editing pages/posts. PDFs are the recommended format for text documents over Word documents (unless you want users to be able to edit them after downloading; usually this is not the case.) Other supported MS Office formats are Excel and PowerPoint.
0:16 – supported document types
0:26 – recommend converting Word docs to PDFs
1:08 – copyright considerations (do not assume journal reprints are OK)
1:44 – adding a download link
2:05 – uploading a new document file
3:15 – editing link text
4:05 – file type indicator icon added automatically when saved
5:08 – how to replace a document with a new version
5:55 – use the “Just replace the file” option
6:35 – verify (need to refresh browser)