Concepts
Async Collaboration
- Comments
- In-app Notifications
- Recorder
- Inline Reactions
- Arrows
Realtime Collaboration
- Presence
- Cursors
- Live Selection
- Huddle
- Single Editor Mode
Recorder
Video Editor
Video editor component.
We recommend that you familiarize yourselves with UI Customization Concepts before attempting to modify any components.
Overview
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe>
<VeltVideoEditorPlayerWireframe.Title />
<VeltVideoEditorPlayerWireframe.ApplyButton />
<VeltVideoEditorPlayerWireframe.DownloadButton />
<VeltVideoEditorPlayerWireframe.CloseButton />
<VeltVideoEditorPlayerWireframe.Preview />
<VeltVideoEditorPlayerWireframe.ToggleButton />
<VeltVideoEditorPlayerWireframe.Time />
<VeltVideoEditorPlayerWireframe.SplitButton />
<VeltVideoEditorPlayerWireframe.DeleteButton />
<VeltVideoEditorPlayerWireframe.Timeline />
</VeltVideoEditorPlayerWireframe>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe>
<VeltVideoEditorPlayerWireframe.Title />
<VeltVideoEditorPlayerWireframe.ApplyButton />
<VeltVideoEditorPlayerWireframe.DownloadButton />
<VeltVideoEditorPlayerWireframe.CloseButton />
<VeltVideoEditorPlayerWireframe.Preview />
<VeltVideoEditorPlayerWireframe.ToggleButton />
<VeltVideoEditorPlayerWireframe.Time />
<VeltVideoEditorPlayerWireframe.SplitButton />
<VeltVideoEditorPlayerWireframe.DeleteButton />
<VeltVideoEditorPlayerWireframe.Timeline />
</VeltVideoEditorPlayerWireframe>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-wireframe>
<velt-video-editor-player-title-wireframe></velt-video-editor-player-title-wireframe>
<velt-video-editor-player-apply-button-wireframe></velt-video-editor-player-apply-button-wireframe>
<velt-video-editor-player-download-button-wireframe></velt-video-editor-player-download-button-wireframe>
<velt-video-editor-player-close-button-wireframe></velt-video-editor-player-close-button-wireframe>
<velt-video-editor-player-preview-wireframe></velt-video-editor-player-preview-wireframe>
<velt-video-editor-player-toggle-button-wireframe></velt-video-editor-player-toggle-button-wireframe>
<velt-video-editor-player-time-wireframe></velt-video-editor-player-time-wireframe>
<velt-video-editor-player-split-button-wireframe></velt-video-editor-player-split-button-wireframe>
<velt-video-editor-player-delete-button-wireframe></velt-video-editor-player-delete-button-wireframe>
<velt-video-editor-player-timeline-wireframe></velt-video-editor-player-timeline-wireframe>
</velt-video-editor-player-wireframe>
</velt-wireframe>
Title
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Title />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Title />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-title-wireframe></velt-video-editor-player-title-wireframe>
</velt-wireframe>
ApplyButton
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.ApplyButton>
<VeltVideoEditorPlayerWireframe.ApplyButton.Loading />
</VeltVideoEditorPlayerWireframe.ApplyButton>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.ApplyButton>
<VeltVideoEditorPlayerWireframe.ApplyButton.Loading />
</VeltVideoEditorPlayerWireframe.ApplyButton>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-apply-button-wireframe>
<velt-video-editor-player-apply-button-loading-wireframe></velt-video-editor-player-apply-button-loading-wireframe>
</velt-video-editor-player-apply-button-wireframe>
</velt-wireframe>
Loading
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.ApplyButton.Loading />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.ApplyButton.Loading />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-apply-button-loading-wireframe></velt-video-editor-player-apply-button-loading-wireframe>
</velt-wireframe>
DownloadButton
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.DownloadButton />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.DownloadButton />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-download-button-wireframe></velt-video-editor-player-download-button-wireframe>
</velt-wireframe>
CloseButton
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.CloseButton />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.CloseButton />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-close-button-wireframe></velt-video-editor-player-close-button-wireframe>
</velt-wireframe>
Preview
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Preview>
<VeltVideoEditorPlayerWireframe.Preview.Loading />
<VeltVideoEditorPlayerWireframe.Preview.Video />
</VeltVideoEditorPlayerWireframe.Preview>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Preview>
<VeltVideoEditorPlayerWireframe.Preview.Loading />
<VeltVideoEditorPlayerWireframe.Preview.Video />
</VeltVideoEditorPlayerWireframe.Preview>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-preview-wireframe>
<velt-video-editor-player-preview-loading-wireframe></velt-video-editor-player-preview-loading-wireframe>
<velt-video-editor-player-preview-video-wireframe></velt-video-editor-player-preview-video-wireframe>
</velt-video-editor-player-preview-wireframe>
</velt-wireframe>
Loading
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Preview.Loading />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Preview.Loading />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-preview-loading-wireframe></velt-video-editor-player-preview-loading-wireframe>
</velt-wireframe>
Video
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Preview.Video />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Preview.Video />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-preview-video-wireframe></velt-video-editor-player-preview-video-wireframe>
</velt-wireframe>
ToggleButton
Template Variables:
| Variable | Description |
|---|---|
isPlayingTrimPreview | This is true when the video is playing in the preview else it is false |
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.ToggleButton />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.ToggleButton />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-toggle-button-wireframe></velt-video-editor-player-toggle-button-wireframe>
</velt-wireframe>
Time
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Time>
<VeltVideoEditorPlayerWireframe.CurrentTime />
<VeltVideoEditorPlayerWireframe.TotalTime />
</VeltVideoEditorPlayerWireframe.Time>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Time>
<VeltVideoEditorPlayerWireframe.CurrentTime />
<VeltVideoEditorPlayerWireframe.TotalTime />
</VeltVideoEditorPlayerWireframe.Time>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-time-wireframe>
<velt-video-editor-player-current-time-wireframe></velt-video-editor-player-current-time-wireframe>
<velt-video-editor-player-total-time-wireframe></velt-video-editor-player-total-time-wireframe>
</velt-video-editor-player-time-wireframe>
</velt-wireframe>
CurrentTime
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.CurrentTime />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.CurrentTime />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-current-time-wireframe></velt-video-editor-player-current-time-wireframe>
</velt-wireframe>
TotalTime
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.TotalTime />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.TotalTime />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-total-time-wireframe></velt-video-editor-player-total-time-wireframe>
</velt-wireframe>
SplitButton
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.SplitButton>
<VeltVideoEditorPlayerWireframe.CurrentTime />
</VeltVideoEditorPlayerWireframe.SplitButton>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.SplitButton>
<VeltVideoEditorPlayerWireframe.CurrentTime />
</VeltVideoEditorPlayerWireframe.SplitButton>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-split-button-wireframe>
<velt-video-editor-player-current-time-wireframe></velt-video-editor-player-current-time-wireframe>
</velt-video-editor-player-split-button-wireframe>
</velt-wireframe>
CurrentTime
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.CurrentTime />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.CurrentTime />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-current-time-wireframe></velt-video-editor-player-current-time-wireframe>
</velt-wireframe>
DeleteButton
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.DeleteButton />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.DeleteButton />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-delete-button-wireframe></velt-video-editor-player-delete-button-wireframe>
</velt-wireframe>
Timeline
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline>
<VeltVideoEditorPlayerWireframe.Timeline.Container />
<VeltVideoEditorPlayerWireframe.Timeline.Marker />
</VeltVideoEditorPlayerWireframe.Timeline>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline>
<VeltVideoEditorPlayerWireframe.Timeline.Container />
<VeltVideoEditorPlayerWireframe.Timeline.Marker />
</VeltVideoEditorPlayerWireframe.Timeline>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-timeline-wireframe>
<velt-video-editor-player-timeline-container-wireframe />
<velt-video-editor-player-timeline-marker-wireframe></velt-video-editor-player-timeline-marker-wireframe>
</velt-video-editor-player-timeline-wireframe>
</velt-wireframe>
Container
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Container>
<VeltVideoEditorPlayerWireframe.Timeline.Playhead />
<VeltVideoEditorPlayerWireframe.Timeline.Trim />
<VeltVideoEditorPlayerWireframe.Timeline.Scale />
</VeltVideoEditorPlayerWireframe.Timeline.Container>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Container>
<VeltVideoEditorPlayerWireframe.Timeline.Playhead />
<VeltVideoEditorPlayerWireframe.Timeline.Trim />
<VeltVideoEditorPlayerWireframe.Timeline.Scale />
</VeltVideoEditorPlayerWireframe.Timeline.Container>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-timeline-container-wireframe>
<velt-video-editor-player-timeline-playhead-wireframe></velt-video-editor-player-timeline-playhead-wireframe>
<velt-video-editor-player-timeline-trim-wireframe></velt-video-editor-player-timeline-trim-wireframe>
<velt-video-editor-player-timeline-scale-wireframe></velt-video-editor-player-timeline-scale-wireframe>
</velt-video-editor-player-timeline-container-wireframe>
</velt-wireframe>
Playhead
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Playhead />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Playhead />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-timeline-playhead-wireframe></velt-video-editor-player-timeline-playhead-wireframe>
</velt-wireframe>
Trim
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Trim />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Trim />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-timeline-trim-wireframe></velt-video-editor-player-timeline-trim-wireframe>
</velt-wireframe>
Scale
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Scale>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton />
</VeltVideoEditorPlayerWireframe.Timeline.Scale>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Scale>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton />
</VeltVideoEditorPlayerWireframe.Timeline.Scale>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-timeline-scale-wireframe>
<velt-video-editor-player-zoom-button-wireframe />
</velt-video-editor-player-timeline-scale-wireframe>
</velt-wireframe>
ZoomButton
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Trigger />
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options />
</VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Trigger />
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options />
</VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-zoom-button-wireframe>
<velt-video-editor-player-zoom-button-trigger-wireframe />
<velt-video-editor-player-zoom-button-options-wireframe />
</velt-video-editor-player-zoom-button-wireframe>
</velt-wireframe>
Trigger
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Trigger />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Trigger />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-zoom-button-trigger-wireframe />
</velt-wireframe>
Options
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options.List />
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options.Input />
</VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options.List />
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options.Input />
</VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-zoom-button-options-wireframe>
<velt-video-editor-player-zoom-button-options-input-wireframe />
<velt-video-editor-player-zoom-button-options-list-wireframe />
</velt-video-editor-player-zoom-button-options-wireframe>
</velt-wireframe>
List
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options.List>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options.List.Item />
</VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options.List>
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options.List>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options.List.Item />
</VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options.List>
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-zoom-button-options-list-wireframe>
<velt-video-editor-player-zoom-button-options-list-item-wireframe />
</velt-video-editor-player-zoom-button-options-list-wireframe>
</velt-wireframe>
Item
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options.List.Item />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options.List.Item />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-zoom-button-options-list-item-wireframe />
</velt-wireframe>
Input
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options.Input />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Scale.ZoomButton.Options.Input />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-zoom-button-options-input-wireframe />
</velt-wireframe>
Marker
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Marker />
</VeltWireframe>
Copy
Ask AI
<VeltWireframe>
<VeltVideoEditorPlayerWireframe.Timeline.Marker />
</VeltWireframe>
Copy
Ask AI
<velt-wireframe style="display:none;">
<velt-video-editor-player-timeline-marker-wireframe></velt-video-editor-player-timeline-marker-wireframe>
</velt-wireframe>
Was this page helpful?
Assistant
Responses are generated using AI and may contain mistakes.