diff --git a/package.json b/package.json
index 88ea5bb..c65b358 100644
--- a/package.json
+++ b/package.json
@@ -5,12 +5,15 @@
     "license": "MIT",
     "main": "./src/tiptap.js",
     "dependencies": {
+        "@hocuspocus/provider": "^2.5.0",
         "@tiptap/core": "2.1.11",
         "@tiptap/extension-blockquote": "^2.1.11",
         "@tiptap/extension-bold": "^2.1.11",
         "@tiptap/extension-bullet-list": "^2.1.11",
         "@tiptap/extension-code": "^2.1.11",
         "@tiptap/extension-code-block": "^2.1.11",
+        "@tiptap/extension-collaboration": "^2.1.11",
+        "@tiptap/extension-collaboration-cursor": "^2.1.11",
         "@tiptap/extension-document": "^2.1.11",
         "@tiptap/extension-dropcursor": "^2.1.11",
         "@tiptap/extension-gapcursor": "^2.1.11",
@@ -33,7 +36,10 @@
         "@tiptap/extension-table-row": "^2.1.11",
         "@tiptap/extension-text": "^2.1.11",
         "@tiptap/pm": "^2.1.11",
-        "@tiptap/suggestion": "^2.1.11"
+        "@tiptap/suggestion": "^2.1.11",
+        "y-prosemirror": "^1.2.1",
+        "y-protocols": "^1.0.6",
+        "yjs": "^13.6.8"
     },
     "devDependencies": {
         "@patternslib/dev": "^3.5.1",
diff --git a/src/config.js b/src/config.js
new file mode 100644
index 0000000..144b55e
--- /dev/null
+++ b/src/config.js
@@ -0,0 +1,61 @@
+import ExtBlockquote from "@tiptap/extension-blockquote";
+import ExtBold from "@tiptap/extension-bold";
+import ExtBulletList from "@tiptap/extension-bullet-list";
+import ExtCode from "@tiptap/extension-code";
+import ExtCodeBlock from "@tiptap/extension-code-block";
+import ExtDocument from "@tiptap/extension-document";
+import ExtEmbed from "./extensions/embed";
+import ExtFigcaption from "./extensions/figcaption";
+import ExtFigure from "./extensions/figure";
+import ExtHardBreak from "@tiptap/extension-hard-break";
+import ExtHeading from "./extensions/heading";
+import ExtHorizontalRule from "@tiptap/extension-horizontal-rule";
+import ExtImageFigure from "./extensions/image-figure";
+import ExtImageInline from "./extensions/image-inline";
+import ExtItalic from "@tiptap/extension-italic";
+import ExtLink from "./extensions/link";
+import ExtListItem from "@tiptap/extension-list-item";
+import ExtOrderedList from "@tiptap/extension-ordered-list";
+import ExtParagraph from "@tiptap/extension-paragraph";
+import ExtStrike from "@tiptap/extension-strike";
+import ExtTable from "@tiptap/extension-table";
+import ExtTableCell from "@tiptap/extension-table-cell";
+import ExtTableHeader from "@tiptap/extension-table-header";
+import ExtTableRow from "@tiptap/extension-table-row";
+import ExtText from "@tiptap/extension-text";
+
+// source extension?
+
+export const modes = {
+    "text/html": [
+        ExtBlockquote,
+        ExtBold,
+        ExtBulletList,
+        ExtCode,
+        ExtCodeBlock,
+        ExtDocument,
+        ExtEmbed,
+        ExtFigcaption,
+        ExtFigure,
+        ExtHardBreak,
+        ExtHeading,
+        ExtHorizontalRule,
+        ExtImageFigure,
+        ExtImageInline,
+        ExtItalic,
+        ExtLink,
+        ExtListItem,
+        ExtOrderedList,
+        ExtParagraph,
+        ExtStrike,
+        ExtTable,
+        ExtTableCell,
+        ExtTableHeader,
+        ExtTableRow,
+        ExtText,
+    ],
+    "text/plain": [ExtDocument],
+    "text/markdown": [ExtDocument],
+};
+
+export default { modes };
diff --git a/src/extensions/embed.js b/src/extensions/embed.js
index 3a12560..3b24295 100644
--- a/src/extensions/embed.js
+++ b/src/extensions/embed.js
@@ -264,7 +264,7 @@ export const factory = () => {
         parseHTML() {
             return [
                 {
-                    tag: `iframe[src*="youtube.com"]`,
+                    tag: `iframe[src*="youtube.com"]`, // needs vimeo too??
                     getAttrs: (node) =>
                         (is_youtube(node.getAttribute("src")) ||
                             is_vimeo(node.getAttribute("src")) > -1) &&
diff --git a/src/index.html b/src/index.html
index 1a66318..4d1ecca 100644
--- a/src/index.html
+++ b/src/index.html
@@ -138,6 +138,11 @@ <h2>TipTap basic example</h2>
 
       </div>
 
+      <!--
+      NOTE: The following `collaboration-authentication-token` is a JWT token
+      that is a `{"user": "admin"}` object encoded with the secret
+      `supersecret`.
+      -->
       <textarea
           class="pat-tiptap pat-autofocus"
           data-pat-tiptap="
@@ -151,6 +156,9 @@ <h2>TipTap basic example</h2>
             link-menu: #context-menu-link;
             mentions-menu: ./index-mentions-results.html?u=;
             tags-menu: ./index-tags-results.html?okay=1234&q=;
+            collaboration-server: ws://127.0.0.1:1234;
+            collaboration-document: example-document;
+            collaboration-authentication-token: eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VyIjoiYWRtaW4ifQ.TFEeScRRa2dBzHLf_6cCkeouJkB8vsrRKaqvBzGMnVA;
           "
           placeholder="Your poem goes here..."
           autocomplete="off"
diff --git a/src/styles/collaboration-cursor.css b/src/styles/collaboration-cursor.css
new file mode 100644
index 0000000..759cff9
--- /dev/null
+++ b/src/styles/collaboration-cursor.css
@@ -0,0 +1,26 @@
+/* Give a remote user a caret */
+.collaboration-cursor__caret {
+    border-left: 1px solid #0d0d0d;
+    border-right: 1px solid #0d0d0d;
+    margin-left: -1px;
+    margin-right: -1px;
+    pointer-events: none;
+    position: relative;
+    word-break: normal;
+}
+
+/* Render the username above the caret */
+.collaboration-cursor__label {
+    border-radius: 3px 3px 3px 0;
+    color: #0d0d0d;
+    font-size: 12px;
+    font-style: normal;
+    font-weight: 600;
+    left: -1px;
+    line-height: normal;
+    padding: 0.1rem 0.3rem;
+    position: absolute;
+    top: -1.4em;
+    user-select: none;
+    white-space: nowrap;
+}
diff --git a/src/tiptap.js b/src/tiptap.js
index 69cd0a7..3f8d4d0 100644
--- a/src/tiptap.js
+++ b/src/tiptap.js
@@ -9,8 +9,6 @@ import utils from "@patternslib/patternslib/src/core/utils";
 export const log = logging.getLogger("tiptap");
 
 export const parser = new Parser("tiptap");
-parser.addArgument("collaboration-server", null);
-parser.addArgument("collaboration-document", null);
 
 parser.addArgument("toolbar-external", null);
 
@@ -25,12 +23,20 @@ parser.addArgument("link-menu", null);
 parser.addArgument("mentions-menu", null);
 parser.addArgument("tags-menu", null);
 
+parser.addArgument("collaboration-server", null);
+parser.addArgument("collaboration-document", null);
+parser.addArgument("collaboration-user", null);
+parser.addArgument("collaboration-color", null);
+parser.addArgument("collaboration-authentication-token", null);
+
 // TODO: Remove with next major version.
 // BBB - Compatibility aliases
 parser.addAlias("context-menu-link", "link-menu");
 parser.addAlias("context-menu-mentions", "mentions-menu");
 parser.addAlias("context-menu-tags", "tags-menu");
 
+let collaboration_states = [];
+
 class Pattern extends BasePattern {
     static name = "tiptap";
     static trigger = ".pat-tiptap";
@@ -85,8 +91,6 @@ class Pattern extends BasePattern {
             (await import("@tiptap/extension-hard-break")).default.configure(),
             // Gapcursor for images, tables etc to be able to add content below/above.
             (await import("@tiptap/extension-gapcursor")).Gapcursor.configure(),
-            // Allways include undo/redo support via keyboard shortcuts.
-            (await import("@tiptap/extension-history")).History.configure(),
         ];
         const placeholder = this.el.getAttribute("placeholder");
         if (placeholder) {
@@ -129,6 +133,117 @@ class Pattern extends BasePattern {
             );
         }
 
+        const config = {};
+        if (this.options.collaboration.server && this.options.collaboration.document) {
+            // Random color, see: https://css-tricks.com/snippets/javascript/random-hex-color/
+            const random_color = "#" + ((Math.random() * 0xffffff) << 0).toString(16);
+            // Information about the current user
+            const user_name = this.options.collaboration.user || random_color;
+            const user_color = this.options.collaboration.color || random_color;
+
+            // Set up the Hocuspocus WebSocket provider
+            const HocuspocusProvider = (await import("@hocuspocus/provider")).HocuspocusProvider; // prettier-ignore
+            const YDoc = (await import("yjs")).Doc;
+            const y_doc = new YDoc();
+            const provider = new HocuspocusProvider({
+                url: this.options.collaboration.server,
+                name: this.options.collaboration.document,
+                document: y_doc,
+                token: this.options.collaboration["authentication-token"],
+            });
+
+            provider.on("awarenessUpdate", (state) => {
+                console.log(`awarenessUpdate`, state);
+            });
+
+            provider.on("awarenessChange", (states) => {
+                console.log(`awarenessChange`, states);
+                collaboration_states = states;
+            });
+
+            provider.setAwarenessField("user", {
+                name: user_name,
+                color: user_color,
+                document_name: this.options.collaboration.document,
+            });
+
+            // Wait for user being authenticated
+            const authenticated = () =>
+                new Promise((resolve) =>
+                    provider.on("authenticated", resolve, { once: true })
+                );
+            await authenticated();
+
+            // Wait for user being authenticated
+            const synced = () =>
+                new Promise((resolve) => provider.on("synced", resolve, { once: true }));
+            await synced();
+
+            // Attempt 1: Only if the y_doc is the same as the document on the provider object,
+            //            which I believe should be returned from the hocuspocus server.
+            //            The problem here is, that also for the second connection with another browser
+            //            returns true for the following if clause.
+            if (y_doc === provider.document) {
+                // Initialize the tiptap editor later with some initial content.
+                console.log("aha, ahsou");
+                config["content"] = getText();
+            }
+
+            // Attempt 2: Only for the first connecting user.
+            //            The problem here is that I apparently do not reliably get the number of connected users.
+            //            With two browsers connecting, one time I get 0 users, one time 1 user, another time 2.
+            const connected_users = [...provider.awareness.states.values()].map(
+                (it) => it.user
+            );
+            if (connected_users.length === 1) {
+                // Initialize the tiptap editor later with some initial content.
+                config["content"] = getText();
+                console.log("jojo, jo wou");
+                log.info(`
+                    This is the main instance and gets text from textfield.
+                    Other connected user will get their text from the collaboration server.
+                `);
+            }
+
+            console.log("provider");
+            console.log(provider);
+
+            console.log("collaboration states");
+            console.log(collaboration_states);
+
+            console.log("awareness states");
+            console.log(provider.awareness.states);
+
+            console.log("connected users");
+            console.log(connected_users);
+
+            // Collaboration extension
+            const Collaboration = (
+                await import("@tiptap/extension-collaboration")
+            ).default.configure({
+                document: provider.document,
+            });
+            extra_extensions.push(Collaboration);
+
+            // Collaboration cursor
+            if (window.__patternslib_import_styles) {
+                import("./styles/collaboration-cursor.css");
+            }
+            const CollaborationCursor = (
+                await import("@tiptap/extension-collaboration-cursor")
+            ).default.configure({
+                provider: provider,
+                user: {
+                    name: user_name,
+                    color: user_color,
+                },
+            });
+            extra_extensions.push(CollaborationCursor);
+        } else {
+            // Non-collaborative editing is always getting the initial text from the textarea.
+            config["content"] = getText();
+        }
+
         this.toolbar_el = this.options.toolbarExternal
             ? document.querySelector(this.options.toolbarExternal)
             : null;
@@ -153,7 +268,6 @@ class Pattern extends BasePattern {
                 ...(await toolbar_ext.init_extensions({ app: this })),
                 ...extra_extensions,
             ],
-            content: getText(),
             onUpdate() {
                 // Note: ``this`` is the editor instance.
                 setText(this.getHTML());
@@ -177,6 +291,7 @@ class Pattern extends BasePattern {
                 this.toolbar_el?.classList.remove("tiptap-focus");
             },
             autofocus: set_focus,
+            ...config,
         });
         toolbar_ext.init_post({ app: this });
 
diff --git a/src/toolbar.js b/src/toolbar.js
index 6992ab2..d35515e 100644
--- a/src/toolbar.js
+++ b/src/toolbar.js
@@ -155,6 +155,15 @@ export async function init_extensions({ app }) {
         );
     }
 
+    if (
+        !(app.options.collaboration.server && app.options.collaboration.document) &&
+        (tb.undo || tb.redo)
+    ) {
+        // Do not initialize this with the collaboration feature turned on.
+        // The collaboration extension comeswith it's own history handling.
+        extensions.push((await import("@tiptap/extension-history")).History);
+    }
+
     if (tb.link) {
         extensions.push(
             (await import("./extensions/link")).factory().configure({
diff --git a/webpack.config.js b/webpack.config.js
index b41efa6..d13b877 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -31,6 +31,7 @@ module.exports = () => {
 
     if (process.env.NODE_ENV === "development") {
         config.devServer.static.directory = __dirname;
+        config.devServer.port = "3002";
     }
 
     return config;
diff --git a/yarn.lock b/yarn.lock
index 22c23be..b66daf4 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1564,6 +1564,23 @@
     "@fullcalendar/daygrid" "~5.11.4"
     tslib "^2.1.0"
 
+"@hocuspocus/common@^2.5.0":
+  version "2.5.0"
+  resolved "https://registry.yarnpkg.com/@hocuspocus/common/-/common-2.5.0.tgz#adfbaa770d1e8eda0a811ad93b427cdf89960e3d"
+  integrity sha512-TpnQAb1Rtff1trwURFWaUEYZwqykaIGo6NNnMr6ZISdDZFWNHMAMUmy7dwJDS9ECnEtcjXhpPxXeLV+MVQXVnw==
+  dependencies:
+    lib0 "^0.2.47"
+
+"@hocuspocus/provider@^2.5.0":
+  version "2.5.0"
+  resolved "https://registry.yarnpkg.com/@hocuspocus/provider/-/provider-2.5.0.tgz#2c56184082f835c7a0c07c8962a6e5dcafebe847"
+  integrity sha512-Du/q0kcVhaSQiKPBha19f+mnFOl4sFybARRWsGp4JIoDG+Vt3r73ZqjalIJmp9h4mBr2tGtS5zK/oQ/Vrv5/Bw==
+  dependencies:
+    "@hocuspocus/common" "^2.5.0"
+    "@lifeomic/attempt" "^3.0.2"
+    lib0 "^0.2.47"
+    ws "^7.5.9"
+
 "@humanwhocodes/config-array@^0.11.11":
   version "0.11.11"
   resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.11.11.tgz#88a04c570dbbc7dd943e4712429c3df09bc32844"
@@ -1913,6 +1930,11 @@
   resolved "https://registry.yarnpkg.com/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz#b2ac626d6cb9c8718ab459166d4bb405b8ffa78b"
   integrity sha512-Hcv+nVC0kZnQ3tD9GVu5xSMR4VVYOteQIr/hwFPVEvPdlXqgGEuRjiheChHgdM+JyqdgNcmzZOX/tnl0JOiI7A==
 
+"@lifeomic/attempt@^3.0.2":
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/@lifeomic/attempt/-/attempt-3.0.3.tgz#e742a5b85eb673e2f1746b0f39cb932cbc6145bb"
+  integrity sha512-GlM2AbzrErd/TmLL3E8hAHmb5Q7VhDJp35vIbyPVA5Rz55LZuRr8pwL3qrwwkVNo05gMX1J44gURKb4MHQZo7w==
+
 "@linaria/core@3.0.0-beta.13":
   version "3.0.0-beta.13"
   resolved "https://registry.yarnpkg.com/@linaria/core/-/core-3.0.0-beta.13.tgz#049c5be5faa67e341e413a0f6b641d5d78d91056"
@@ -2375,6 +2397,16 @@
   resolved "https://registry.yarnpkg.com/@tiptap/extension-code/-/extension-code-2.1.11.tgz#c4f8fee03a8866ea189c112e907e17ea8aaa8f74"
   integrity sha512-G0UEbMFunujy/F86yHN0/dumPLbwTis9C+6IQv1XRPNsV28U0MgxBhlPcJUgyO5lwuleePDxiBVcRv2XrysgKw==
 
+"@tiptap/extension-collaboration-cursor@^2.1.11":
+  version "2.1.11"
+  resolved "https://registry.yarnpkg.com/@tiptap/extension-collaboration-cursor/-/extension-collaboration-cursor-2.1.11.tgz#ab6d8b666d48200214b5808d3f90073b5b844cd8"
+  integrity sha512-IRLqVGwQo8l715VWzyGr+RUuFfQFLB2BsSSy9w5JSekBMbFd7OZcLFXjvwQnQjGqtzPZcc3D1dPCZd/Za17fXg==
+
+"@tiptap/extension-collaboration@^2.1.11":
+  version "2.1.11"
+  resolved "https://registry.yarnpkg.com/@tiptap/extension-collaboration/-/extension-collaboration-2.1.11.tgz#2e1d31516a35b7efcf33d173c630072f91389eb2"
+  integrity sha512-f/O0XHIUqQEaQ/gwG9tlhcO7Vmt02EeCWWvuLySvR8VaGGfxl6n72WQHpRpQcxxL+IB4Kp/Al4vijfrDw6gqzA==
+
 "@tiptap/extension-document@^2.1.11":
   version "2.1.11"
   resolved "https://registry.yarnpkg.com/@tiptap/extension-document/-/extension-document-2.1.11.tgz#76782660420900acb6301a5ba69c27054139b622"
@@ -6323,6 +6355,11 @@ isobject@^3.0.1:
   resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df"
   integrity sha512-WhB9zCku7EGTj/HQQRz5aUQEUeoQZH2bWcltRErOpymJ4boYE6wL9Tbr23krRPSZ+C5zqNSrSw+Cc7sZZ4b7vg==
 
+isomorphic.js@^0.2.4:
+  version "0.2.4"
+  resolved "https://registry.yarnpkg.com/isomorphic.js/-/isomorphic.js-0.2.4.tgz#24ca374163ae54a7ce3b86ce63b701b91aa84969"
+  integrity sha512-Y4NjZceAwaPXctwsHgNsmfuPxR8lJ3f8X7QTAkhltrX4oGIv+eTlgHLXn4tWysC9zGTi929gapnPp+8F8cg7nA==
+
 issue-parser@6.0.0:
   version "6.0.0"
   resolved "https://registry.yarnpkg.com/issue-parser/-/issue-parser-6.0.0.tgz#b1edd06315d4f2044a9755daf85fdafde9b4014a"
@@ -7026,6 +7063,13 @@ levn@~0.3.0:
     prelude-ls "~1.1.2"
     type-check "~0.3.2"
 
+lib0@^0.2.42, lib0@^0.2.47, lib0@^0.2.74, lib0@^0.2.85:
+  version "0.2.86"
+  resolved "https://registry.yarnpkg.com/lib0/-/lib0-0.2.86.tgz#86ccc3366ca3b6f8b5d8713c03f2a67ed7bc5f3e"
+  integrity sha512-kxigQTM4Q7NwJkEgdqQvU21qiR37twcqqLmh+/SbiGbRLfPlLVbHyY9sWp7PwXh0Xus9ELDSjsUOwcrdt5yZ4w==
+  dependencies:
+    isomorphic.js "^0.2.4"
+
 lines-and-columns@^1.1.6:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632"
@@ -10403,7 +10447,7 @@ write-file-atomic@^4.0.2:
     imurmurhash "^0.1.4"
     signal-exit "^3.0.7"
 
-ws@^7.3.1:
+ws@^7.3.1, ws@^7.5.9:
   version "7.5.9"
   resolved "https://registry.yarnpkg.com/ws/-/ws-7.5.9.tgz#54fa7db29f4c7cec68b1ddd3a89de099942bb591"
   integrity sha512-F+P9Jil7UiSKSkppIiD94dN07AwvFixvLIj1Og1Rl9GGMuNipJnV9JzjD6XuqmAeiswGvUmNLjr5cFuXwNS77Q==
@@ -10428,6 +10472,20 @@ xmlchars@^2.2.0:
   resolved "https://registry.yarnpkg.com/xmlchars/-/xmlchars-2.2.0.tgz#060fe1bcb7f9c76fe2a17db86a9bc3ab894210cb"
   integrity sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==
 
+y-prosemirror@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/y-prosemirror/-/y-prosemirror-1.2.1.tgz#a8b5c50b8fd445e556dfa831f295765f4ca022bd"
+  integrity sha512-czMBfB1eL2awqmOSxQM8cS/fsUOGE6fjvyPLInrh4crPxFiw67wDpwIW+EGBYKRa04sYbS0ScGj7ZgvWuDrmBQ==
+  dependencies:
+    lib0 "^0.2.42"
+
+y-protocols@^1.0.6:
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/y-protocols/-/y-protocols-1.0.6.tgz#66dad8a95752623443e8e28c0e923682d2c0d495"
+  integrity sha512-vHRF2L6iT3rwj1jub/K5tYcTT/mEYDUppgNPXwp8fmLpui9f7Yeq3OEtTLVF012j39QnV+KEQpNqoN7CWU7Y9Q==
+  dependencies:
+    lib0 "^0.2.85"
+
 y18n@^4.0.0:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/y18n/-/y18n-4.0.3.tgz#b5f259c82cd6e336921efd7bfd8bf560de9eeedf"
@@ -10501,6 +10559,13 @@ yarn@^1.22.19:
   resolved "https://registry.yarnpkg.com/yarn/-/yarn-1.22.19.tgz#4ba7fc5c6e704fce2066ecbfb0b0d8976fe62447"
   integrity sha512-/0V5q0WbslqnwP91tirOvldvYISzaqhClxzyUKXYxs07yUILIs5jx/k6CFe8bvKSkds5w+eiOqta39Wk3WxdcQ==
 
+yjs@^13.6.8:
+  version "13.6.8"
+  resolved "https://registry.yarnpkg.com/yjs/-/yjs-13.6.8.tgz#0d6cebf4d7e69b08ede5ecf6368ddbd9c7603c2e"
+  integrity sha512-ZPq0hpJQb6f59B++Ngg4cKexDJTvfOgeiv0sBc4sUm8CaBWH7OQC4kcCgrqbjJ/B2+6vO49exvTmYfdlPtcjbg==
+  dependencies:
+    lib0 "^0.2.74"
+
 yn@3.1.1:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/yn/-/yn-3.1.1.tgz#1e87401a09d767c1d5eab26a6e4c185182d2eb50"