Accessibility links

Breaking News

Insert HTML code into CKEditor

update

What's inside this article:


Basic information

This article explains how to insert HTML code into CKEditor.

This option is available for adding content to the following content pages:

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:

  1. Type or paste the code under HTML code.
  2. 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

TagFunction
<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

TagFunction
<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

TagFunction
<big></big>Defines bigger text.
<code></code>Defines typewriter text.
<em></em>Defines italic text.
<s></s>Defines strike-through text.
<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

TagFunction
<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

TagFunction
<ol></ol>Defines an ordered (numbered) list.
<ul></ul>Defines an unordered (bulleted) list.
<li></li>Defines an item in any list.

Links

TagFunction
<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

TagFunction
<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 tagSupported tagFunction
<b></b><strong></strong>Defines bold text.
<i></i><em></em>Defines italic text.
<strike></strike><s></s>Defines strikethrough text.
<dir></dir><ul></ul>Defines an unordered (bulleted) list.


Need help?

XS
SM
MD
LG