diff --git a/changelog/unreleased/enhancement-collabora-insert-remote-file.md b/changelog/unreleased/enhancement-collabora-insert-remote-file.md
new file mode 100644
index 00000000000..00c85941cef
--- /dev/null
+++ b/changelog/unreleased/enhancement-collabora-insert-remote-file.md
@@ -0,0 +1,12 @@
+Enhancement: Handle Collabora insert remote file and image postMessages
+
+Handle UI_InsertGraphic and UI_InsertFile postMessages from Collabora Online,
+enabling remote image insertion, multimedia insertion, and document comparison
+features. Opens a file picker modal, resolves the selected file to a download
+URL, and sends the result back to Collabora. Also adds the Host_PostmessageReady
+handshake required by Collabora before it accepts Action postMessages.
+
+Requires Collabora Online >= 24.04.10 for multimedia insertion, >= 25.04.9.1
+for document comparison. Companion server-side PR: owncloud/ocis#12192.
+
+https://github.com/owncloud/web/pull/13658
diff --git a/packages/web-app-external/src/App.vue b/packages/web-app-external/src/App.vue
index 97402a17c4d..15eb3f626ee 100644
--- a/packages/web-app-external/src/App.vue
+++ b/packages/web-app-external/src/App.vue
@@ -1,6 +1,7 @@
 <template>
   <iframe
     v-if="appUrl && method === 'GET'"
+    ref="appIframeRef"
     :src="appUrl"
     class="oc-width-1-1 oc-height-1-1"
     :title="iFrameTitle"
@@ -15,6 +16,7 @@
       </div>
     </form>
     <iframe
+      ref="appIframeRef"
       name="app-iframe"
       :src="appUrl"
       class="oc-width-1-1 oc-height-1-1"
@@ -27,7 +29,18 @@
 
 <script lang="ts" setup>
 import { stringify } from 'qs'
-import { computed, inject, unref, nextTick, ref, watch, VNodeRef, onMounted, type Ref } from 'vue'
+import {
+  computed,
+  inject,
+  unref,
+  nextTick,
+  ref,
+  watch,
+  VNodeRef,
+  onMounted,
+  onBeforeUnmount,
+  type Ref
+} from 'vue'
 import { useTask } from 'vue-concurrency'
 import { useGettext } from 'vue3-gettext'
 
@@ -38,12 +51,15 @@ import {
   useCapabilityStore,
   useConfigStore,
   useMessages,
+  useModals,
   useRequest,
   useAppProviderService,
   useRoute,
+  useFolderLink,
   queryItemAsString,
   useRouteQuery
 } from '@ownclouders/web-pkg'
