diff --git a/backend/src/Squidex/wwwroot/scripts/editor-plain.html b/backend/src/Squidex/wwwroot/scripts/editor-plain.html
index 9aa472084..c16a04cf4 100644
--- a/backend/src/Squidex/wwwroot/scripts/editor-plain.html
+++ b/backend/src/Squidex/wwwroot/scripts/editor-plain.html
@@ -7,17 +7,37 @@
 	
     <style>
         .editor {
-            border: 1px solid #eee;
+            border: 1px solid #ddd;
             border-radius: 4px;
             height: 500px;
 			width: 100%;
         }
+
+        .btn {
+			background: white;
+            border: 1px solid #ddd;
+            border-radius: 4px;
+			padding: 8px 15px;
+			margin-right: 5px;
+			margin-bottom: 5px;
+        }
     </style>
 
 </head>
 
 <body style="margin: 0px; padding: 0px;">
-	<textarea name="content" class="editor" id="editor"></textarea>
+	<div>
+		<button class="btn" id="expanded">
+			Toggle Expanded
+		</button>
+		<button class="btn" id="fullscreen">
+			Toggle Fullscreen
+		</button>
+	</div>
+
+	<div>
+		<textarea name="content" class="editor" id="editor"></textarea>
+	</div>
 
 	<script>
 		var element = document.getElementById('editor');
@@ -25,7 +45,15 @@
         // When the field is instantiated it notifies the UI that it has been loaded.
         // 
         // Furthermore it sends the current size to the parent.
