Zum Inhalt springen

Memos Embed

Open-Source-Memo-Einbettungen

Teile deine Gedanken überall

Verwandle Memos-Beiträge in ansprechende, portable Karten für Dokumentationen, Changelogs, Marketingseiten und Produktoberflächen.

Iframe-EinbettungenReact-KomponenteWeb ComponentDesign-VorlagenAutomatische Größenanpassung

3

Integrationsmodi

5

Design-Vorlagen

< 5 Min

Copy-Paste-Einrichtung

Kopiere ein funktionierendes Embed in wenigen Minuten
Starte auf der gehosteten Spielwiese, passe die Ausgabe an und teile die genaue Konfiguration mit deinem Team.
Iframe-AusschnittAuto-Resize-fähig
<iframe
  src="https://your-site.com/embed/1?theme=midnight"
  title="memos-embed"
  loading="lazy"
></iframe>

Warum Teams die Spielwiese offen lassen

  • Iframe-, Web-Component- und React-Ausgabe nebeneinander vergleichen.
  • Die vollständige Konfiguration per URL für asynchrone Reviews teilen.
  • Produktionsreife Snippets kopieren, statt Parameter von Hand zu schreiben.

Wähle die Integration, die zu deinem Stack passt

Starte einfach mit einem Iframe und steige auf eine Web Component oder einen React-Wrapper um, wenn du mehr Kontrolle brauchst.

Iframe
Dokumentationen, CMS-Seiten und Build-freie Umgebungen

Hoste die Embed-Route einmalig und füge responsives Iframe-Markup überall ein.

<iframe
  src="https://your-site.com/embed/1?..."
  title="memos-embed"
  loading="lazy"
/>
Beispiel für Iframe öffnen
Web Component
Statische Seiten, Astro, Eleventy und progressive Verbesserung

Registriere ein benutzerdefiniertes Element und halte die Integration so einfach wie HTML-Attribute.

<script type="module"
  src="https://unpkg.com/@memos-embed/wc@latest/dist/register.js"></script>
<memos-embed memo-id="1" />
Beispiel für Web Component öffnen
React
Dashboards, Produktoberflächen und App-Shells

Verwende den React-Wrapper, wenn du zustandsbehaftete Konfiguration und Callbacks brauchst.

import { MemoEmbed } from "@memos-embed/react";

<MemoEmbed
  baseUrl="https://demo.usememos.com/api/v1"
  memoId="1"
/>
Beispiel für React öffnen

Warum Teams Memos Embed wählen

Entwickelt für Produktupdates, persönliches Publishing und interne Dokumentationen, die trotzdem eine produktionsreife Präsentationsschicht brauchen.

Ansprechende Einbettungen

Gib Memo-Karten eine hochwertige Oberfläche mit Designs, Dichte-Vorlagen, gruppierten Reaktionen und Bildvorschauen.

Entwicklerfreundlich

Starte mit einem Iframe und wechsle zu einer Web Component oder einem React-Wrapper, wenn du engere Integration brauchst.

Performance zuerst

Nutze teilbare Spielwiesen-Vorlagen, leichtgewichtige Rendering-Helfer und automatisch größenanpassende Einbettungen ohne eigenen Glue-Code.

Schnell prototypen, dann sicher ausliefern

Öffne die Spielwiese, um eine teilbare Konfiguration zu erstellen, und nutze die Dokumentation, um sie in die Produktion zu überführen.