Whenever a rich content document (such as an image, audio file, or document) is added to a website it must be stored somewhere online at all times. In other words, websites cannot display content directly from the author's computer. To make them available these documents are stored on the server that is running the website being visited. Therefore to enhance your website with these sorts of content your Voice website stores them for you.

The storage area in Voice is called the Assets Library.

The Assets Library is integrated with the WYSIWYG editor making it simple to use.

Adding an Item to the Assets Library

To add a new Asset, open the Content menu and choose Assets Library, then click one of the links under I want to..., then click the Browse... button to select the file on your computer, give it a suitable File name, then click Save and Publish.

Note that the maximum size for file uploads is 100MB.

Alternatively, you can click on the appropriate folder in the Assets column on the left. So, for example, to add a new image, click on the Images folder in the left column. Here you will see a Create button, which drops down to offer Image or Folder.

After choosing Create then Image you'll see a small form with a Browse... button which you can use to select an image file on your computer. You can upload JPEG, PNG, and GIF files.

Give the image a suitable File name. Remember that over time you might have lots of images so make it something meaningful. The Description is optional, if you want to describe the image for screen readers.

Click Save and Publish.

The image is now saved in your Assets Library so you can now add it to a page.

You can also add assets directly from within the WYSIWYG editor.

Editing an Image

Choose or replace an image file and it opens straight away in a quick built-in editor, so you can adjust it before it's even saved. The tools are grouped into tabs down the left:

• Adjust — crop, rotate (in clean 90° steps), and flip the image horizontally or vertically.
• Finetune — brightness, contrast, colour, and other tonal adjustments.
• Filters — one-click style presets.
• Watermark — stamp an image or text over the photo (if your site has a logo set up, it's offered as a ready-made stamp).
• Annotate — add shapes, text, or freehand drawing.

You can also touch up an image that's already in your Assets Library without replacing the file. Click on it in the Assets Library, go to the Edit tab, and it opens straight into the same editor showing the current image. The Adjust tab isn't offered here — cropping or rotating would change the image's dimensions, and other pages already using it are relying on those staying the same. Finetune, Filters, Watermark, and Annotate are all still available. If you want to swap in a different file entirely, use the Replace image button instead — that gets you the full set of tools, Adjust included.

If you want to crop, rotate, or otherwise reframe an image that's already in use, we'd recommend clicking Clone first, rather than editing the original. Cloning makes a brand new, unpublished copy of the image — and since nothing on your site is using that copy yet, its editor offers the full set of tools including Adjust. Crop and save the clone, then swap it into your pages in place of the original, which stays untouched for anything still relying on it.

If you really do want to change the crop or rotation of the original image itself rather than cloning it, there's a sneaky way: unpublish it first from the Publishing tab, and Adjust becomes available for that edit too. Just bear in mind that once you publish it again, anywhere that image is already used on your site will pick up the new framing automatically — so I'd only do this if I was sure nothing depended on the original shape.

Saving Your Changes

Saving an image works just like saving any other page:

• Save as New Revision — saves your changes as a new revision but leaves the current live image unchanged. Good for previewing your edit, or coming back to it later, before it goes live.
• Save as New Revision and Publish — saves a new revision and makes it live straight away. The previous version is kept in case you want to roll back to it.
• Save — only available if you're editing a revision that isn't live — saves your changes without publishing.
• Save and Publish — only available if you're editing a revision that isn't live — saves your changes and publishes them immediately.

Once published, anywhere the image is used from the Assets Library updates automatically — no need to re-select it anywhere else on the site. This can take a minute or so to come through.

Organising Assets into Folders

For larger sites you can end up with a lot of assets. So to make your life easier it's worth organising them into folders. This can be done before you upload assets, or you can move the assets around afterwards.

In the above animation a new Photos folder is created inside Images. An asset is uploaded directly into this folder, and then an existing asset is moved into the folder.

Moving assets into folders doesn't change their URL, so if you've inserted links to them in pages then you can still move them around.

Adding Assets to Pages

From the WYSIWYG editor you can add an image to a page, or a link to a document or other asset types.

Inserting an Image

1. Click the Insert/edit image button  in the WYSIWYG editor toolbar. The Insert/Edit Image dialogue box will appear.
2. Click the Source button  to the right of the Source field. This opens a second dialogue box showing the images in your Assets Library. (If the image isn't there yet, you can upload it right there using the Or add a new Image form.)
3. Open the folder your image is in and click on the image you want. The second dialogue box will close, and the Source, Alternative description and Image title fields will be filled in for you.
4. If you like, change the Width and Height, or tick Show caption. It's also worth checking the Alternative description actually describes the picture, as that's what screen readers read out.
5. Click Save, and the image will appear in the WYSIWYG editor.

Linking to a Document

You can't place a document directly on a page - but you can make a link to it. From the page where you want the link:

1. Click the Insert/edit link button (the chain link icon) in the WYSIWYG editor toolbar. The Insert/Edit Link dialogue box will appear.
2. Click the button to the right of the URL field  (it's the same as the Source button for images). This opens a second dialogue box showing your site.
3. Click + next to the Assets folder (and any folders inside it) to find your document, then click on it. The second dialogue box will close and the URL will be filled in for you.
4. Check the Text to display is what you want the link to say, then click Save.

You can use the same button to link to other pages on your site too - they're listed under Home.