Picture Elements
Click the Upload Image box to add a picture.
This opens up a dialog box presenting several ways to add a photo. The two key options are to either upload (or drag) an image from your own computer or search through the stock photo database.
Let's focus on the option to upload a photo from your own computer. The easiest way to approach this is to drag the picture you want to use from your desktop into the box that quite helpfully says "drag photo here." You can also click the green "Upload a photo" button if it isn't convenient to drag the image over.
The size of a picture will vary after upload, but it will usually show as wide as the entire site.
You can adjust the size of the image by clicking and dragging the little box that appears in the lower right corner of the image (you'll need to click on the picture to see it).
Clicking on the photo also opens up the settings dialog box that you can use to make further changes.
Some notable controls:
- Lightbox: If you turn this on then any visitor who clicks the image on your site will be shown a larger version.
- Link: This option turns the image into a link. We cover links later in this guide.
- Spacing: Makes minor adjustments to the amount of white space around the picture.
- Caption: Lets you add a basic text caption under the pic.
- Advanced: Allows you to adjust (or turn on / off) the border around the picture.
This editor provides some basic options for adding effects, lets you Rotate the image to any angle, and has a Crop feature that can cut unwanted parts of the image away.
As an example of how these tools work, let's crop this picture a bit.
The Crop option places a box over the top of the picture. You can click on that box to drag it around and adjust the bubbles on the corners and sides to change the dimensions.
Once you've made changes click OK. If you don't like the changes you can click Crop again to readjust or click the grey Cancel button to drop out of the editor. We've cropped the example image down to more of a square; we'll keep this change and click the Save button in the upper right.
And now the changes to the image are saved.
Next up, let's learn how to Alter the Layout of a Page.