# Ribbon

## Content



Editor provides a Ribbon-based toolbar that lets you access various word-processing commands. The Editor Ribbon comes with a flat-style user interface with tabs, groups, items, menu, etc. and it also lets you switch between full and simplified views. For instance, the following image shows the C1Editor Ribbon in a simplified view.

![](https://cdn.mescius.io/document-site-files/images/c8989ae3-804c-4f29-b5ce-fe6b13c0a9e3/images/editor-ribbon.png)

In the simplified ribbon view, some elements are shown in a single row in ribbon, while others can be accessed using the ellipsis button (![](https://cdn.mescius.io/document-site-files/images/c8989ae3-804c-4f29-b5ce-fe6b13c0a9e3/images/ellipsis.png)). However, if you want to show all the items in the ribbon, you can use the chevron button (![](https://cdn.mescius.io/document-site-files/images/c8989ae3-804c-4f29-b5ce-fe6b13c0a9e3/images/chevron.png)) to switch to full view of the ribbon as shown in the following GIF.

![](https://cdn.mescius.io/document-site-files/images/c8989ae3-804c-4f29-b5ce-fe6b13c0a9e3/images/ribbon-expand.gif)

The **Editor Ribbon** comprises of various tab groups consisting of related commands. The following table describes the tab groups available in the Editor Ribbon:

| **Tab Groups** | **Descriptions** |
| --- | --- |
| Mode | Lets you set the mode to Design or Preview. |
| Edit | Lets you perform clipboard operations like cut, copy, and paste. |
| Font | Lets you style fonts by setting their size, color, and much more. |
| Paragraph | Lets you align the paragraphs and/or use ordered or unordered lists in the document. |
| Styles | Lets you choose available style types or to Create a new Style from Formatting |
| Insert | Lets you insert table, Image or Hyperlink. |

The EditorRibbon control works when you link it with the Editor control as shown in the code below.

```csharp
c1EditorRibbon1.Editor = c1Editor1;
```

Follow the steps below to link EditorRibbon with Editor.

1.  Right-click the EditorRibbon and select **Properties.**
2.  Navigate to **Editor** property and select Editor control from the dropdown.

![EditorRibbon link to EditorControl](https://cdn.mescius.io/document-site-files/images/c8989ae3-804c-4f29-b5ce-fe6b13c0a9e3/images/ribbon-link-editor.png)