# MinimapConfig

interface

The configuration of the [`Minimap`](module_minimap_minimap-Minimap.md) feature.

```typescript
ClassicEditor
	.create( {
		minimap: ... // Minimap feature config.
	} )
	.then( ... )
	.catch( ... );
```

See [all editor options](module_core_editor_editorconfig-EditorConfig.md).

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-minimap/src/minimapconfig.ts#L24)

<a id="properties">

## Properties

<a id="member-container">

### `container: HTMLElement`

The DOM element container for the minimap.

**Note**: The container must have a fixed `width` and `overflow: hidden` for the minimap to work correctly.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-minimap/src/minimapconfig.ts#L31)

<a id="member-extraClasses">

### `extraClasses?: string`

Extra CSS class (or classes) that will be set internally on the `<body>` element of the `<iframe>` enclosing the minimap.

By default, the minimap feature will attempt to clone all website styles and re-apply them in the `<iframe>` for the best accuracy. However, this may not work if the content of your editor inherits the styles from parent containers, resulting in inconsistent look and imprecise scrolling of the minimap.

This optional configuration can address these issues by ensuring the same CSS rules apply to the content of the minimap and the original content of the editor.

For instance, consider the following DOM structure:

```html
<div class="website">
	<!-- ... -->
	<div class="styled-container">
		 <!-- ... -->
		<div id="editor">
			<!-- content of the editor -->
		</div>
	</div>
	<!-- ... -->
</div>
```

and the following CSS styles:

```css
.website p {
	font-size: 13px;
}

.styled-container p {
	color: #ccc;
}
```

To maintain the consistency of styling (`font-size` and `color` of paragraphs), you will need to pass the CSS class names of these containers:

```typescript
ClassicEditor
	.create( {
		attachTo: document.getElementById( 'editor' ),
		minimap: {
			extraClasses: 'website styled-container'
		}
	} )
	.then( ... )
	.catch( ... );
```

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-minimap/src/minimapconfig.ts#L90)

<a id="member-useSimplePreview">

### `useSimplePreview?: boolean`

When set to `true`, the minimap will render content as simple boxes instead of replicating the look of the content (default).

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-minimap/src/minimapconfig.ts#L36)

---

Full index of the CKEditor 5 API reference: [llms.txt](llms.txt)
