CK Editor — Full

This is an example of the CKEditor using a full-page option. It's the same editor as this one, only, it has a lot more buttons. Plus, this one generates HTML tags for the whole page (the other one just generates small HTML snippets).

This is the full-featured version of CKEditor. This version comes with a full range of toolbar options (for a smaller set of options, see the standard version).

This editor has been configured using the fullpage : true option. Enabling this option results in the source code generating the <html>, <head>, <title>, and <body> tags, as well as the <!doctype> declaration.

About This HTML Editor

The above HTML editor is known as "CKEditor". CKEditor is a ready-for-use HTML text editor designed to simplify web content creation. It's a WYSIWYG editor that brings common word processor features directly to your web pages.

Developers can use CKEditor in their own projects. For example, you could install CKEditor into your organization's content management system so that content providers can update the corporate website or intranet.

Setting up CKEditor

You can setup CKEditor with a small amount of JavaScript and HTML code. Here's the code used to set up the above example:

<script type="text/javascript" src="<your installation path>/ckeditor/ckeditor_4.4.1_full/ckeditor.js"></script> 

<textarea class="ckeditor" id="myEditor" name="myEditor" cols="35" rows="20"></textarea>
<script type="text/javascript"> 
//<![CDATA[

	CKEDITOR.replace( 'myEditor',
		{
			fullPage : true,
			uiColor : '#efe8ce'
		});
//]]>
</script>

Features

CKEditor is full of features as listed on the CKEditor website.

Features for End Users

Some of the key features for end users include:

Basic & advanced styling

Apply basic styles like bold and italic with ease, as well as more complex styling and semantic rules defined by the website developer. Rich styles, under control.

Real block-quoting

Properly quote text using the correct and semantics-aware <blockquote> tag. Other editors simply focus on the visuals, adding margins to standard paragraphs (that's so 90s).

Colors

Plain text may be boring. It’s sometimes nice to distinguish or highlight text with color or give tables more personality. With the color selector this job is a few clicks away.

Advanced paste from Word

Most content is written in Microsoft Word and web browsers use HTML. CKEditor's powerful and unique Paste from Word feature makes it easy to convert text.

Advanced linking

Other than creating usual web links with ease, CKEditor makes it possible to build advanced links that can open popups, links to anchors, e-mails or any kind of web resource.

E-mail linking

Creating e-mail links with CKEditor is as simple as inserting the desired e-mail address. Even the message subject and text can be set, so e-mails will be pre-compiled.

Features for Developers

Some of the key features for developers include:

Rich JavaScript API

CKEditor is an advanced editing platform, offering a strong and extensive JavaScript API. It's possible to interact with the editor at runtime, creating customized and innovative features and content manipulation.

Plugin-based

The editor structure is totally plugin-based, including many of its core features. Plugins live in separate files, making them easy to organize and maintain. Our JavaScript API makes developing plugins a rich experience.

Customizable & extensible

It's possible to customize every single aspect of the editor, from the toolbar, to the skin, to dialogs, to the context menu, data parsing, styling, etc. Our plugin system makes it easy to separate your custom logic from the editor core.

Total toolbar control

Too many features can make things difficult for users. Even the toolbar arrangement is important. With CKEditor you can customize the interface by keeping the tools you need, offering full control of the editor’s functions.

AJAX ready

Create, interact and destroy editor instances with ease, minimizing server-side communication and offering a rich user experience. CKEditor is in line with present and future applications.

Easy textarea replacement

Replacing <textarea> fields in your pages is a simple task. You can use CSS classes for that, decide which to replace by code, or even replace all of them with ease.

Download CKEditor

CKEditor can be downloaded from the CKEditor website. It is distributed under the GPL, LGPL, and MPL open source licences.