+import InsertRemoteFileModal from './components/InsertRemoteFileModal.vue'
 import {
   isProjectSpaceResource,
   isPublicSpaceResource,
@@ -72,6 +88,8 @@ const configStore = useConfigStore()
 const route = useRoute()
 const appProviderService = useAppProviderService()
 const { makeRequest } = useRequest()
+const { dispatchModal } = useModals()
+const { getParentFolderLink } = useFolderLink()
 
 const viewModeQuery = useRouteQuery('view_mode')
 const isMobileWidth =
@@ -97,6 +115,7 @@ const appUrl = ref()
 const formParameters = ref({})
 const method = ref()
 const subm: VNodeRef = ref()
+const appIframeRef = ref<HTMLIFrameElement>()
 
 const iFrameTitle = computed(() => {
   return $gettext('"%{appName}" app content area', {
@@ -179,20 +198,101 @@ const determineOpenAsPreview = (appName: string) => {
   return openAsPreview === true || (Array.isArray(openAsPreview) && openAsPreview.includes(appName))
 }
 
-// switch to write mode when edit is clicked
-const catchClickMicrosoftEdit = (event: MessageEvent) => {
+const IMAGE_MIME_TYPES = [
+  'image/png',
+  'image/jpeg',
+  'image/gif',
+  'image/svg+xml',
+  'image/bmp',
+  'image/webp'
+]
+
+const postMessageToApp = (messageId: string, values?: Record<string, unknown>) => {
+  const iframe = unref(appIframeRef)
+  if (!iframe?.contentWindow) {
+    return
+  }
+  iframe.contentWindow.postMessage(JSON.stringify({ MessageId: messageId, Values: values }), '*')
+}
+
+const openInsertFileModal = ({
+  title,
+  fileTypes,
+  responseMessageId
+}: {
+  title: string
+  fileTypes?: string[]
+  responseMessageId: string
+}) => {
+  const parentFolderLink = getParentFolderLink(props.resource)
+  dispatchModal({
+    elementClass: 'insert-remote-file-modal',
+    title,
+    customComponent: InsertRemoteFileModal,
+    hideActions: true,
+    customComponentAttrs: () => ({
+      parentFolderLink,
+      fileTypes,
+      onSelect: ({ filename, url }: { filename: string; url: string }) => {
+        postMessageToApp(responseMessageId, { filename, url })
+      }
+    }),
+    focusTrapInitial: false
+  })
+}
+
+const handleAppMessage = (event: MessageEvent) => {
   try {
-    if (JSON.parse(event.data)?.MessageId === 'UI_Edit') {
-      loadAppUrl.perform('write')
+    const msg = JSON.parse(event.data)
+    if (!msg?.MessageId) {
+      return
+    }
+
+    switch (msg.MessageId) {
+      // Collabora requires this handshake before it accepts any Action_* messages.
+      // Without it, all postMessages are rejected with "PostMessage ignored: not ready."
+      case 'App_LoadingStatus':
+        if (msg.Values?.Status === 'Document_Loaded') {
+          postMessageToApp('Host_PostmessageReady')
+        }
+        break
+
+      case 'UI_Edit':
+        if (determineOpenAsPreview(unref(appName))) {
+          loadAppUrl.perform('write')
+        }
+        break
+
+      case 'UI_InsertGraphic':
+        openInsertFileModal({
+          title: $gettext('Insert image'),
+          fileTypes: IMAGE_MIME_TYPES,
+          responseMessageId: 'Action_InsertGraphic'
+        })
+        break
+
+      case 'UI_InsertFile': {
+        const callback = msg.Values?.callback
+        const mimeTypeFilter = msg.Values?.mimeTypeFilter
+        openInsertFileModal({
+          title:
+            callback === 'Action_CompareDocuments'
+              ? $gettext('Compare document')
+              : $gettext('Insert multimedia'),
+          fileTypes: mimeTypeFilter,
+          responseMessageId: callback
+        })
+        break
+      }
     }
   } catch {}
 }
+
 onMounted(() => {
-  if (determineOpenAsPreview(unref(appName))) {
-    window.addEventListener('message', catchClickMicrosoftEdit)
-  } else {
-    window.removeEventListener('message', catchClickMicrosoftEdit)
-  }
+  window.addEventListener('message', handleAppMessage)
+})
+onBeforeUnmount(() => {
+  window.removeEventListener('message', handleAppMessage)
 })
 
 watch(
diff --git a/packages/web-app-external/src/components/InsertRemoteFileModal.vue b/packages/web-app-external/src/components/InsertRemoteFileModal.vue
new file mode 100644
index 00000000000..2a5b1ff6cd2
--- /dev/null
+++ b/packages/web-app-external/src/components/InsertRemoteFileModal.vue
@@ -0,0 +1,141 @@
+<template>
+  <div class="oc-height-1-1" tabindex="0">
+    <app-loading-spinner v-if="isLoading" />
+    <iframe
+      v-show="!isLoading"
+      ref="iframeRef"
+      class="oc-width-1-1 oc-height-1-1"
+      :title="iframeTitle"
+      :src="iframeSrc"
+      tabindex="0"
+      @load="onLoad"
+    ></iframe>
+  </div>
+</template>
+
+<!--
+  File picker modal for Collabora's remote insert features (UI_InsertGraphic / UI_InsertFile).
+  Opens the oCIS file browser in embed mode, resolves the picked file to a download URL
+  (with URL signing if available), and calls onSelect with { filename, url }.
+  The caller sends the result back to the Collabora iframe as an Action_* postMessage.
+-->
+<script lang="ts" setup>
+import { onBeforeUnmount, onMounted, ref, unref } from 'vue'
+import {
+  Modal,
+  useClientService,
+  useGetMatchingSpace,
+  useMessages,
+  useModals,
+  useRouter,
+  useThemeStore,
+  useCapabilityStore,
+  useUserStore,
+  embedModeFilePickMessageData
+} from '@ownclouders/web-pkg'
+import { RouteLocationRaw } from 'vue-router'
+import { AppLoadingSpinner } from '@ownclouders/web-pkg'
+import { useGettext } from 'vue3-gettext'
+
+interface Props {
+  modal: Modal
+  parentFolderLink: RouteLocationRaw
+  fileTypes?: string[]
+  onSelect: (result: { filename: string; url: string }) => void
+}
+const { modal, parentFolderLink, fileTypes, onSelect } = defineProps<Props>()
+const iframeRef = ref<HTMLIFrameElement>()
+const isLoading = ref(true)
+const router = useRouter()
+const themeStore = useThemeStore()
+const clientService = useClientService()
+const capabilityStore = useCapabilityStore()
+const userStore = useUserStore()
+const { removeModal } = useModals()
+const { showErrorMessage } = useMessages()
+const { getMatchingSpace } = useGetMatchingSpace()
+const { $gettext } = useGettext()
+
+const parentFolderRoute = router.resolve(parentFolderLink)
+const iframeTitle = themeStore.currentTheme.common?.name
+const iframeUrl = new URL(parentFolderRoute.href, window.location.origin)
+iframeUrl.searchParams.append('hide-logo', 'true')
+iframeUrl.searchParams.append('embed', 'true')
+iframeUrl.searchParams.append('embed-target', 'file')
+iframeUrl.searchParams.append('embed-delegate-authentication', 'false')
+if (fileTypes?.length) {
+  iframeUrl.searchParams.append('embed-file-types', fileTypes.join(','))
+}
+
+const iframeSrc = iframeUrl.href
+
+const onLoad = () => {
+  isLoading.value = false
+  unref(iframeRef).contentWindow.focus()
+}
+
+const onFilePick = async ({ data }: MessageEvent) => {
+  if (data.name !== 'owncloud-embed:file-pick') {
+    return
+  }
+
+  const { resource }: embedModeFilePickMessageData = data.data
+  const space = getMatchingSpace(resource)
+
+  try {
+    // Resolve to a signed WebDAV URL so the Collabora server can download the file
+    const url = await clientService.webdav.getFileUrl(space, resource, {
+      isUrlSigningEnabled: capabilityStore.supportUrlSigning,
+      username: userStore.user?.onPremisesSamAccountName
+    })
+    onSelect({ filename: resource.name, url })
+  } catch (e) {
+    console.error('Failed to resolve download URL for remote file insert', e)
+    showErrorMessage({
+      title: $gettext('Failed to get file URL'),
+      errors: [e]
+    })
+  }
+
+  removeModal(modal.id)
+}
+
+const onCancel = ({ data }: MessageEvent) => {
+  if (data.name !== 'owncloud-embed:cancel') {
+    return
+  }
+
+  removeModal(modal.id)
+}
+
+onMounted(() => {
+  window.addEventListener('message', onFilePick)
+  window.addEventListener('message', onCancel)
+})
+
+onBeforeUnmount(() => {
+  window.removeEventListener('message', onFilePick)
+  window.removeEventListener('message', onCancel)
+})
+</script>
+
+<style lang="scss">
+.oc-modal.insert-remote-file-modal {
+  max-width: 80dvw;
+  border: none;
+  overflow: hidden;
+
+  .oc-modal-title {
+    display: none;
+  }
+
+  .oc-modal-body {
+    padding: 0;
+
+    &-message {
+      height: 60dvh;
+      margin: 0;
+    }
+  }
+}
+</style>