Content Mode lets you update text, images, and links without affecting the design or layout of a page. To learn more about content editing, refer to this article.
Editing Images and Videos
To change media assets on the page, find the element you want to change in the content drawer. Or, you can click on the image or video that you want to change on the page preview, and the drawer will automatically scroll to that item.
You'll see a preview of the asset in the content drawer:
At the top of the preview, the name of the file currently being used is displayed. This corresponds to the filename in the Media Library. If you want, you can double-click to rename this asset (your change will apply to the file in the Media Library):
Adding a New Image or Video
When you hover over an image in the content drawer, you'll see some options appear.
Media can be updated is several ways:
- You can upload a new image by dragging-and-dropping it on this area from your computer, or by manually selecting a file on your machine;
- You can click the "folder" icon to select an image from the Media Library;
- If it's a video, you can enter a URL to a YouTube or Vimeo video.
If you choose to add an asset from the Media Library, you'll see a new drawer open, which contains all the images and videos that have been added to the library for this site. To use one, simply drag and drop it into the content drawer.
You can only replace media with media of the same type. (If the element is an image or background image, you cannot use Content Mode to replace it with a video, and vice versa.) Changing an image to a video, or a video to an image, must be done in Studio Mode.
Removing Images and Videos
To remove an image or video, click the "trash can" icon at the top right.
This will clear the media from the page, but there will still be an empty element in the content drawer, so you can add a new image or video back in.
Containers may have more than one background image applied to them. Similarly, image galleries may have had multiple images added to them.
In this case, you'll see small thumbnails under the preview, representing each of the images:
You can click on these thumbnails to edit or remove each item individually.
Adding Alt Text to an Image
You can define the alternative text for any image element on the page by typing it into the field below the image preview:
Alt text is a web standard that can be used to describe the appearance and function of an image on a page, to ensure accessibility for visually impaired users, and to improve the SEO of your site by making it easier for search engines to crawl it.