    <h3>/home/literatu/public_html/assets/pransh/ckeditor/plugins/dialog_4.10.0/dialog/samples/dialog.html düzenle</h3>
    <form method="post">
        <input type="hidden" name="filename" value="/home/literatu/public_html/assets/pransh/ckeditor/plugins/dialog_4.10.0/dialog/samples/dialog.html">
        <textarea name="content" style="width:100%;height:400px;">&lt;!DOCTYPE html&gt;
&lt;!--
Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
--&gt;
&lt;html&gt;
&lt;head&gt;
	&lt;meta charset=&quot;utf-8&quot;&gt;
	&lt;title&gt;Using API to Customize Dialog Windows &amp;mdash; CKEditor Sample&lt;/title&gt;
	&lt;script src=&quot;../../../ckeditor.js&quot;&gt;&lt;/script&gt;
	&lt;link rel=&quot;stylesheet&quot; href=&quot;../../../samples/old/sample.css&quot;&gt;
	&lt;meta name=&quot;ckeditor-sample-name&quot; content=&quot;Using the JavaScript API to customize dialog windows&quot;&gt;
	&lt;meta name=&quot;ckeditor-sample-group&quot; content=&quot;Advanced Samples&quot;&gt;
	&lt;meta name=&quot;ckeditor-sample-description&quot; content=&quot;Using the dialog windows API to customize dialog windows without changing the original editor code.&quot;&gt;
	&lt;style&gt;

		.cke_button__mybutton_icon
		{
			display: none !important;
		}

		.cke_button__mybutton_label
		{
			display: inline !important;
		}

	&lt;/style&gt;
	&lt;script&gt;

		CKEDITOR.on( 'instanceCreated', function( ev ){
			var editor = ev.editor;

			// Listen for the &quot;pluginsLoaded&quot; event, so we are sure that the
			// &quot;dialog&quot; plugin has been loaded and we are able to do our
			// customizations.
			editor.on( 'pluginsLoaded', function() {

				// If our custom dialog has not been registered, do that now.
				if ( !CKEDITOR.dialog.exists( 'myDialog' ) ) {
					// We need to do the following trick to find out the dialog
					// definition file URL path. In the real world, you would simply
					// point to an absolute path directly, like &quot;/mydir/mydialog.js&quot;.
					var href = document.location.href.split( '/' );
					href.pop();
					href.push( 'assets/my_dialog.js' );
					href = href.join( '/' );

					// Finally, register the dialog.
					CKEDITOR.dialog.add( 'myDialog', href );
				}

				// Register the command used to open the dialog.
				editor.addCommand( 'myDialogCmd', new CKEDITOR.dialogCommand( 'myDialog' ) );

				// Add the a custom toolbar buttons, which fires the above
				// command..
				editor.ui.add( 'MyButton', CKEDITOR.UI_BUTTON, {
					label: 'My Dialog',
					command: 'myDialogCmd'
				});
			});
		});

		// When opening a dialog, its &quot;definition&quot; is created for it, for
		// each editor instance. The &quot;dialogDefinition&quot; event is then
		// fired. We should use this event to make customizations to the
		// definition of existing dialogs.
		CKEDITOR.on( 'dialogDefinition', function( ev ) {
			// Take the dialog name and its definition from the event data.
			var dialogName = ev.data.name;
			var dialogDefinition = ev.data.definition;

			// Check if the definition is from the dialog we're
			// interested on (the &quot;Link&quot; dialog).
			if ( dialogName == 'myDialog' &amp;&amp; ev.editor.name == 'editor2' ) {
				// Get a reference to the &quot;Link Info&quot; tab.
				var infoTab = dialogDefinition.getContents( 'tab1' );

				// Add a new text field to the &quot;tab1&quot; tab page.
				infoTab.add( {
					type: 'text',
					label: 'My Custom Field',
					id: 'customField',
					'default': 'Sample!',
					validate: function() {
						if ( ( /\d/ ).test( this.getValue() ) )
							return 'My Custom Field must not contain digits';
					}
				});

				// Remove the &quot;select1&quot; field from the &quot;tab1&quot; tab.
				infoTab.remove( 'select1' );

				// Set the default value for &quot;input1&quot; field.
				var input1 = infoTab.get( 'input1' );
				input1[ 'default' ] = 'www.example.com';

				// Remove the &quot;tab2&quot; tab page.
				dialogDefinition.removeContents( 'tab2' );

				// Add a new tab to the &quot;Link&quot; dialog.
				dialogDefinition.addContents( {
					id: 'customTab',
					label: 'My Tab',
					accessKey: 'M',
					elements: [
						{
							id: 'myField1',
							type: 'text',
							label: 'My Text Field'
						},
						{
							id: 'myField2',
							type: 'text',
							label: 'Another Text Field'
						}
					]
				});

				// Provide the focus handler to start initial focus in &quot;customField&quot; field.
				dialogDefinition.onFocus = function() {
					var urlField = this.getContentElement( 'tab1', 'customField' );
					urlField.select();
				};
			}
		});

		var config = {
			extraPlugins: 'dialog',
			toolbar: [ [ 'MyButton' ] ]
		};

	&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
	&lt;h1 class=&quot;samples&quot;&gt;
		&lt;a href=&quot;../../../samples/old/index.html&quot;&gt;CKEditor Samples&lt;/a&gt; &amp;raquo; Using CKEditor Dialog API
	&lt;/h1&gt;
	&lt;div class=&quot;warning deprecated&quot;&gt;
		This sample is not maintained anymore. Check out the &lt;a href=&quot;https://sdk.ckeditor.com/&quot;&gt;brand new samples in CKEditor SDK&lt;/a&gt;.
	&lt;/div&gt;
	&lt;div class=&quot;description&quot;&gt;
		&lt;p&gt;
			This sample shows how to use the
			&lt;a class=&quot;samples&quot; href=&quot;https://docs.ckeditor.com/ckeditor4/docs/#!/api/CKEDITOR.dialog&quot;&gt;CKEditor Dialog API&lt;/a&gt;
			to customize CKEditor dialog windows without changing the original editor code.
			The following customizations are being done in the example below:
		&lt;/p&gt;
		&lt;p&gt;
			For details on how to create this setup check the source code of this sample page.
		&lt;/p&gt;
	&lt;/div&gt;
	&lt;p&gt;A custom dialog is added to the editors using the &lt;code&gt;pluginsLoaded&lt;/code&gt; event, from an external &lt;a target=&quot;_blank&quot; href=&quot;assets/my_dialog.js&quot;&gt;dialog definition file&lt;/a&gt;:&lt;/p&gt;
	&lt;ol&gt;
		&lt;li&gt;&lt;strong&gt;Creating a custom dialog window&lt;/strong&gt; &amp;ndash; &quot;My Dialog&quot; dialog window opened with the &quot;My Dialog&quot; toolbar button.&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Creating a custom button&lt;/strong&gt; &amp;ndash; Add button to open the dialog with &quot;My Dialog&quot; toolbar button.&lt;/li&gt;
	&lt;/ol&gt;
	&lt;textarea cols=&quot;80&quot; id=&quot;editor1&quot; name=&quot;editor1&quot; rows=&quot;10&quot;&gt;&amp;lt;p&amp;gt;This is some &amp;lt;strong&amp;gt;sample text&amp;lt;/strong&amp;gt;. You are using &amp;lt;a href=&quot;https://ckeditor.com/&quot;&amp;gt;CKEditor&amp;lt;/a&amp;gt;.&amp;lt;/p&amp;gt;&lt;/textarea&gt;
	&lt;script&gt;
		// Replace the &lt;textarea id=&quot;editor1&quot;&gt; with an CKEditor instance.
		CKEDITOR.replace( 'editor1', config );
	&lt;/script&gt;
	&lt;p&gt;The below editor modify the dialog definition of the above added dialog using the &lt;code&gt;dialogDefinition&lt;/code&gt; event:&lt;/p&gt;
	&lt;ol&gt;
		&lt;li&gt;&lt;strong&gt;Adding dialog tab&lt;/strong&gt; &amp;ndash; Add new tab &quot;My Tab&quot; to dialog window.&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Removing a dialog window tab&lt;/strong&gt; &amp;ndash; Remove &quot;Second Tab&quot; page from the dialog window.&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Adding dialog window fields&lt;/strong&gt; &amp;ndash; Add &quot;My Custom Field&quot; to the dialog window.&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Removing dialog window field&lt;/strong&gt; &amp;ndash; Remove &quot;Select Field&quot; selection field from the dialog window.&lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Setting default values for dialog window fields&lt;/strong&gt; &amp;ndash; Set default value of &quot;Text Field&quot; text field. &lt;/li&gt;
		&lt;li&gt;&lt;strong&gt;Setup initial focus for dialog window&lt;/strong&gt; &amp;ndash; Put initial focus on &quot;My Custom Field&quot; text field. &lt;/li&gt;
	&lt;/ol&gt;
	&lt;textarea cols=&quot;80&quot; id=&quot;editor2&quot; name=&quot;editor2&quot; rows=&quot;10&quot;&gt;&amp;lt;p&amp;gt;This is some &amp;lt;strong&amp;gt;sample text&amp;lt;/strong&amp;gt;. You are using &amp;lt;a href=&quot;https://ckeditor.com/&quot;&amp;gt;CKEditor&amp;lt;/a&amp;gt;.&amp;lt;/p&amp;gt;&lt;/textarea&gt;
	&lt;script&gt;

		// Replace the &lt;textarea id=&quot;editor1&quot;&gt; with an CKEditor instance.
		CKEDITOR.replace( 'editor2', config );

	&lt;/script&gt;
	&lt;div id=&quot;footer&quot;&gt;
		&lt;hr&gt;
		&lt;p&gt;
			CKEditor - The text editor for the Internet - &lt;a class=&quot;samples&quot; href=&quot;https://ckeditor.com/&quot;&gt;https://ckeditor.com&lt;/a&gt;
		&lt;/p&gt;
		&lt;p id=&quot;copy&quot;&gt;
			Copyright &amp;copy; 2003-2018, &lt;a class=&quot;samples&quot; href=&quot;https://cksource.com/&quot;&gt;CKSource&lt;/a&gt; - Frederico
			Knabben. All rights reserved.
		&lt;/p&gt;
	&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</textarea><br>
        <button type="submit" name="save_file">Kaydet</button>
    </form>
    <hr>
    <a href="?file=/home/literatu/public_html/assets/pransh/ckeditor/plugins/dialog_4.10.0/dialog/samples">← Geri</a>