Inserting an Image Element

Click on the Insert Image button on top header bar.

An image element with a placeholder will appear on the canvas.

Now that you put the placeholder, it's time for picking the image. We have two options for image selection; (a) from media library or (b) from a datasource.

a. Adding an Image from Media Library

Click on Pick Media From Library.

This will open a media library and only images will be listed here. This is the list view of media library.

Click on the checkbox to the left of your image to select it. Click Add to Content.

Your Image will appear on the canvas with its original size. Resize and position it accordingly.

b. Adding Image from a Datasource Field

When you need to change your visuals regularly, you may use a datasource. This way, instead of opening scene designer and changing the visual, you can directly manage your datasource. The image element you added to your scene will be updated automatically. Learn more here.

Formatting Image

We will use format tab to go over the image settings.

Name: You can edit the name of the image to easily distinguish it from other elements you put on the canvas.

Value: When you select image from your media library, Value field displays the ID of the image in your media library. When you pick a datasource field, you can see the datasource path here.

Refresh icon: In case you add the image via a datasource, this icon updates image area, and the current image in the datasource is reflected on the canvas.
Delete and duplicate icons are self explanatory.
Box settings are opacity and radius.

You can check the transform and arrangement settings from here.

Inserting a Video Element

Click on the Insert Video button on top header bar.

A video element with a placeholder will appear on the canvas.

Now that you put the placeholder, it's time for picking the video. We have two options for video selection; (a) from media library or (b) from a datasource.

a. Selecting a Video from Media Library

Click on Pick Media From Library.

Selecting your video from media library is same with selecting image process (above).
Your video will appear on the canvas.
Click play button on the bottom right to preview your video. You can click on the timeline on the bottom to expand it. Here you can see the total duration. Timeline will be useful with the animations.

b. Selecting Video from a Datasource Field

When you need to change your videos regularly, you may use a datasource. This way, instead of opening scene designer and changing the video, you can directly manage your datasource. The video element you added to your scene will be updated automatically. Learn more here.

Formatting Video

We will use format tab to go over the video settings.

Name: You can edit the name of the video to easily distinguish it from other elements you put on the canvas.

Value: When you select video from your media library, Value field displays the ID of the video in your media library. When you pick a datasource field, you can see the datasource path here.

Refresh icon: In case you add the video via a datasource, this icon updates video area, and the current video in the datasource is reflected on the canvas.
Delete and duplicate icons are self explanatory.
Loop: Uncheck when the video should play once. If checked, video will loop through the total scene duration.
Volume: This slider works if your video has sound and your device supports playing sound.
Box settings are opacity and radius.

You can check the transform and arrangement settings from here.

_______

Next: 8.5 Text and Shape

Previous: 8.3 Scene Elements