What's inside this article:
- Basic information
- Open HTML Editor
- Apply code
- Manage forbidden tags
- Supported tags and transformations
Basic information
This article explains how to insert HTML code into CKEditor.
This option is available for adding content to the following content pages:
- Article | Blog | FactCheck | Feature | Feature story | Live blog | News | Transcript
This option is also available when you add content to an HTML widget.
Open HTML Editor
You can insert HTML code via HTML Editor.
To open HTML Editor, hit the Open HTML Editor button in CKEditor.
To reveal the CKEditor bar, you might need to click inside the main box via the Editor view.
Apply code
IMPORTANT: For security reasons, we enforce strict limitations on the code that can be inserted via HTML Editor. The list of supported tags is available here. Any tags not included on this list are unsupported.
To apply HTML code:
- Type or paste the code under HTML code.
- Select Apply.
After you hit Apply:
- All supported code is applied.
- Unsupported code is automatically removed or transformed. You are not notified. The content inside the code is not normally impacted.
NOTE: Any tags not included on the list of supported tags are unsupported.
If our system detects forbidden tags, you see an error message for each forbidden tag. For details, go to the following section:
Manage forbidden tags
If our system detects forbidden tags, you see an error message for each forbidden tag.
NOTE: Forbidden tags are tags that we have flagged as posing a specific security risk. You cannot proceed until all forbidden tags are removed.
The following tags are forbidden:
- <applet>, <area>, <audio>, <banner>, <canvas>, <embed>, <head>, <iframe>, <map>, <noframes>, <noscript>, <object>, <param>, <input>, <select>, <option>, <optgroup>, <progress>, <source>, <style>, <track>, <video>
The following options are available for removing forbidden tags:
- Click Clean up code to instantly remove all forbidden tags. The content inside the forbidden tags will also be removed.
- Manually adjust the code. Each error message includes numbers that indicate the location. For example, "InvalidElement at 2:1" means that line 2 includes a forbidden element, and the forbidden element is the first element on the line. Each line with forbidden code is marked with a small "v".
After all forbidden tags are removed, hit Apply to try to apply the code again.
Supported tags and transformations
Review the sections below:
Supported tags
Our system does not remove or transform supported tags. The following tags are supported:
Paragraphs and breaklines | |
|---|---|
| Tag | Function |
| <p></p> | Defines a paragraph. |
| <p class="special-container"></p> | Defines a paragraph inside a gray box. |
| <br> | Defines a breakline. Supported only within the following tags: <p></p> <td></td> |
| <div></div> | Defines a section of content for styling or formatting. In our system, <div> tags define embeds. <div> tags with the "style" or "class" attributes may be removed or transformed into <p> tags. |
Headings and subheadings | |
| Tag | Function |
| <h1></h1> <h2></h2> <h3></h3> <h4></h4> <h5></h5> <h6></h6> | Define different heading sizes, starting with <h1> (largest) to <h6> (smallest). |
Text formatting | |
| Tag | Function |
| <big></big> | Defines bigger text. |
| <code></code> | Defines typewriter text. |
| <em></em> | Defines italic text. |
| <s></s> | Defines |
| <small></small> | Defines smaller text. |
| <strong></strong> | Defines bold text. |
| <sub></sub> | Defines subscript text (such as the number 2 in H2O). |
| <sup></sup> | Defines superscript text (such as the number 2 in E=MC2). |
| <u></u> | Defines underlined text. |
Text align | |
| Tag | Function |
| <p style="text-align:center"></p> | Defines center-aligned text. |
| <p style="text-align:right"></p> | Defines right-aligned text. |
| <p style="text-align:left"></p> | Defines left-aligned text. |
| <p style="text-align:justify"></p> | Defines justified text. |
Lists | |
| Tag | Function |
| <ol></ol> | Defines an ordered (numbered) list. |
| <ul></ul> | Defines an unordered (bulleted) list. |
| <li></li> | Defines an item in any list. |
Links | |
| Tag | Function |
| <a href=""></a> | Defines a link that opens in the same tab. |
| <a href="" target="_blank"></a> | Defines a link that opens in a new tab. |
Tables | |
| Tag | Function |
| <table></table> | Defines a table. All table elements need to be inside <table></table> tags. |
| <caption></caption> | Defines the caption (or title) that is displayed below a table (to place immediately inside <table></table> tags). |
| <thead></thead> | Defines a header row in a table. |
| <tr></tr> | Defines a row in a table. |
| <th></th> | Defines a cell in the table header (cell with gray background). |
| <tbody></tbody> | Defines the body of a table. |
| <td></td> | Defines a cell in the table body (cell with white background). |
| <td colspan=""></td> | Defines a cell that covers multiple columns. |
| <td rowspan=""></td> | Defines a cell that covers multiple rows. |
Any tags not included on this list are unsupported and will be removed or transformed automatically. The content inside the tags is not normally impacted.
Transformations
In some cases, our system automatically transforms an unsupported tag into a supported tag that serves the same purpose. The content inside the tags is not normally impacted. The following tags are transformed:
| Unsupported tag | Supported tag | Function |
|---|---|---|
| <b></b> | <strong></strong> | Defines bold text. |
| <i></i> | <em></em> | Defines italic text. |
| <strike></strike> | <s></s> | Defines |
| <dir></dir> | <ul></ul> | Defines an unordered (bulleted) list. |