-        var field = new SquidexFormField();
+		var field = new SquidexFormField();
+
+		document.getElementById('expanded').addEventListener('click', function () {
+			field.toggleExpanded();
+        });
+
+        document.getElementById('fullscreen').addEventListener('click', function () {
+            field.toggleFullscreen();
+        });
 		
 		field.onValueChanged(function (value) {
 			if (value) {
diff --git a/backend/src/Squidex/wwwroot/scripts/editor-sdk.js b/backend/src/Squidex/wwwroot/scripts/editor-sdk.js
index b62e4a3c9..cbf082c45 100644
--- a/backend/src/Squidex/wwwroot/scripts/editor-sdk.js
+++ b/backend/src/Squidex/wwwroot/scripts/editor-sdk.js
@@ -144,24 +144,26 @@ function SquidexPlugin() {
 }
 
 function SquidexFormField() {
-    var initHandler;
-    var initCalled = false;
-    var disabledHandler;
+    var context;
+    var currentConfirm;
+    var currentPickAssets;
     var disabled = false;
-    var fullscreen = false;
-    var fullscreenHandler = false;
-    var movedHandler;
-    var valueHandler;
-    var value;
-    var languageHandler;
-    var language;
-    var formValueHandler;
+    var disabledHandler;
     var formValue;
+    var formValueHandler;
+    var fullscreen = false;
+    var fullscreenHandler
+    var expanded = false;
+    var expandedHandler;
     var index;
-    var currentConfirm;
-    var currentPickAssets;
-    var context;
+    var initCalled = false;
+    var initHandler;
+    var language;
+    var languageHandler;
+    var movedHandler;
     var timer;
+    var value;
+    var valueHandler;
 
     function raiseDisabled() {
         if (disabledHandler) {
@@ -169,6 +171,12 @@ function SquidexFormField() {
         }
     }
 
+    function raiseExpanded() {
+        if (expandedHandler) {
+            expandedHandler(expanded);
+        }
+    }
+
     function raiseFullscreen() {
         if (fullscreenHandler) {
             fullscreenHandler(fullscreen);
@@ -246,6 +254,10 @@ function SquidexFormField() {
                 fullscreen = event.data.fullscreen;
 
                 raiseFullscreen();
+            } else if (type === 'expandedChanged') {
+                expanded = event.data.expanded;
+
+                raiseExpanded();
             } else if (type === 'init') {
                 context = event.data.context;
 
@@ -324,6 +336,13 @@ function SquidexFormField() {
             return fullscreen;
         },
 
+        /**
+         * Get the expanded state.
+         */
+        isExpanded: function () {
+            return expanded;
+        },
+
         /**
          * Notifies the control container that the editor has been touched.
          */
@@ -353,6 +372,15 @@ function SquidexFormField() {
             }
         },
 
+        /**
+         * Notifies the parent to go to expanded mode.
+         */
+        toggleExpanded: function () {
+            if (window.parent) {
+                window.parent.postMessage({ type: 'expanded', mode: !expanded }, '*');
+            }
+        },
+
         /**
          * Notifies the control container that the value has been changed.
          *
@@ -539,6 +567,21 @@ function SquidexFormField() {
             raiseFullscreen();
         },
 
+        /**
+         * Register an function that is called whenever the expanded mode has changed.
+         *
+         * @param {Function} callback: The callback to invoke. Argument 1: Expanded state (boolean, expanded on = true, expanded off = false).
+         */
+        onExpanded: function (callback) {
+            if (!isFunction(callback)) {
+                return;
+            }
+
+            expandedHandler = callback;
+
+            raiseExpanded();
+        },
+
         /**
          * Clean the editor SDK.
          */
diff --git a/frontend/src/app/features/content/shared/forms/field-editor.component.html b/frontend/src/app/features/content/shared/forms/field-editor.component.html
index 00f9b98f8..c16d3059c 100644
--- a/frontend/src/app/features/content/shared/forms/field-editor.component.html
+++ b/frontend/src/app/features/content/shared/forms/field-editor.component.html
@@ -1,7 +1,7 @@
-<div class="field" [class.fullscreen]="isFullscreen" *ngIf="formModel">
+<div class="field" [class.expanded]="isExpanded" *ngIf="formModel">
     <div class="buttons-container" *ngIf="canUnset">
         <div class="buttons">
-            <button type="button" class="btn btn-sm btn-outline-secondary force" (click)="toggleFullscreen()">
+            <button type="button" class="btn btn-sm btn-outline-secondary force" (click)="toggleExpanded()">
                 <i class="icon-fullscreen"></i>
             </button>
     
@@ -28,6 +28,8 @@
 		<ng-container *ngIf="field.properties.editorUrl; else noEditor">
             <sqx-iframe-editor [url]="field.properties.editorUrl" #editor
                 [context]="formContext"
+                [expanded]="isExpanded"
+                (expandedChange)="toggleExpanded()"
                 [formControlBinding]="$any(fieldForm)"
                 [formValue]="form.valueChanges | async"
                 [formIndex]="index"
diff --git a/frontend/src/app/features/content/shared/forms/field-editor.component.scss b/frontend/src/app/features/content/shared/forms/field-editor.component.scss
index 26aaa1de2..c31e05121 100644
--- a/frontend/src/app/features/content/shared/forms/field-editor.component.scss
+++ b/frontend/src/app/features/content/shared/forms/field-editor.component.scss
@@ -12,7 +12,7 @@
         font-weight: normal;
     }
 
-    &.fullscreen {
+    &.expanded {
         @include absolute(0, 0, 0, 0);
         background-color: $color-white;
         border: 0;
diff --git a/frontend/src/app/features/content/shared/forms/field-editor.component.ts b/frontend/src/app/features/content/shared/forms/field-editor.component.ts
index 40659c6bd..67b59a6d7 100644
--- a/frontend/src/app/features/content/shared/forms/field-editor.component.ts
+++ b/frontend/src/app/features/content/shared/forms/field-editor.component.ts
@@ -5,7 +5,7 @@
  * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved.
  */
 
-import { Component, ElementRef, Input, OnChanges, SimpleChanges, ViewChild } from '@angular/core';
+import { Component, ElementRef, EventEmitter, Input, OnChanges, Output, SimpleChanges, ViewChild } from '@angular/core';
 import { AbstractControl } from '@angular/forms';
 import { Observable } from 'rxjs';
 import { AbstractContentForm, AppLanguageDto, EditContentForm, FieldDto, hasNoValue$, MathHelper, Types } from '@app/shared';
@@ -18,6 +18,9 @@ import { AbstractContentForm, AppLanguageDto, EditContentForm, FieldDto, hasNoVa
 export class FieldEditorComponent implements OnChanges {
     public readonly uniqueId = MathHelper.guid();
 
+    @Output()
+    public expandedChange = new EventEmitter();
+
     @Input()
     public form!: EditContentForm;
 
@@ -49,7 +52,7 @@ export class FieldEditorComponent implements OnChanges {
     public editor!: ElementRef;
 
     public isEmpty?: Observable<boolean>;
-    public isFullscreen = false;
+    public isExpanded = false;
 
     public get field() {
         return this.formModel.field;
@@ -79,8 +82,8 @@ export class FieldEditorComponent implements OnChanges {
         }
     }
 
-    public toggleFullscreen() {
-        this.isFullscreen = !this.isFullscreen;
+    public toggleExpanded() {
+        this.isExpanded = !this.isExpanded;
     }
 
     public unset() {
diff --git a/frontend/src/app/features/content/shared/forms/iframe-editor.component.html b/frontend/src/app/features/content/shared/forms/iframe-editor.component.html
index 13af88fc2..ab6c6619c 100644
--- a/frontend/src/app/features/content/shared/forms/iframe-editor.component.html
+++ b/frontend/src/app/features/content/shared/forms/iframe-editor.component.html
@@ -1,5 +1,7 @@
 <div #container>
-    <iframe #iframe scrolling="no" width="100%" [style.height]="0" [attr.src]="computedUrl | sqxSafeResourceUrl"></iframe>
+    <div #inner [class.fullscreen]="snapshot.isFullscreen">
+        <iframe #iframe scrolling="no" width="100%" [style.height]="0" [attr.src]="computedUrl | sqxSafeResourceUrl"></iframe>
+    </div>
 </div>
 
 <ng-container *sqxModal="assetsDialog">
diff --git a/frontend/src/app/features/content/shared/forms/iframe-editor.component.ts b/frontend/src/app/features/content/shared/forms/iframe-editor.component.ts
index d588d52eb..32f0a408d 100644
--- a/frontend/src/app/features/content/shared/forms/iframe-editor.component.ts
+++ b/frontend/src/app/features/content/shared/forms/iframe-editor.component.ts
@@ -5,19 +5,24 @@
  * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved.
  */
 
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, HostListener, Input, OnChanges, OnDestroy, Renderer2, SimpleChanges, ViewChild } from '@angular/core';
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, HostListener, Input, OnChanges, OnDestroy, Output, Renderer2, SimpleChanges, ViewChild } from '@angular/core';
 import { AbstractControl } from '@angular/forms';
 import { Router } from '@angular/router';
 import { DialogModel, DialogService, disabled$, StatefulComponent, Types, value$ } from '@app/framework';
 import { AppsState, AssetDto, computeEditorUrl } from '@app/shared';
 
+interface State {
+    // True, when the editor is shown as fullscreen.
+    isFullscreen: boolean;
+}
+
 @Component({
     selector: 'sqx-iframe-editor[context][formField][formIndex][formValue][formControlBinding]',
     styleUrls: ['./iframe-editor.component.scss'],
     templateUrl: './iframe-editor.component.html',
     changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class IFrameEditorComponent extends StatefulComponent<{}> implements OnChanges, OnDestroy {
+export class IFrameEditorComponent extends StatefulComponent<State> implements OnChanges, OnDestroy {
     private value: any;
     private isInitialized = false;
     private isDisabled = false;
@@ -26,6 +31,18 @@ export class IFrameEditorComponent extends StatefulComponent<{}> implements OnCh
     @ViewChild('iframe', { static: false })
     public iframe!: ElementRef<HTMLIFrameElement>;
 
+    @ViewChild('container', { static: false })
+    public container!: ElementRef<HTMLElement>;
+
+    @ViewChild('inner', { static: false })
+    public inner!: ElementRef<HTMLElement>;
+
+    @Output()
+    public expandedChange = new EventEmitter();
+
+    @Input()
+    public expanded = false;
+
     @Input()
     public context: any = {};
 
@@ -64,11 +81,15 @@ export class IFrameEditorComponent extends StatefulComponent<{}> implements OnCh
         private readonly renderer: Renderer2,
         private readonly router: Router,
     ) {
-        super(changeDetector, {});
+        super(changeDetector, {
+            isFullscreen: false,
+        });
     }
 
     public ngOnDestroy() {
         super.ngOnDestroy();
+
+        this.toggleFullscreen(false);
     }
 
     public ngOnChanges(changes: SimpleChanges) {
@@ -76,14 +97,18 @@ export class IFrameEditorComponent extends StatefulComponent<{}> implements OnCh
             this.sendFormValue();
         }
 
-        if (changes['language']) {
-            this.sendLanguage();
-        }
-
         if (changes['formIndex']) {
             this.sendMoved();
         }
 
+        if (changes['expanded']) {
+            this.sendExpanded();
+        }
+
+        if (changes['language']) {
+            this.sendLanguage();
+        }
+
         if (changes['formControlBinding']) {
             this.unsubscribeAll();
 
@@ -112,6 +137,8 @@ export class IFrameEditorComponent extends StatefulComponent<{}> implements OnCh
                 this.isInitialized = true;
 
                 this.sendInit();
+                this.sendFullscreen();
+                this.sendExpanded();
                 this.sendFormValue();
                 this.sendLanguage();
                 this.sendDisabled();
@@ -125,6 +152,18 @@ export class IFrameEditorComponent extends StatefulComponent<{}> implements OnCh
                 const { url } = event.data;
 
                 this.router.navigateByUrl(url);
+            } else if (type === 'fullscreen') {
+                const { mode } = event.data;
+
+                if (mode !== this.snapshot.isFullscreen) {
+                    this.toggleFullscreen(mode);
+                }
+            } else if (type === 'expanded') {
+                const { mode } = event.data;
+
+                if (mode !== this.expanded) {
+                    this.expandedChange.emit();
+                }
             } else if (type === 'valueChanged') {
                 const { value } = event.data;
 
@@ -206,6 +245,14 @@ export class IFrameEditorComponent extends StatefulComponent<{}> implements OnCh
         this.sendMessage('valueChanged', { value: this.value });
     }
 
+    private sendFullscreen() {
+        this.sendMessage('fullscreenChanged', { fullscreen: this.snapshot.isFullscreen });
+    }
+
+    private sendExpanded() {
+        this.sendMessage('expandedChanged', { expanded: this.expanded });
+    }
+
     private sendDisabled() {
         this.sendMessage('disabled', { isDisabled: this.isDisabled });
     }
@@ -228,6 +275,20 @@ export class IFrameEditorComponent extends StatefulComponent<{}> implements OnCh
         }
     }
 
+    private toggleFullscreen(isFullscreen: boolean) {
+        this.next({ isFullscreen });
+
+        let target = this.container.nativeElement;
+
+        if (isFullscreen) {
+            target = document.body;
+        }
+
+        this.renderer.appendChild(target, this.inner.nativeElement);
+
+        this.sendFullscreen();
+    }
+
     private sendMessage(type: string, payload: any) {
         if (!this.iframe?.nativeElement) {
             return;
