Skip to main content
Microsites

Mini-Seiten — Vollständiger Benutzerhandbuch

Was sind Mini-Seiten?

Mini-Seiten ermöglichen es Ihnen, Ihre eigene Website direkt in OrbitingFox zu erstellen und zu veröffentlichen — keine Kodierung erforderlich. Jede Seite erhält ihre eigene öffentliche URL, benutzerdefinierte Seiten, Bilder und ein Kontaktformular. Sie können alle veröffentlichten Seiten unter /sites/ durchsuchen.

Erstellen Sie Ihre erste Seite

  1. Gehen Sie zum Mini-Seiten-Dashboard → klicken Sie auf + Neue Seite.
  2. Füllen Sie einen Titel, einen internen Slug (URL-sicheren Spitznamen) und eine optionale Beschreibung aus.
  3. Klicken Sie auf Erstellen — Sie gelangen zum Builder.

Der Builder

Der Builder hat zwei Hauptbereiche:

  • Linke Seitenleiste — Ihre Seitenliste. Klicken Sie auf eine Seite, um sie zu bearbeiten. Verwenden Sie das Sichtbarkeitssymbol mit dem Auge, um zu steuern, wer jede Seite sieht.
  • Leinwand (rechts) — Ihr Blockeditor. Jeder Block ist ein Stück Inhalt (Text, Bild, Schaltfläche usw.).

Die Obere Leiste hat Schnellzugriffstasten:

  • Vorschau — sehen Sie die öffentliche Ansicht Ihrer Seite
  • Einstellungen — seitenweite Einstellungen (Farben, Logo, SEO, Navigationsstil)
  •  Export ZIP — laden Sie die gesamte Seite als tragbare Datei herunter
  • Versionen — durchsuchen und stellen Sie frühere Schnappschüsse wieder her

Seiten & Abschnitte

Jede Seite besteht aus Seiten (genannt Abschnitte). Seiten erscheinen automatisch in der Navigation Ihrer Seite.

  • Klicken Sie auf + Seite hinzufügen in der Seitenleiste, um eine neue Seite zu erstellen.
  • Geben Sie ihr ein Label (was in der Navigation erscheint) und einen Slug (kurzer URL-sicherer Name, z.B. services).
  • Ziehen Sie Seiten nach oben/unten, um die Navigation neu anzuordnen.
  • Sichtbarkeit pro Seite: Öffentlich (jeder), Nur Eigentümer (nur Sie), Versteckt (nicht in der Navigation angezeigt).

Unterseiten

Sie können Seiten bis zu 4 Ebenen tief schachteln. Um eine Seite zu einer Unterseite einer anderen zu machen, setzen Sie ihren Elternseite, wenn Sie hinzufügen/bearbeiten. Unterseiten erscheinen als Dropdown-Elemente in der Navigation.

Blocktypen

Klicken Sie auf + Block hinzufügen, um Inhalte einzufügen. Verfügbare Blocktypen:

BlockWas es tut
TextReicher Texteditor (fett, kursiv, Listen, Links). Ideal für Absätze und formatierten Inhalt.
Raw HTMLFügen Sie Bootstrap 5 HTML ein — entworfen für KI-generierte Layouts. Hat einen integrierten KI-Prompt-Helfer.
BildZeigen Sie ein Bild von einer URL an, optional mit Bildunterschrift und Breitenkontrolle.
ButtonEin gestalteter Call-to-Action-Link. Verwenden Sie #page-slug als URL, um zu einer anderen Seite auf derselben Website zu scrollen.
CollapseEin erweiterbares Panel — perfekt für FAQs. Besucher klicken auf den Titel, um die Antwort anzuzeigen.
FormularIntegriertes Kontaktformular. Funktioniert nur auf einer Seite namens kontakt. Einreichungen erscheinen in Ihrem Nachrichten-Posteingang.
KarteBetten Sie eine Google-Karte mithilfe einer Adresse oder eines Ortsnamens ein.
YouTubeBetten Sie ein YouTube-Video per URL ein.
VideoVerlinken oder laden Sie eine Videodatei hoch.
DateiLaden Sie eine PDF-, Markdown- oder HTML-Datei hoch oder verlinken Sie diese zum Herunterladen/Anzeigen durch Besucher.
EinbettenFügen Sie jeden iframe-Einbettungscode ein (z. B. Calendly, Google Form, Typeform).
SpaltenSeitenleistenlayout-Spalten — ideal für zweispaltige Informationsabschnitte.
TOCAutomatisch generiertes Inhaltsverzeichnis basierend auf Überschriften in der Seite.
NavbarEine sekundäre Navigationsleiste innerhalb der Seite.
Divider / SpacerEine horizontale Linie oder leerer vertikaler Raum zur visuellen Trennung.

