YouTube Video Dialogs

  • 2 min to read

YouTube video dialogs include the Insert YouTube Video and Change YouTube Video dialogs that allow end users to insert YouTube video content to the editor and change it, respectively.

A dialog can be invoked in the design view in the following ways.

Dialog Structure

ChangeYouTubeVideoDialog

The YouTube video dialog allows end-users to input YouTube video URL and preview the video before insert it to the editor content.

When the More options check box is selected, the dialog displays the settings section, which allows end-users to customize YouTube video element settings (size, position, description and style settings such as margins, border and CSS class). You can hide the check box by setting the HtmlEditorInsertMediaDialogSettingsBase.ShowMoreOptionsButton property to false.

Dialog Customization

You can customize dialog settings programmatically by using the HtmlEditorDefaultDialogSettings.InsertYouTubeVideoDialog property or by using the design-time ASPxHtmlEditor Designer.

InsertYouTubeVideoDialog

Online Demo

Insert Media Content

ASPxHtmlEditor provides a comprehensive API, allowing you to operate with the opened dialog programmatically on the client side.

Dialog UI elements

Client method

Common Dialog UI elements

ASPxClientHtmlEditorMediaDialogBase.GetMoreOptionsCheckBox

ASPxClientHtmlEditorDialogBase.GetOkButton

ASPxClientHtmlEditorDialogBase.GetCancelButton

ASPxClientHtmlEditorLinkDialog.GetUrlTextBox

"Common Settings" Tab UI elements

ASPxClientHtmlEditorMediaDialogBase.GetWidthSpinEdit

ASPxClientHtmlEditorMediaDialogBase.GetHeightSpinEdit

ASPxClientHtmlEditorMediaDialogBase.GetPositionComboBox

ASPxClientHtmlEditorYouTubeDialog.GetShowSameVideosCheckBox

ASPxClientHtmlEditorYouTubeDialog.GetShowPlayerControlsCheckBox

ASPxClientHtmlEditorYouTubeDialog.GetShowVideoNameCheckBox

ASPxClientHtmlEditorYouTubeDialog.GetConfidentModeCheckBox

"Style Settings" Tab UI elements

ASPxClientHtmlEditorEditElementDialog.GetTopMarginTextBox

ASPxClientHtmlEditorEditElementDialog.GetRightMarginTextBox

ASPxClientHtmlEditorEditElementDialog.GetBottomMarginTextBox

ASPxClientHtmlEditorEditElementDialog.GetLeftMarginTextBox

ASPxClientHtmlEditorEditElementDialog.GetBorderWidthSpinEdit

ASPxClientHtmlEditorEditElementDialog.GetBorderColorColorEdit

ASPxClientHtmlEditorEditElementDialog.GetBorderStyleComboBox

ASPxHtmlEditor-ClientAPI-InsertVideoYT1