---
title: Read-only Mode
description: Set Jodit editor to read-only state to prevent content editing.
keywords: readonly mode, read only, jodit readonly
---

# Set read-only mode

Puts or restores the editor into readonly state.
When editor in read-only, the user is not able to change the editor content throught wysiwyg and throught source editor, but can still use some editor functions (fullsize, print, show source code).

```html
<link type="text/css" rel="stylesheet" href="build/jodit.min.css" />
<script type="text/javascript" src="build/jodit.min.js"></script>
```

```javascript
const editor = Jodit.make('#editor', {
	readonly: true
});

editor.events.on('readonly', function (isReadOnly: boolean) {
	console.log('Current state:' + isReadOnly);
});

editor.setReadOnly(false); // this method firing the `readonly` event.
editor.setReadOnly(true);
console.log(editor.getReadOnly());

// toggle read-only
editor.setReadOnly(!editor.getReadOnly());
```

by default in `readonly` state it shows all buttons, but almost all of them are disabled. Only the `source`,`print`,`fullsize`,`about` and `dots` buttons work.
But you can set your own buttons list:

```javascript
const editor = Jodit.make('#editor', {
	readonly: true,
	activeButtonsInReadOnly: ['source', 'about'] // active only two buttons
});
```

## Result

```html
<!-- Example Start -->
<textarea id="dummy" cols="30" rows="10">
&lt;div>
&lt;img src="https://xdsoft.net/jodit/finder/files/pexels-kei-scampa-4507967.jpeg" style="width: 301px; float: right; margin-left: 15px; margin-top: 10px;">
&lt;/div>
&lt;ul>
&lt;li>Copy/Paste image&lt;/li>
&lt;li>Drag&amp;Drop &lt;/li>
&lt;li>Free for non-Commercial &lt;a href="license.html">Read more</a> &lt;/li>
&lt;li>ACE editor out of the box &lt;/li>
&lt;li>Pure TypeScript. No libraries&lt;/li>
&lt;li>Lightweight: ~63.63kB gzipped.&lt;/li>
&lt;/ul></textarea
>
<button
	type="button"
	onclick="Jodit.instances.dummy.setReadOnly(!Jodit.instances.dummy.getReadOnly())"
>
	Toggle read-only
</button>

<script>
	const editor = Jodit.make('#dummy', {
		readonly: true
	});
</script>
<!-- Example End -->
```