---
title: "Integration & Configuration"
manual: "RTE CKEditor Image"
version: "main"
permalink: "https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:integration@main"
source: "Integration/Index.rst"
rendered: "2026-10-01T01:27:51+00:00"
---

# Integration & Configuration {#integration}

Complete configuration reference and integration guide for the RTE CKEditor Image extension.

<!-- TODO: no Markdown rendering for "versionchanged" -->

Added quality multipliers, noScale mode, SVG support, and new service architecture.
See Quality Multipliers for quality settings.

> [!IMPORTANT]
> **Installation Requirements**
>
> After installing the extension:
>
> ```bash
> composer require netresearch/rte-ckeditor-image
> ```
>
> The extension automatically:
>
> -   ✅ Registers `rteWithImages` preset for backend RTE
> -   ✅ Configures toolbar with `insertimage` button
>
> **For frontend rendering**, you must include the TypoScript:
>
> -   **Static Template**: Include "CKEditor Image Support" in your template
> -   **Or direct import**: `@import 'EXT:rte_ckeditor_image/Configuration/TypoScript/ImageRendering/setup.typoscript'`
>
> See [Frontend Rendering](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:integration-configuration-frontend-rendering@main) for details.

## Configuration Quick Reference {#configuration-quick-reference}

### For Custom RTE Presets {#for-custom-rte-presets}

These examples show how to create **custom configurations** that override the automatic defaults.
If you just installed the extension and it's working, you don't need these.

#### Minimum Custom Toolbar {#minimum-custom-toolbar}

```yaml
# Only needed if customizing the default toolbar
editor:
  config:
    toolbar:
      items:
        - insertimage
```

#### Custom Toolbar with Specific Buttons {#custom-toolbar-with-specific-buttons}

```yaml
# Example: Custom preset with limited toolbar
editor:
  config:
    toolbar:
      items:
        - bold
        - italic
        - insertimage
```

#### Full-Featured Custom Setup {#full-featured-custom-setup}

See [Full-Featured Setup](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:integration-configuration-complete-example@main)

## Configuration Patterns {#configuration-patterns}

### By Use Case {#by-use-case}

-   **Basic editor** → [Minimal Setup](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:integration-configuration-minimal@main)
-   **Style-aware images** → [Adding Image Styles](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:integration-configuration-custom-styles@main)
-   **Responsive images** → [Integration & Configuration](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:integration@main)
-   **Restricted access** → [File Mounts](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:integration-configuration-permissions@main)

### By Component {#by-component}

-   **CKEditor plugin** → [Integration & Configuration](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:integration@main)
-   **File browser** → [Integration & Configuration](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:integration@main)
-   **Frontend rendering** → [Frontend Rendering](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:integration-configuration-frontend-rendering@main)
-   **Image processing** → [Image Processing Configuration](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:integration-configuration-image-processing@main)

## Configuration Topics {#configuration-topics}

**🛠️ RTE Setup**

RTE configuration, presets, and toolbar setup

[Read more](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:integration-configuration-rte-setup@main)

**⚙️ TSConfig**

Page TSConfig settings, permissions, and file mounts

[Read more](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:integration-configuration-tsconfig@main)

**🖼️ Frontend Rendering**

TypoScript configuration and frontend rendering setup

[Read more](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:integration-configuration-frontend-rendering@main)

**🔧 Advanced Configuration**

Custom styles, performance optimization, and best practices

[Read more](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:integration-configuration-advanced@main)

**🛡️ Security**

Security features, file validation, and XSS protection

[Read more](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:integration-security@main)

## Related Documentation {#related-documentation}

**📚 Examples**

Practical configuration examples and common use cases

[Read more](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:examples-common-use-cases@main)

**🔌 API Documentation**

Backend integration and PHP APIs

[Read more](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:api-documentation@main)

**⚙️ CKEditor Plugin**

Frontend plugin development guide

[Read more](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:ckeditor-plugin-development@main)

**🐛 Troubleshooting**

Configuration issues and debugging

[Read more](https://docs.typo3.org/permalink/netresearch/rte-ckeditor-image:troubleshooting-index@main)