# CKEditor Samples » Raw HTML editing with dialog-based source editor

Sourcedialog plugin provides an easy way to edit raw HTML content of an editor, similarly to what is possible with Sourcearea plugin for framed instances but using dialogs. Thanks to that, it's also possible to manipulate raw content of inline editor instances.

This plugin extends the toolbar with a button, which opens a dialog window with a source code editor. It works with both framed and inline instances. To enable this plugin, basically add `extraPlugins: 'sourcedialog'` to editor's config:

    // Inline editor.
    CKEDITOR.inline( 'editable', {
    	extraPlugins: 'sourcedialog'
    });

    // Framed editor.
    CKEDITOR.replace( 'textarea_id', {
    	extraPlugins: 'sourcedialog',
    	removePlugins: 'sourcearea'
    });

Note that you may want to include `removePlugins: 'sourcearea'` in your config when using Sourcedialog in framed instances. This prevents feature redundancy.

Note that `editable` in the code above is the `id` attribute of the `<div>` element to be converted into an inline instance.

Note that `textarea_id` in the code above is the `id` attribute of the `<textarea>` element to be replaced with CKEditor.

Inline editor:

This is some sample text. You are using CKEditor.

Framed editor: This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.