Skip to main content

YouTube Video Dialogs

  • 2 minutes to read

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

In the Design View, use the techniques below to invoke a dialog:

Dialog Structure

ChangeYouTubeVideoDialog

The YouTube video dialog allows users to enter a YouTube video URL and preview the video before inserting it into the editor content.

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

Dialog Customization

At design time, you can use the ASPxHtmlEditor Designer to customize dialog settings. Programmatically, you can specify the HtmlEditorDefaultDialogSettings.InsertYouTubeVideoDialog property for this purpose.

InsertYouTubeVideoDialog

Online Demo

Insert Media Content

On the client side, the ASPxHtmlEditor API allows you to manage the opened dialog programmatically.

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