KI-Prompt-Helfer (Raw HTML-Blöcke)

Wenn Sie einen Raw HTML Block hinzufügen, erscheint ein lila Mit AI anpassen-Panel. Klicken Sie darauf, um es zu erweitern — es zeigt einen vorgefertigten KI-Prompt für diesen Abschnittstyp an.

  1. Scrollen Sie zum [DIESE INFOS BEARBEITEN] am Ende des Prompts und ersetzen Sie das Beispiel durch Ihre eigenen Inhalte.
  2. Klicken Sie auf Prompt kopieren.
  3. Fügen Sie es in ChatGPT oder Gemini (beide kostenlos) ein.
  4. Kopieren Sie das HTML, das die KI zurückgibt → fügen Sie es in das Codefeld ein → klicken Sie auf Speichern.

Tipps — Links zu Sektionen: Wenn die KI Ihnen einen Button wie <a href="#">Mehr erfahren</a> gibt, ersetzen Sie # durch #your-page-slug. Beispiel: <a href="#services">Unsere Dienstleistungen</a> scrollt zu der Seite mit dem Slug services.

Ein grünes Tipps-Panel unter dem KI-Helfer erklärt dies und erinnert Sie daran, das integrierte Formular-Block für Kontaktformulare zu verwenden (nicht KI-generierte HTML-Formulare).

Einstellungs-Tab

Öffnen Sie den Einstellungen-Tab im Builder, um seitenweite Optionen zu konfigurieren:

  • Basics — Titel, Slug, Beschreibung, SEO-Titel/Beschreibung/Schlüsselwörter, Banner-Titel
  • Branding — Kopfzeilenbild, Logo, Favicon, animiertes Logo
  • Farben — Hintergrund, Logo-Bereich, Kopfzeile, Fußzeile (Hex-Farbenwähler)
  • Logo-Karussell — laden Sie mehrere Logos für einen sich drehenden Streifen hoch; Steuerung des Intervalls, der Ausrichtung
  • Navigation — Layout (Linke Seitenleiste / Obere Leiste / Rechte Seitenleiste), Thema (Hell / Dunkel / Transparent)
  • Kontaktformular — Telefonnummer-Feld-Umschalter anzeigen, Telefonnummer/E-Mail erforderlich machen
  • OrbitingFox-Abzeichen — das Abzeichen zur Website-Anerkennung anzeigen oder ausblenden
  • Veröffentlichung — setzen Sie Ihre öffentliche URL, Sichtbarkeitsmodus und Veröffentlichungs/Unveröffentlichungs-Schaltflächen

Veröffentlichen Sie Ihre Seite

  1. Gehen Sie zum Abschnitt Einstellungen → Veröffentlichung, geben Sie eine Öffentliche URL ein (einen einzigartigen Slug, z.B. my-bakery). Ihre Seite wird unter /sites/my-bakery/ verfügbar sein.
  2. Wählen Sie Veröffentlichungssichtbarkeit:
    • Öffentlich — im /sites/-Verzeichnis aufgeführt, jeder kann sie finden
    • Nicht aufgeführt — nur per direkter URL zugänglich, nicht im Verzeichnis aufgeführt
    • Gruppe — nur für Mitglieder einer ausgewählten Kontaktgruppe zugänglich
  3. Klicken Sie auf Veröffentlichen. Ein Versionssnapshot wird automatisch gespeichert.
  4. Um Ihre Seite offline zu nehmen, klicken Sie auf Unveröffentlichen.

Kontakt Nachrichten

Wenn jemand Ihr Kontaktformular einreicht, erscheint die Nachricht in Dashboard → Ihre Seite → Nachrichten.

