Pictures and Images

The media library

All the pictures and images on website are stored in the Media Library. To open the Media Library, click on Media in the black top bar.

The Media Library is organized in folders. When you open it, it will show you All files. There are folders for each topic, such as People or Shakers.

  • To move files from one folder to another, drag and drop them.

Resizing before you upload

For performance reasons, the pictures you upload should be jpegs (. jpeg or .jpg) and limited in size to maximum around 1200 x 900 pixels (Width x Height).

The recommended size is minimum 640 x 480. This also applies to images used only in a side column as they will be enlarged when moved to the bottom on medium sized screens such as tablets.

You can resize images in the media library, see further in this help document. However, you might have to resize before you upload as trying to upload very large images takes long and might end in an error.

There are many apps that allow you to resize pictures before you upload them. If you need further help with this, contact the webmaster.
One resizing app we recommend for Windows is part of the Powertoys app. It makes resizing very easy, just right click on the image in explorer and select Resize picture. Contact the webmaster if you need help installing the Powertoys app.

 

Uploading pictures

Usually, you will upload new pictures into the library when you insert them into a post, either setting a featured image, adding pictures to a gallery or simply embedding a new picture in text.
There are 2 methods:

  1. “Drag and drop” method:
    • first select the folder you want to put the image in
    • then drag and drop the new picture onto the Media Library
  2. “Select the file” method: (not available when opening the Media Library directly)
    • click on Upload files 
    • select the folder you want to put the image in
    • click on Select Files, choose the file(s) and, e.g. Set it as the Featured Image

Editing images in the Media Library

You can do some editing directly in the Media Library: Crop, Scale and Rotate.


When you do, don’t forget to apply the edit you made (e.g. Apply Crop) AND Save your Edits!

Adding Pictures (images) to your posts

Pictures can be put in posts:

  • as the Featured Image
  • in a Gallery
  • embedded in rich text such as Content, Columns,…

Setting the Featured Image

Clicking on Set featured image will open the media library selection screen. You either select an existing image in one of the folders or you can upload a new image. See how in the section about the Media Library above.

WARNING: Do not use a portrait image. Only use landscape images, preferably in a 4 x 3 ratio. If the image does not show the way you want, consider cropping it. You can do this directly in the Media Library. See how in the section “Editing images in the Media Library” above.

Adding pictures to the gallery

To add pictures to a Gallery, click on Add to gallery and follow the same procedure as described in the Media Library section above. The only difference is that you can select multiple images.

Once you have selected the pictures for the Gallery, you can:

  • reorder them the way you want: just drag and drop them in the right sequence
  • add an optional captions:
    • click on the image in the gallery, this will open an editing window for that image
    • enter the caption in Gallery caption, not in Caption, although it is OK to enter the caption in both.
      Don’t forget to click on Update!

 

Inserting pictures in rich text. (for advanced users)

You can embed pictures in any Rich Text, such as in the Content, More or Columns sections. However, this can be tricky. If not done properly, it might give bad results, especially on small screens and phones. We therefore recommend beginners avoid this feature.

  • Put the cursor where you want to insert the picture and click on the big button  Add Media  on top of the editor toolbar.
  • Follow the same method as described in the section Media Library above to upload or select the image.
  • When done, click on the image in the text. This will show a small button bar giving you options on how to embed the image. Wrapping text on the left or right, left aligning or centering it. For beginners, we recommend to center the image.
    NOTES:

    • You can resize the image by dragging the corners.
    • You can drag and drop the image in a different spot in your text.
  • Next, click on the pencil icon. This will show the Image Details and settings.
  • You can add a caption if wanted.
  • You can edit the image: crop, scale (resize) and rotate.
  • By default, pictures in the text will have rounded corners and a shadow.
    If you want the plain image instead, open the ADVANCED OPTIONS

    • Enter pv-pic-in-txt-plain in the field Image CSS Class.
  • Don’t forget to click on Update when done!