# Edit Modes

## Changing Editor Modes

RadEditor offers three different edit modes Design, Html and Preview:

* **Design**: In the Design mode you can edit and format the content by using the RadEditor toolbar buttons, dropdowns and dialogs.
* **Html**: HTML mode provides direct access to the content HTML . This mode is used most often by advanced users.
* **Preview**: Shows how the content will look like before updating the page.

**Design mode**:

![RadEditor screenshot showing editor-designmode.png](https://www.telerik.com/products/aspnet-ajax/documentation/assets/22f4d79b24a26ac56a5db8781431bf49/editor-designmode.png)

**Html mode**: More advanced users sometimes need to modify the HTML code of the content directly. The HTML mode provides access to the HTML markup for fine-grain control.

![Html Mode](https://www.telerik.com/products/aspnet-ajax/documentation/assets/0ad8ae9a1eeafd2d3ba25bffe10ea037/editor-htmlmode.png)

**Preview mode**: After editing your document in the editor preview, users may like to see how the page looks like before updating the page. The editor can be switched to the Preview Mode just by a single click of the preview button

![Preview Mode](https://www.telerik.com/products/aspnet-ajax/documentation/assets/6ab4602b8b65ad27213b6d96e33087bd/editor-previewmode.png)

## Using the EditModes Enumeration

You can also control the displaying of the Design, Html and Preview buttons by using the **EditModes** enumeration property.

> caption Example 1: Display only the Design and Preview modes (configure the editor inline or in the code behind):

```ASP.NET
<telerik:RadEditor RenderMode="Lightweight" runat="server" ID="RadEditor1" EditModes="Design,Preview">
</telerik:RadEditor>
```

```C#
RadEditor1.EditModes = EditModes.Design | EditModes.Preview;
```

```VB
RadEditor1.EditModes = EditModes.Design Or EditModes.Preview
```

> caption Example 2: Display the Html mode only (configure the editor inline or in the code-behind):

```ASP.NET
<telerik:RadEditor RenderMode="Lightweight" runat="server" ID="RadEditor1" EditModes="Html">
</telerik:RadEditor>
```

```C#
RadEditor1.EditModes = EditModes.Html;
```

```VB
RadEditor1.EditModes = EditModes.Html
```

> note When enabling only one mode (e.g., `EditModes="Design"`) the bottom docking zone ([Docking Zones](https://www.telerik.com/products/aspnet-ajax/documentation/controls/editor/functionality/toolbars/docking-zones)) will not render.

## See Also

* [RadEditor Overview demo](https://demos.telerik.com/aspnet-ajax/editor/examples/overview/defaultcs.aspx)