|
|
<!DOCTYPE html> <!--
Copyright (c) 2003-2014, CKSource - Frederico Knabben. All rights reserved. For licensing, see LICENSE.md or http://ckeditor.com/license --> <html> <head> <meta charset="utf-8"> <title>Data Filtering — CKEditor Sample</title> <script src="../ckeditor.js"></script> <link rel="stylesheet" href="sample.css"> <script> // Remove advanced tabs for all editors. CKEDITOR.config.removeDialogTabs = 'image:advanced;link:advanced;flash:advanced;creatediv:advanced;editdiv:advanced'; </script> </head> <body> <h1 class="samples"> <a href="index.html">CKEditor Samples</a> » Data Filtering and Features Activation </h1> <div class="description"> <p> This sample page demonstrates the idea of Advanced Content Filter (<abbr title="Advanced Content Filter">ACF</abbr>), a sophisticated tool that takes control over what kind of data is accepted by the editor and what kind of output is produced. </p> <h2>When and what is being filtered?</h2> <p> <abbr title="Advanced Content Filter">ACF</abbr> controls <strong>every single source of data</strong> that comes to the editor. It process both HTML that is inserted manually (i.e. pasted by the user) and programmatically like: </p> <pre class="samples"> editor.setData( '<p>Hello world!</p>' ); </pre> <p> <abbr title="Advanced Content Filter">ACF</abbr> discards invalid, useless HTML tags and attributes so the editor remains "clean" during runtime. <abbr title="Advanced Content Filter">ACF</abbr> behaviour can be configured and adjusted for a particular case to prevent the output HTML (i.e. in CMS systems) from being polluted.
This kind of filtering is a first, client-side line of defense against "<a href="http://en.wikipedia.org/wiki/Tag_soup">tag soups</a>", the tool that precisely restricts which tags, attributes and styles are allowed (desired). When properly configured, <abbr title="Advanced Content Filter">ACF</abbr> is an easy and fast way to produce a high-quality, intentionally filtered HTML. </p>
<h3>How to configure or disable ACF?</h3> <p> Advanced Content Filter is enabled by default, working in "automatic mode", yet it provides a set of easy rules that allow adjusting filtering rules and disabling the entire feature when necessary. The config property responsible for this feature is <code><a class="samples" href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-allowedContent">config.allowedContent</a></code>. </p> <p> By "automatic mode" is meant that loaded plugins decide which kind of content is enabled and which is not. For example, if the link plugin is loaded it implies that <code><a></code> tag is automatically allowed. Each plugin is given a set of predefined <abbr title="Advanced Content Filter">ACF</abbr> rules that control the editor until <code><a class="samples" href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-allowedContent"> config.allowedContent</a></code> is defined manually. </p> <p> Let's assume our intention is to restrict the editor to accept (produce) <strong>paragraphs only: no attributes, no styles, no other tags</strong>. With <abbr title="Advanced Content Filter">ACF</abbr> this is very simple. Basically set <code><a class="samples" href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-allowedContent"> config.allowedContent</a></code> to <code>'p'</code>: </p> <pre class="samples"> var editor = CKEDITOR.replace( <em>textarea_id</em>, { <strong>allowedContent: 'p'</strong> } ); </pre> <p> Now try to play with allowed content: </p> <pre class="samples"> // Trying to insert disallowed tag and attribute. editor.setData( '<p <strong>style="color: red"</strong>>Hello <strong><em>world</em></strong>!</p>' ); alert( editor.getData() );
// Filtered data is returned. "<p>Hello world!</p>" </pre> <p> What happened? Since <code>config.allowedContent: 'p'</code> is set the editor assumes that only plain <code><p></code> are accepted. Nothing more. This is why <code>style</code> attribute and <code><em></code> tag are gone. The same filtering would happen if we pasted disallowed HTML into this editor. </p> <p> This is just a small sample of what <abbr title="Advanced Content Filter">ACF</abbr> can do. To know more, please refer to the sample section below and <a href="http://docs.ckeditor.com/#!/guide/dev_advanced_content_filter">the official Advanced Content Filter guide</a>. </p> <p> You may, of course, want CKEditor to avoid filtering of any kind. To get rid of <abbr title="Advanced Content Filter">ACF</abbr>, basically set <code><a class="samples" href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-allowedContent"> config.allowedContent</a></code> to <code>true</code> like this: </p> <pre class="samples"> CKEDITOR.replace( <em>textarea_id</em>, { <strong>allowedContent: true</strong> } ); </pre>
<h2>Beyond data flow: Features activation</h2> <p> <abbr title="Advanced Content Filter">ACF</abbr> is far more than <abbr title="Input/Output">I/O</abbr> control: the entire <abbr title="User Interface">UI</abbr> of the editor is adjusted to what filters restrict. For example: if <code><a></code> tag is <strong>disallowed</strong> by <abbr title="Advanced Content Filter">ACF</abbr>, then accordingly <code>link</code> command, toolbar button and link dialog are also disabled. Editor is smart: it knows which features must be removed from the interface to match filtering rules. </p> <p> CKEditor can be far more specific. If <code><a></code> tag is <strong>allowed</strong> by filtering rules to be used but it is restricted to have only one attribute (<code>href</code>) <code>config.allowedContent = 'a[!href]'</code>, then "Target" tab of the link dialog is automatically disabled as <code>target</code> attribute isn't included in <abbr title="Advanced Content Filter">ACF</abbr> rules for <code><a></code>. This behaviour applies to dialog fields, context menus and toolbar buttons. </p>
<h2>Sample configurations</h2> <p> There are several editor instances below that present different <abbr title="Advanced Content Filter">ACF</abbr> setups. <strong>All of them, except the last inline instance, share the same HTML content</strong> to visualize how different filtering rules affect the same input data. </p> </div>
<div> <label for="editor1"> Editor 1: </label> <div class="description"> <p> This editor is using default configuration ("automatic mode"). It means that <code><a class="samples" href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-allowedContent"> config.allowedContent</a></code> is defined by loaded plugins. Each plugin extends filtering rules to make it's own associated content available for the user. </p> </div> <textarea cols="80" id="editor1" name="editor1" rows="10"> <h1><img alt="Saturn V carrying Apollo 11" class="right" src="assets/sample.jpg"/> Apollo 11</h1> <p><b>Apollo 11</b> was the spaceflight that landed the first humans, Americans <a href="http://en.wikipedia.org/wiki/Neil_Armstrong" title="Neil Armstrong">Neil Armstrong</a> and <a href="http://en.wikipedia.org/wiki/Buzz_Aldrin" title="Buzz Aldrin">Buzz Aldrin</a>, on the Moon on July 20, 1969, at 20:18 UTC. Armstrong became the first to step onto the lunar surface 6 hours later on July 21 at 02:56 UTC.</p> <p>Armstrong spent about <s>three and a half</s> two and a half hours outside the spacecraft, Aldrin slightly less; and together they collected 47.5 pounds (21.5&nbsp;kg) of lunar material for return to Earth. A third member of the mission, <a href="http://en.wikipedia.org/wiki/Michael_Collins_(astronaut)" title="Michael Collins (astronaut)">Michael Collins</a>, piloted the <a href="http://en.wikipedia.org/wiki/Apollo_Command/Service_Module" title="Apollo Command/Service Module">command</a> spacecraft alone in lunar orbit until Armstrong and Aldrin returned to it for the trip back to Earth.</p> <h2>Broadcasting and <em>quotes</em> <a id="quotes" name="quotes"></a></h2> <p>Broadcast on live TV to a world-wide audience, Armstrong stepped onto the lunar surface and described the event as:</p> <blockquote><p>One small step for [a] man, one giant leap for mankind.</p></blockquote> <p>Apollo 11 effectively ended the <a href="http://en.wikipedia.org/wiki/Space_Race" title="Space Race">Space Race</a> and fulfilled a national goal proposed in 1961 by the late U.S. President <a href="http://en.wikipedia.org/wiki/John_F._Kennedy" title="John F. Kennedy">John F. Kennedy</a> in a speech before the United States Congress:</p> <blockquote><p>[...] before this decade is out, of landing a man on the Moon and returning him safely to the Earth.</p></blockquote> <h2>Technical details <a id="tech-details" name="tech-details"></a></h2> <table align="right" border="1" bordercolor="#ccc" cellpadding="5" cellspacing="0" style="border-collapse:collapse;margin:10px 0 10px 15px;"> <caption><strong>Mission crew</strong></caption> <thead> <tr> <th scope="col">Position</th> <th scope="col">Astronaut</th> </tr> </thead> <tbody> <tr> <td>Commander</td> <td>Neil A. Armstrong</td> </tr> <tr> <td>Command Module Pilot</td> <td>Michael Collins</td> </tr> <tr> <td>Lunar Module Pilot</td> <td>Edwin &quot;Buzz&quot; E. Aldrin, Jr.</td> </tr> </tbody> </table> <p>Launched by a <strong>Saturn V</strong> rocket from <a href="http://en.wikipedia.org/wiki/Kennedy_Space_Center" title="Kennedy Space Center">Kennedy Space Center</a> in Merritt Island, Florida on July 16, Apollo 11 was the fifth manned mission of <a href="http://en.wikipedia.org/wiki/NASA" title="NASA">NASA</a>&#39;s Apollo program. The Apollo spacecraft had three parts:</p> <ol> <li><strong>Command Module</strong> with a cabin for the three astronauts which was the only part which landed back on Earth</li> <li><strong>Service Module</strong> which supported the Command Module with propulsion, electrical power, oxygen and water</li> <li><strong>Lunar Module</strong> for landing on the Moon.</l </textarea>
<script>
CKEDITOR.replace( 'editor1' );
</script> </div>
<br>
<div> <label for="editor2"> Editor 2: </label> <div class="description"> <p> This editor is using a custom configuration for <abbr title="Advanced Content Filter">ACF</abbr>: </p> <pre class="samples"> CKEDITOR.replace( 'editor2', { allowedContent: 'h1 h2 h3 p blockquote strong em;' + 'a[!href];' + 'img(left,right)[!src,alt,width,height];' + 'table tr th td caption;' + 'span{!font-family};' +' 'span{!color};' + 'span(!marker);' + 'del ins' } ); </pre> <p> The following rules may require additional explanation: </p> <ul> <li> <code>h1 h2 h3 p blockquote strong em</code> - These tags are accepted by the editor. Any tag attributes will be discarded. </li> <li> <code>a[!href]</code> - <code>href</code> attribute is obligatory for <code><a></code> tag. Tags without this attribute are disarded. No other attribute will be accepted. </li> <li> <code>img(left,right)[!src,alt,width,height]</code> - <code>src</code> attribute is obligatory for <code><img></code> tag. <code>alt</code>, <code>width</code>, <code>height</code> and <code>class</code> attributes are accepted but <code>class</code> must be either <code>class="left"</code> or <code>class="right"</code> </li> <li> <code>table tr th td caption</code> - These tags are accepted by the editor. Any tag attributes will be discarded. </li> <li> <code>span{!font-family}</code>, <code>span{!color}</code>, <code>span(!marker)</code> - <code><span></code> tags will be accepted if either <code>font-family</code> or <code>color</code> style is set or <code>class="marker"</code> is present. </li> <li> <code>del ins</code> - These tags are accepted by the editor. Any tag attributes will be discarded. </li> </ul> <p> Please note that <strong><abbr title="User Interface">UI</abbr> of the editor is different</strong>. It's a response to what happened to the filters. Since <code>text-align</code> isn't allowed, the align toolbar is gone. The same thing happened to subscript/superscript, strike, underline (<code><u></code>, <code><sub></code>, <code><sup></code> are disallowed by <code><a class="samples" href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-allowedContent"> config.allowedContent</a></code>) and many other buttons. </p> </div> <textarea cols="80" id="editor2" name="editor2" rows="10"> <h1><img alt="Saturn V carrying Apollo 11" class="right" src="assets/sample.jpg"/> Apollo 11</h1> <p><b>Apollo 11</b> was the spaceflight that landed the first humans, Americans <a href="http://en.wikipedia.org/wiki/Neil_Armstrong" title="Neil Armstrong">Neil Armstrong</a> and <a href="http://en.wikipedia.org/wiki/Buzz_Aldrin" title="Buzz Aldrin">Buzz Aldrin</a>, on the Moon on July 20, 1969, at 20:18 UTC. Armstrong became the first to step onto the lunar surface 6 hours later on July 21 at 02:56 UTC.</p> <p>Armstrong spent about <s>three and a half</s> two and a half hours outside the spacecraft, Aldrin slightly less; and together they collected 47.5 pounds (21.5&nbsp;kg) of lunar material for return to Earth. A third member of the mission, <a href="http://en.wikipedia.org/wiki/Michael_Collins_(astronaut)" title="Michael Collins (astronaut)">Michael Collins</a>, piloted the <a href="http://en.wikipedia.org/wiki/Apollo_Command/Service_Module" title="Apollo Command/Service Module">command</a> spacecraft alone in lunar orbit until Armstrong and Aldrin returned to it for the trip back to Earth.</p> <h2>Broadcasting and <em>quotes</em> <a id="quotes" name="quotes"></a></h2> <p>Broadcast on live TV to a world-wide audience, Armstrong stepped onto the lunar surface and described the event as:</p> <blockquote><p>One small step for [a] man, one giant leap for mankind.</p></blockquote> <p>Apollo 11 effectively ended the <a href="http://en.wikipedia.org/wiki/Space_Race" title="Space Race">Space Race</a> and fulfilled a national goal proposed in 1961 by the late U.S. President <a href="http://en.wikipedia.org/wiki/John_F._Kennedy" title="John F. Kennedy">John F. Kennedy</a> in a speech before the United States Congress:</p> <blockquote><p>[...] before this decade is out, of landing a man on the Moon and returning him safely to the Earth.</p></blockquote> <h2>Technical details <a id="tech-details" name="tech-details"></a></h2> <table align="right" border="1" bordercolor="#ccc" cellpadding="5" cellspacing="0" style="border-collapse:collapse;margin:10px 0 10px 15px;"> <caption><strong>Mission crew</strong></caption> <thead> <tr> <th scope="col">Position</th> <th scope="col">Astronaut</th> </tr> </thead> <tbody> <tr> <td>Commander</td> <td>Neil A. Armstrong</td> </tr> <tr> <td>Command Module Pilot</td> <td>Michael Collins</td> </tr> <tr> <td>Lunar Module Pilot</td> <td>Edwin &quot;Buzz&quot; E. Aldrin, Jr.</td> </tr> </tbody> </table> <p>Launched by a <strong>Saturn V</strong> rocket from <a href="http://en.wikipedia.org/wiki/Kennedy_Space_Center" title="Kennedy Space Center">Kennedy Space Center</a> in Merritt Island, Florida on July 16, Apollo 11 was the fifth manned mission of <a href="http://en.wikipedia.org/wiki/NASA" title="NASA">NASA</a>&#39;s Apollo program. The Apollo spacecraft had three parts:</p> <ol> <li><strong>Command Module</strong> with a cabin for the three astronauts which was the only part which landed back on Earth</li> <li><strong>Service Module</strong> which supported the Command Module with propulsion, electrical power, oxygen and water</li> <li><strong>Lunar Module</strong> for landing on the Moon.</l </textarea> <script>
CKEDITOR.replace( 'editor2', { allowedContent: 'h1 h2 h3 p blockquote strong em;' + 'a[!href];' + 'img(left,right)[!src,alt,width,height];' + 'table tr th td caption;' + 'span{!font-family};' + 'span{!color};' + 'span(!marker);' + 'del ins' } );
</script> </div>
<br>
<div> <label for="editor3"> Editor 3: </label> <div class="description"> <p> This editor is using a custom configuration for <abbr title="Advanced Content Filter">ACF</abbr>. Note that filters can be configured as an object literal as an alternative to a string-based definition. </p> <pre class="samples"> CKEDITOR.replace( 'editor3', { allowedContent: { 'b i ul ol big small': true, 'h1 h2 h3 p blockquote li': { styles: 'text-align' }, a: { attributes: '!href,target' }, img: { attributes: '!src,alt', styles: 'width,height', classes: 'left,right' } } } ); </pre> </div> <textarea cols="80" id="editor3" name="editor3" rows="10"> <h1><img alt="Saturn V carrying Apollo 11" class="right" src="assets/sample.jpg"/> Apollo 11</h1> <p><b>Apollo 11</b> was the spaceflight that landed the first humans, Americans <a href="http://en.wikipedia.org/wiki/Neil_Armstrong" title="Neil Armstrong">Neil Armstrong</a> and <a href="http://en.wikipedia.org/wiki/Buzz_Aldrin" title="Buzz Aldrin">Buzz Aldrin</a>, on the Moon on July 20, 1969, at 20:18 UTC. Armstrong became the first to step onto the lunar surface 6 hours later on July 21 at 02:56 UTC.</p> <p>Armstrong spent about <s>three and a half</s> two and a half hours outside the spacecraft, Aldrin slightly less; and together they collected 47.5 pounds (21.5&nbsp;kg) of lunar material for return to Earth. A third member of the mission, <a href="http://en.wikipedia.org/wiki/Michael_Collins_(astronaut)" title="Michael Collins (astronaut)">Michael Collins</a>, piloted the <a href="http://en.wikipedia.org/wiki/Apollo_Command/Service_Module" title="Apollo Command/Service Module">command</a> spacecraft alone in lunar orbit until Armstrong and Aldrin returned to it for the trip back to Earth.</p> <h2>Broadcasting and <em>quotes</em> <a id="quotes" name="quotes"></a></h2> <p>Broadcast on live TV to a world-wide audience, Armstrong stepped onto the lunar surface and described the event as:</p> <blockquote><p>One small step for [a] man, one giant leap for mankind.</p></blockquote> <p>Apollo 11 effectively ended the <a href="http://en.wikipedia.org/wiki/Space_Race" title="Space Race">Space Race</a> and fulfilled a national goal proposed in 1961 by the late U.S. President <a href="http://en.wikipedia.org/wiki/John_F._Kennedy" title="John F. Kennedy">John F. Kennedy</a> in a speech before the United States Congress:</p> <blockquote><p>[...] before this decade is out, of landing a man on the Moon and returning him safely to the Earth.</p></blockquote> <h2>Technical details <a id="tech-details" name="tech-details"></a></h2> <table align="right" border="1" bordercolor="#ccc" cellpadding="5" cellspacing="0" style="border-collapse:collapse;margin:10px 0 10px 15px;"> <caption><strong>Mission crew</strong></caption> <thead> <tr> <th scope="col">Position</th> <th scope="col">Astronaut</th> </tr> </thead> <tbody> <tr> <td>Commander</td> <td>Neil A. Armstrong</td> </tr> <tr> <td>Command Module Pilot</td> <td>Michael Collins</td> </tr> <tr> <td>Lunar Module Pilot</td> <td>Edwin &quot;Buzz&quot; E. Aldrin, Jr.</td> </tr> </tbody> </table> <p>Launched by a <strong>Saturn V</strong> rocket from <a href="http://en.wikipedia.org/wiki/Kennedy_Space_Center" title="Kennedy Space Center">Kennedy Space Center</a> in Merritt Island, Florida on July 16, Apollo 11 was the fifth manned mission of <a href="http://en.wikipedia.org/wiki/NASA" title="NASA">NASA</a>&#39;s Apollo program. The Apollo spacecraft had three parts:</p> <ol> <li><strong>Command Module</strong> with a cabin for the three astronauts which was the only part which landed back on Earth</li> <li><strong>Service Module</strong> which supported the Command Module with propulsion, electrical power, oxygen and water</li> <li><strong>Lunar Module</strong> for landing on the Moon.</l </textarea> <script>
CKEDITOR.replace( 'editor3', { allowedContent: { 'b i ul ol big small': true, 'h1 h2 h3 p blockquote li': { styles: 'text-align' }, a: { attributes: '!href,target' }, img: { attributes: '!src,alt', styles: 'width,height', classes: 'left,right' } } } );
</script> </div>
<br>
<div> <label for="editor4"> Editor 4: </label> <div class="description"> <p> This editor is using a custom set of plugins and buttons. </p> <pre class="samples"> CKEDITOR.replace( 'editor4', { removePlugins: 'bidi,font,forms,flash,horizontalrule,iframe,justify,table,tabletools,smiley', removeButtons: 'Anchor,Underline,Strike,Subscript,Superscript,Image', format_tags: 'p;h1;h2;h3;pre;address' } ); </pre> <p> As you can see, removing plugins and buttons implies filtering. Several tags are not allowed in the editor because there's no plugin/button that is responsible for creating and editing this kind of content (for example: the image is missing because of <code>removeButtons: 'Image'</code>). The conclusion is that <abbr title="Advanced Content Filter">ACF</abbr> works "backwards" as well: <strong>modifying <abbr title="User Interface">UI</abbr> elements is changing allowed content rules</strong>. </p> </div> <textarea cols="80" id="editor4" name="editor4" rows="10"> <h1><img alt="Saturn V carrying Apollo 11" class="right" src="assets/sample.jpg"/> Apollo 11</h1> <p><b>Apollo 11</b> was the spaceflight that landed the first humans, Americans <a href="http://en.wikipedia.org/wiki/Neil_Armstrong" title="Neil Armstrong">Neil Armstrong</a> and <a href="http://en.wikipedia.org/wiki/Buzz_Aldrin" title="Buzz Aldrin">Buzz Aldrin</a>, on the Moon on July 20, 1969, at 20:18 UTC. Armstrong became the first to step onto the lunar surface 6 hours later on July 21 at 02:56 UTC.</p> <p>Armstrong spent about <s>three and a half</s> two and a half hours outside the spacecraft, Aldrin slightly less; and together they collected 47.5 pounds (21.5&nbsp;kg) of lunar material for return to Earth. A third member of the mission, <a href="http://en.wikipedia.org/wiki/Michael_Collins_(astronaut)" title="Michael Collins (astronaut)">Michael Collins</a>, piloted the <a href="http://en.wikipedia.org/wiki/Apollo_Command/Service_Module" title="Apollo Command/Service Module">command</a> spacecraft alone in lunar orbit until Armstrong and Aldrin returned to it for the trip back to Earth.</p> <h2>Broadcasting and <em>quotes</em> <a id="quotes" name="quotes"></a></h2> <p>Broadcast on live TV to a world-wide audience, Armstrong stepped onto the lunar surface and described the event as:</p> <blockquote><p>One small step for [a] man, one giant leap for mankind.</p></blockquote> <p>Apollo 11 effectively ended the <a href="http://en.wikipedia.org/wiki/Space_Race" title="Space Race">Space Race</a> and fulfilled a national goal proposed in 1961 by the late U.S. President <a href="http://en.wikipedia.org/wiki/John_F._Kennedy" title="John F. Kennedy">John F. Kennedy</a> in a speech before the United States Congress:</p> <blockquote><p>[...] before this decade is out, of landing a man on the Moon and returning him safely to the Earth.</p></blockquote> <h2>Technical details <a id="tech-details" name="tech-details"></a></h2> <table align="right" border="1" bordercolor="#ccc" cellpadding="5" cellspacing="0" style="border-collapse:collapse;margin:10px 0 10px 15px;"> <caption><strong>Mission crew</strong></caption> <thead> <tr> <th scope="col">Position</th> <th scope="col">Astronaut</th> </tr> </thead> <tbody> <tr> <td>Commander</td> <td>Neil A. Armstrong</td> </tr> <tr> <td>Command Module Pilot</td> <td>Michael Collins</td> </tr> <tr> <td>Lunar Module Pilot</td> <td>Edwin &quot;Buzz&quot; E. Aldrin, Jr.</td> </tr> </tbody> </table> <p>Launched by a <strong>Saturn V</strong> rocket from <a href="http://en.wikipedia.org/wiki/Kennedy_Space_Center" title="Kennedy Space Center">Kennedy Space Center</a> in Merritt Island, Florida on July 16, Apollo 11 was the fifth manned mission of <a href="http://en.wikipedia.org/wiki/NASA" title="NASA">NASA</a>&#39;s Apollo program. The Apollo spacecraft had three parts:</p> <ol> <li><strong>Command Module</strong> with a cabin for the three astronauts which was the only part which landed back on Earth</li> <li><strong>Service Module</strong> which supported the Command Module with propulsion, electrical power, oxygen and water</li> <li><strong>Lunar Module</strong> for landing on the Moon.</l </textarea> <script>
CKEDITOR.replace( 'editor4', { removePlugins: 'bidi,div,font,forms,flash,horizontalrule,iframe,justify,table,tabletools,smiley', removeButtons: 'Anchor,Underline,Strike,Subscript,Superscript,Image', format_tags: 'p;h1;h2;h3;pre;address' } );
</script> </div>
<br>
<div> <label for="editor5"> Editor 5: </label> <div class="description"> <p> This editor is built on editable <code><h1></code> element. <abbr title="Advanced Content Filter">ACF</abbr> takes care of what can be included in <code><h1></code>. Note that there are no block styles in Styles combo. Also why lists, indentation, blockquote, div, form and other buttons are missing. </p> <p> <abbr title="Advanced Content Filter">ACF</abbr> makes sure that no disallowed tags will come to <code><h1></code> so the final markup is valid. If the user tried to paste some invalid HTML into this editor (let's say a list), it would be automatically converted into plain text. </p> </div> <h1 id="editor5" contenteditable="true"> <em>Apollo 11</em> was the spaceflight that landed the first humans, Americans <a href="http://en.wikipedia.org/wiki/Neil_Armstrong" title="Neil Armstrong">Neil Armstrong</a> and <a href="http://en.wikipedia.org/wiki/Buzz_Aldrin" title="Buzz Aldrin">Buzz Aldrin</a>, on the Moon on July 20, 1969, at 20:18 UTC. </h1> </div>
<div id="footer"> <hr> <p> CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a> </p> <p id="copy"> Copyright © 2003-2014, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico Knabben. All rights reserved. </p> </div> </body> </html>
|