Jede Nachricht hat einen Status, den Sie aktualisieren können:

  • NeuGelesenAntwort gegebenArchiviert

Antworten Sie, indem Sie auf die E-Mail des Absenders klicken (öffnet Ihren E-Mail-Client mit einer vorausgefüllten Adresse).

Versionsverlauf

Jedes Mal, wenn Sie auf Veröffentlichen klicken, speichert OrbitingFox einen Snapshot Ihrer gesamten Seite. Besuchen Sie Versionen (Oberleistenknopf), um Schnappschüsse zu durchsuchen.

  • Jede Karte zeigt das Datum, die Uhrzeit und eine Zusammenfassung der Seiten und Blöcke zu diesem Zeitpunkt an.
  • Klicken Sie auf Diese Version wiederherstellen, um zurückzukehren. Ein Bestätigungsdialog warnt Sie, dass die Änderung sofort erfolgt.
  • Das Importieren eines ZIP in eine vorhandene Seite erstellt ebenfalls ein Vorher/Nachher-Versionspaar.

Duplizieren einer Seite

Im Dashboard klicken Sie auf das -Menü neben einer Seite → Duplizieren. Eine vollständige Kopie wird erstellt (alle Seiten, Blöcke, Einstellungen, Bilder) mit einem neuen internen Slug. Die öffentliche URL wird nicht kopiert — Sie müssen eine neue festlegen.

ZIP-Export, Import & VSCode-Workflow

Exportieren Sie Ihre vorhandene Seite

Builder-Oberleiste →  Export ZIP. Die ZIP enthält:

  • site.json — alle Ihre Seiten, Blöcke und Einstellungen in einem lesbaren Format
  • images/ und files/ — alle hochgeladenen Medien
  • README.md — Schritt-für-Schritt-Anleitung für Benutzer und KI-Assistenten
  • AI_CONTEXT.md — vollständige technische Referenz für KI-Agenten und Entwickler

Laden Sie eine leere Startervorlage herunter

Dashboard →  Startervorlage. Dasselbe ZIP-Format, vorgefüllt mit einer Startseite (Hero-Block) und einer Kontaktseite (Formular-Block). Beginnen Sie hier, wenn Sie in VSCode von Grund auf neu gestalten möchten.

Bearbeiten in VSCode mit KI

  1. Entpacken → Öffnen Sie den Ordner in VSCode.
  2. Erzählen Sie einem KI-Assistenten: „Lesen Sie zuerst AI_CONTEXT.md, dann helfen Sie mir mit meiner Website.“
  3. Beschreiben Sie Änderungen in einfacher Sprache. Die KI bearbeitet site.json für Sie.
  4. Wieder zippen und hochladen.

Wieder hochladen (importieren)

Dashboard →  Import ZIP.

  • Lassen Sie das Dropdown leer → erstellt eine neue Entwurfseite.
  • Wählen Sie eine vorhandene Seite aus dem Dropdown → ersetzt den Inhalt dieser Seite und speichert automatisch eine Revision, sodass Sie zurückkehren können.

Was NICHT importiert wird

  • Öffentliche URL — Sie müssen Ihre eigene festlegen
  • Veröffentlichungszustand — startet immer als privater Entwurf
  • Kontakt Nachrichten — bleiben auf dem ursprünglichen Server
  • Gruppeneinschränkungen — Gruppen sind serverabhängig

Sicherheit

OrbitingFox scannt jede hochgeladene ZIP-Datei auf unsichere Inhalte. Abgelehnte ZIPs enthalten eine Erklärung in einfacher Sprache, warum sie blockiert wurden (z.B. „Unsicheres HTML erkannt“, „Nicht erlaubter Dateityp“).


Hinweis (2026-08-17) — nicht dasselbe wie das Plattform-Designsystem. Die oben beschriebenen Farbeinstellungen sind seitenweise (oder pro Element) Einstellungen, die dem Benutzer gehören, der diese Seite erstellt hat. Sie sind nicht der plattformweiten visuellen Standard. Die Farben, Textgrößen und Komponenten der Plattform befinden sich im Designsystem — siehe Admin → Design-System und docs/design/DESIGN.md — und sind global auf Erscheinungsbild eingestellt.

This guide was translated automatically. Read the English original.

🪐 OrbitPilot