> For the complete documentation index, see [llms.txt](https://docs.dikesoft.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.dikesoft.com/fundamentals/grid-structure/edition-toolbar.md).
# Edition Toolbar
Since the DikeGrid structure definition uses the CSS Grid Layout specification, as a convention, the Edition Toolbar is also known as Edition Toolbar Row.
## Edition Toolbar Row
When the DikeGrid allows editing rows, the DikeGrid enables some options to manage the edited rows.
Let us **allow edition** and bind the **edition mode** input property to the `gridProperties` object to show the Edition options.
{% code title="grid-structure.component.html" %}
```markup
```
{% endcode %}
{% hint style="info" %}
You can **allow edition** only at the creation phase of the DikeGrid.
{% endhint %}
Now, you could toggle the DikeGrid between ***view mode*** and ***edition mode***. Thus, open the [Floating Configuration Panel](/overview.md#floating-configuration-panel), go to the **Edition** section, and click on the **Edition mode** checkbox.
Once the DikeGrid is in edition mode, you can access the Edition options by default through a contextual menu at the left of the first visible column header.
However, a DikeGrid instance could display those options through a toolbar. Hence, to show the Edition Toolbar Row, provide the input flag called `editionToolbar`. Then, let us bind the related property from the `gridProperties` object to show the Edition Toolbar Row.
{% code title="grid-structure.component.html" %}
```markup
```
{% endcode %}
{% hint style="info" %}
The previous definition allows selection by providing an input flag called `allowSelection`. Thus, we can see all the edition options.
{% endhint %}
Open the [Floating Configuration Panel](/overview.md#floating-configuration-panel), and click on the **Edition Toolbar** checkbox.
You can now access all the edition options through the Edtion Toolbar shown at the ***bottom*** of the content rows.
### Edition Toolbar position
The DikeGrid could display the Edition Toolbar at the ***bottom*** of the content rows or the ***top*** of the column headers.
{% hint style="info" %}
By default, the DikeGrid shows the Edition Toolbar at the ***bottom*** of the content rows
{% endhint %}
Let us bind the related property from the `gridProperties` object to change the Edition Toolbar position.
{% code title="grid-structure.component.html" %}
```markup
```
{% endcode %}
Open the [Floating Configuration Panel](/overview.md#floating-configuration-panel), go to the **Edition** group and, select the ***top*** option.
### Edition Toolbar alignment
The Edition Toolbar could align its options at the **left**, **center**, or **right**.
{% hint style="info" %}
The default options alignment is at the ***left***.
{% endhint %}
Bind the related property from the `gridProperties` object to change the Edition Toolbar alignment.
{% code title="grid-structure.component.html" %}
```markup
```
{% endcode %}
Open the [Floating Configuration Panel](/overview.md#floating-configuration-panel), go to the **Edition** group, and change the Edition Toolbar's alignment by clicking on the ***center*** option.
## Changing the Edition Toolbar Row Height
The Edition Toolbar Row is **55 pixels** in height. However, you can change this value by providing an input property named `editionToolbarRowHeight`.
Let us bind the related property from the `gridProperties` object to change the Edition Toolbar Row height.
{% code title="grid-structure.component.html" %}
```markup
```
{% endcode %}
Open the [Floating Configuration Panel](/overview.md#floating-configuration-panel), go to the **Edition** group, and type 100 in the **Toolbar Row Height** textbox.
{% hint style="success" %}
You can also change the Edition Toolbar Row height by providing an Injection Token called `EDITION_TOOLBAR_ROW_HEIGHT`.
{% endhint %}
## Changing the Edition Toolbar Items height
Edition Toolbar Items are **42 pixels** in height. Nevertheless, you can change this height by providing an input property called `editionToolbarItemHeight`.
Let us bind the related property from the `gridProperties` object to change the Edition Toolbar Items height.
{% code title="grid-structure.component.html" %}
```markup
```
{% endcode %}
Now, open the [Floating Configuration Panel](/overview.md#floating-configuration-panel), go to the **Edition** group, and type 60 in the **Toolbar Item Height** textbox.
{% hint style="success" %}
You can also change the Edition Toolbar Items height by providing an Injection Token called `EDITION_TOOLBAR_ITEM_HEIGHT`.
{% endhint %}