> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.fotostudio.io/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Der Fotostudio-Website-Baukasten

# 🖥️ Der Fotostudio-Website-Baukasten

## Einführung

Mit dem Website-Baukasten erstellst du deine Website direkt in Fotostudio. Das Besondere: Er ist **mit deinem CRM verbunden**. Deine Leistungskataloge, deine Galerien, deine Kontaktformulare, die Online-Buchung und die Geschenkgutscheine erscheinen auf deiner Website, ohne dass du etwas doppelt eingeben musst. Du änderst einen Preis im CRM, und er ändert sich auf der Website, ohne neu zu veröffentlichen.

---

## Wo du den Website-Baukasten findest

Gehe im Menü zu **Website** > **Meine Website**. Im selben Menü findest du **Domains** (die Adresse deiner Website) und **Widgets für deine Website** (wenn du deine aktuelle Website behältst).

---

## Was dein Tarif umfasst

| | Start-Tarif | Pro-Tarif und höher |
|---|---|---|
| **Websites** | 1 | Bis zu 10 |
| **Seiten** | 8 pro Sprache | Unbegrenzt |
| **Sprachen** | 1 | Mehrere |
| **Adresse** | Fotostudio-Adresse (`meinstudio.fotostudio.io`) | Fotostudio-Adresse und deine eigene Domain |
| **Bildbibliothek** | 1 GB | Unbegrenzt |
| **Hinweis „Erstellt mit Fotostudio“** | Immer angezeigt | Kann ausgeblendet werden |

**Was zu den 8 Seiten zählt:** Seiten, Landingpages, Bio-Links-Seiten und Blogs. Rechtliche Seiten, Blogbeiträge, Untermenüs, Links und Kundenbereich-Seiten zählen nicht.

> 💡 Wenn du zu einem kleineren Tarif wechselst, behältst du deine bestehenden Websites, Sprachen und Domains, kannst aber keine neuen mehr hinzufügen.

---

## Deine Website erstellen

Beim Erstellen gibt es zwei Schritte:

1. **Farben und Schriften**: Starte mit einer deiner visuellen Identitäten oder mit der Palette eines Themas. Alles lässt sich danach anpassen.
2. **Zu erstellende Seiten**: Wähle ein Thema, dessen Seiten mit deinen Daten gefüllt werden (Telefon, Adresse, E-Mail, Instagram, Buchungslinks), oder **Leere Website**, um selbst Block für Block zu gestalten.

### Die Themen

| Kategorie | Thema | Stil | Erstellte Seiten |
|---|---|---|---|
| **Vollständige Websites** | Aria | Elegant und luftig, für ein erzählendes Studio | Start, Über mich, Portfolio, Angebote, Kontakt |
| | Onyx | Dunkel und formatfüllend, das Foto zuerst | 5 Seiten |
| | Sienna | Warm und rund, für Familien | 5 Seiten |
| **Portfolios** | Berlin | Schwarzweiß, das Raster zuerst | Start, Über mich, Kontakt |
| | Linen | Sanft und klassisch, ganzseitig | 3 Seiten |
| | Nord | Klar und ruhig, für Landschaften | 3 Seiten |
| **Einseitige Website** | Mono | Zurückhaltend, alles auf einer Seite | 1 Seite |
| | Sable | Hell und rund, alles auf einer Seite | 1 Seite |
| | Kyoto | Natürlich und ruhig, alles auf einer Seite | 1 Seite |

Jede Website wird außerdem mit den Seiten **Impressum** und **Datenschutzerklärung** erstellt, vorausgefüllt mit den Angaben deines Unternehmens. Ergänze die mit **[zu ergänzen]** markierten Stellen.

> 💡 Du kannst das Thema später wechseln (Tab **Design** > **Thema wählen**). Ein Thema ändert das Aussehen und fügt fehlende Seiten hinzu: Es verändert nie eine bestehende Seite.

Deine Website startet als **Entwurf**: Niemand sieht sie, solange du sie nicht veröffentlicht hast.

---

## Der Editor

Der Editor besteht aus einem Bereich links mit vier Tabs (**Seiten**, **Design**, **Statistik**, **Einstellungen**) und der Vorschau deiner Website rechts. Die Buttons **Computer**, **Tablet** und **Handy** ändern die Breite der Vorschau.

### Die Seitentypen

Klicke auf **Neue Seite** und wähle einen Typ:

| Typ | Wofür er dient |
|---|---|
| **Seite** | Inhalt, aus Blöcken aufgebaut |
| **Untermenü** | Fasst Seiten im Menü zusammen |
| **Link** | Führt woandershin (eine andere Adresse, dein Shop...) |
| **Kundenbereich** | Online-Buchung, Mini Sessions, Geschenkgutscheine oder ein Katalog, im Design deiner Website |
| **Blog** | Datierte Beiträge, vom neuesten zum ältesten |
| **Bio-Links** | Eine Spalte mit Buttons, für deine Instagram- oder TikTok-Bio |
| **Landingpage** | Eine Seite ohne Menü und Fußzeile, für ein Angebot oder eine Werbeanzeige |

Für jede Seite werden Vorlagen angeboten (Start, Über mich, Portfolio, Angebote, Kontakt, Blog, Beitrag...), oder **Leere Seite**.

### Das Menü

Das Menü deiner Website ist der Seitenbaum im Tab **Seiten**. Ziehe die Seiten per Drag-and-drop, um sie neu anzuordnen oder in ein Untermenü einzusortieren. Eine Seite kann auch mit **Aus dem Menü ausblenden** verborgen werden und bleibt trotzdem über ihren Link erreichbar.

Jede Seite hat eine änderbare **Adresse**. Wenn du sie änderst, leitet die alte Adresse automatisch auf die neue weiter.

### Die Blöcke

Eine Seite besteht aus Blöcken, die du mit **Block hinzufügen** einfügst. Suche einen Block nach seinem Namen und markiere deine Lieblingsblöcke mit einem Stern, um sie unter **Favoriten** wiederzufinden.

| Kategorie | Blöcke |
|---|---|
| **Text und Bilder** | Text, Bild, Galerie, Bild und Text, Karten, Diashow, Banner |
| **Galerien** | Verknüpfte Galerie 🔗, Portfolio 🔗 |
| **Leistungen** | Leistungen (von Hand eingegeben), Katalog 🔗 |
| **Kundenstimmen und FAQ** | Zitat, Kundenstimmen, FAQ |
| **Links** | Button, Bildlinks |
| **Formulare** | Kontaktformular 🔗, Newsletter-Anmeldung 🔗 |
| **Video** | Video, Video und Text (YouTube, Vimeo) |
| **Soziale Netzwerke** | Soziale Netzwerke, Instagram-Wand |
| **Sonstiges** | Partner, Kontaktdaten, Ort (Karte) |
| **Blog** | Beitragsliste, Neueste Beiträge |
| **Layout** | Abstand, Trenner |

🔗 = Block, der mit deinem CRM verbunden ist:

| Block | Was er anzeigt |
|---|---|
| **Katalog** | Einen deiner Leistungskataloge. Die Preise werden weiter im CRM verwaltet: Eine Änderung dort wirkt sich auf die Website aus, ohne neu zu veröffentlichen. Der Besucher kann eine Leistung auswählen, oder der Katalog dient nur als Schaufenster. |
| **Verknüpfte Galerie** | Die Fotos einer deiner öffentlichen Galerien (12, 24 oder 60 Fotos). Ein Foto, das du der Galerie hinzufügst, erscheint auf der Website, ohne neu zu veröffentlichen. |
| **Portfolio** | Die Galerien, die du unter Galerien als Portfolio markiert hast. |
| **Kontaktformular** | Eines deiner Kontaktformulare. Jede Anfrage legt wie gewohnt einen Interessenten in Fotostudio an. Die Felder stellst du unter **Kontaktformulare** ein. |
| **Newsletter-Anmeldung** | Der neue Abonnent wird ein Kontakt in deinem CRM, mit gespeicherter Einwilligung. |

> ⚠️ Die Blöcke **Kundenstimmen**, **FAQ** und **Leistungen** füllst du von Hand aus. Die Fotos der **Instagram-Wand** wählst du von Hand aus: Es ist kein automatischer Feed.

**Einstellungen jedes Blocks:** Layout, **Farben** (Hell, Hell abgesetzt, Akzent, Dunkel abgesetzt, Dunkel), **Abstand** (Kompakt, Normal, Großzügig) und **Auf Mobilgeräten ausblenden**. Blöcke lassen sich über ihre Werkzeugleiste duplizieren, verschieben und löschen.

### Das Design

Der Tab **Design** regelt das Aussehen der ganzen Website:

| Bereich | Einstellungen |
|---|---|
| **Farben** | Fertige Paletten (Natürlich, Schwarz-Weiß, Sand, Wald, Ozean, Rosé, Terrakotta, Nacht), deine visuellen Identitäten oder eigene Farben |
| **Kopfbereich** | Layout, Höhe, Aktions-Button (zum Beispiel „Buchen“), Kundenbereich-Button, fixierter Kopfbereich, Links in Großbuchstaben |
| **Logos** | Hauptlogo und helles Logo (für dunkle Hintergründe) |
| **Tab-Symbol** | Das quadratische Symbol, das im Browser-Tab und in den Lesezeichen angezeigt wird |
| **Schriften** | Eine Schrift für die Überschriften, eine für den Text |
| **Schaltflächen, Breite, Eckenradius** | Stil und Größe der Buttons, Breite des Inhalts, Abrundung der Ecken |
| **Animationen** | Keine, Einblenden, Hochgleiten, Vergrößern, Verkleinern, Aufdecken |
| **Fußzeile** | Ein Text und bis zu 12 Links |

### Die Bilder

Bilder verwaltest du in der **Bibliothek**. Du kannst auch ein Foto aus deinen Galerien importieren (Tab **Meine Galerien**) und jedes Bild zuschneiden.

- Akzeptierte Formate: **JPEG, PNG, WebP** (SVG wird nicht akzeptiert)
- Maximale Größe: **15 MB** pro Bild
- **Bildschutz**: erschwert das Kopieren, nur auf den Bildern oder auf der ganzen Seite. Das ist eine Hürde, kein echter Schutz.

---

## Deine Website veröffentlichen

Jede Änderung wird in deinem **Entwurf** gespeichert. Solange sich der Entwurf von der Online-Version unterscheidet, zeigt der Button **Nicht veröffentlichte Änderungen**. Klicke auf **Veröffentlichen**, um deine Website online zu stellen.

- **Vorschau**: den Entwurf vor dem Veröffentlichen so sehen, wie ein Besucher ihn sieht.
- **Offline nehmen**: Die Website ist nicht mehr sichtbar, aber nichts geht verloren. Der Kundenbereich, die Angebote und die Buchungen funktionieren unter deiner Adresse weiter. **Veröffentlichen** stellt sie wieder online.
- **Immer nur eine Website online**: Wenn du eine andere Website veröffentlichst, geht die vorherige offline, und deine Adresse zeigt die neue.

### Der Verlauf

Unter **Einstellungen** > **Verlauf** erzeugt jede Veröffentlichung eine Version. Du kannst auch mit **Eine Version speichern** eine Version anlegen und ihr einen Namen geben (zum Beispiel „Vor dem Relaunch“).

| Aktion | Wirkung |
|---|---|
| **Ganze Website wiederherstellen** / **Diese Seite wiederherstellen** | Ersetzt deinen Entwurf durch die alte Version. Die Online-Website ändert sich erst bei der nächsten Veröffentlichung. |
| **Wieder online stellen** | Stellt die alte Version direkt online, ohne deinen Entwurf anzufassen. |

Fotostudio bewahrt die letzten 20 Versionen auf, dazu alle Versionen, denen du einen Namen gegeben hast.

---

## Eine Website in mehreren Sprachen

*Verfügbar ab dem Pro-Tarif.*

Klicke unter **Einstellungen** > **Sprachen** auf **Hinzufügen** und wähle eine Sprache (Französisch, Englisch, Deutsch, Niederländisch, Spanisch, Italienisch, Portugiesisch, mit regionalen Varianten). Deine Seiten werden kopiert und in wenigen Augenblicken **automatisch übersetzt**.

- Jede Sprache hat ihre eigenen Seiten, die du frei bearbeiten kannst.
- Die Adressen der anderen Sprachen haben ein Präfix: `/en/...`, `/de/...`. Die Standardsprache hat keins.
- Wenn du die Originalseite änderst, wird die Übersetzung mit „Das Original hat sich seit dieser Übersetzung geändert“ markiert. Nutze **Neu aus dem Original übersetzen**, um sie zu aktualisieren.
- Besucher sehen ein Banner, das ihnen die Version in ihrer Sprache anbietet.

> ⚠️ **Diese Sprache entfernen** löscht alle Seiten dieser Sprache.

---

## Der Blog

Füge eine Seite vom Typ **Blog** hinzu und erstelle dann deine Beiträge mit **Neuer Beitrag**. Jeder Beitrag hat ein Veröffentlichungsdatum, ein Titelbild, einen Teaser und bis zu 10 Schlagwörter.

| Status | Bedeutung |
|---|---|
| **Entwurf** | Ohne Veröffentlichungsdatum: Der Beitrag geht nie online |
| **Geplant** | Mit einem Datum in der Zukunft: Der Beitrag erscheint an diesem Datum von selbst, sobald die Website veröffentlicht ist |
| **Online** | Auf deiner Website sichtbar |

Die Blogseite listet die Beiträge auf (6, 9 oder 12 pro Seite), mit einem Filter nach Schlagwort. Der Block **Neueste Beiträge** hebt deine 3, 4 oder 6 neuesten Beiträge auf jeder beliebigen Seite hervor. Ein RSS-Feed ist unter der Adresse `/blog/feed.xml` verfügbar.

---

## Die Adresse deiner Website

Deine Website braucht eine Adresse, um veröffentlicht zu werden. Zwei Möglichkeiten, unter **Website** > **Domains**:
- eine **Fotostudio-Adresse** (`meinstudio.fotostudio.io`), sofort bereit und in allen Tarifen enthalten;
- **deine eigene Domain** (`www.meinstudio.de`), ab dem Pro-Tarif.

Alle Details findest du im Artikel „Die Domains deiner Website verwalten“.

---

## Suchmaschinen und Statistiken

### Suchmaschinenoptimierung

Unter **Einstellungen** > **SEO**: der Titel der Startseite, die Beschreibung und das Vorschaubild (das angezeigt wird, wenn jemand deine Website in sozialen Netzwerken teilt). Jede Seite kann ihre eigenen haben; bleibt ein Feld leer, übernimmt es die Einstellung der Website.

Der Bereich **Lokale Auffindbarkeit** übermittelt Google den Namen, die Adresse und die Telefonnummer deines Studios.

Fotostudio erstellt automatisch die Sitemap (`sitemap.xml`), die Datei `robots.txt` und die Tags, die für Suchmaschinen nützlich sind. Landingpages und Kundenbereich-Seiten werden nicht indexiert.

Unter **Einstellungen** kannst du auch deine Google-Analytics-ID oder dein Meta-Pixel hinzufügen (**Reichweitenmessung**) und ein **Cookie-Banner** aktivieren.

### Statistiken

Der Tab **Statistik** zeigt über 7 Tage, 30 Tage oder 12 Monate: die Besucher, die Seitenaufrufe, die meistbesuchten Seiten, woher die Besucher kommen (Google, Instagram, Facebook, Pinterest, TikTok...) und die gedrückten Buttons.

> 💡 Besuche werden ohne Cookie gezählt, direkt auf dem Server: Der Besucher wird nach nichts gefragt, und Bots werden nicht mitgezählt.

---

## Der Kundenbereich auf deiner Website

Aktiviere unter **Design** > **Kopfbereich** den **Kundenbereich-Button im Menü**. Deine Kunden geben dort ihre E-Mail-Adresse ein, erhalten einen sechsstelligen Code und finden ihre Angebote, Rechnungen, Galerien und Shootings wieder, im Design deiner Website.

Die Links in deinen E-Mails (Angebote, Rechnungen, Galerien) öffnen sich ebenfalls unter der Adresse deiner Website.

---

## Deine Website mit Claude bearbeiten

Wenn du Claude mit Fotostudio verbunden hast, kannst du Claude bitten, deine Website in natürlicher Sprache zu erstellen oder zu ändern: „füge eine Seite Hochzeiten mit meinen Preisen hinzu“, „ändere die Farben in etwas Wärmeres“...

Claude arbeitet **immer in deinem Entwurf**. Claude veröffentlicht nur, wenn du ausdrücklich darum bittest. Deine Website muss vorher unter **Website** > **Meine Website** erstellt worden sein.

---

## Häufige Fragen

**Ich habe schon eine Website bei WordPress oder Wix. Muss ich wechseln?**
Nein. Du kannst deine Website behalten und dort mit den Widgets die Buchung, die Geschenkgutscheine oder deine Formulare einbinden (**Website** > **Widgets für deine Website**).

**Ich ändere meine Preise im CRM. Muss ich die Website neu veröffentlichen?**
Nein, für die Blöcke **Katalog**, **Verknüpfte Galerie** und **Portfolio**: Sie zeigen immer die aktuellen Daten. Der Block **Leistungen** dagegen wird von Hand eingegeben und aktualisiert sich, wenn du neu veröffentlichst.

**Warum ist der Button „Neue Website“ ausgegraut?**
Im Start-Tarif hast du eine einzige Website. Mehrere Websites sind ab dem Pro-Tarif verfügbar.

**Die Meldung „Du hast die Grenze von 8 Seiten im Start-Tarif erreicht“ erscheint.**
Der Start-Tarif umfasst 8 Seiten pro Sprache. Rechtliche Seiten, Blogbeiträge, Untermenüs und Links zählen nicht. Für unbegrenzte Seiten wechsle zum Pro-Tarif.

**Mein Bild wird abgelehnt.**
Prüfe sein Format (JPEG, PNG oder WebP) und seine Größe (maximal 15 MB). SVG-Dateien werden nicht akzeptiert.

**Wie lösche ich eine Website?**
Eine Website, die online ist, lässt sich nicht löschen: Nimm sie zuerst offline. Deine letzte Website kann nicht gelöscht werden.

**Ich habe einen Fehler gemacht und veröffentlicht. Kann ich das rückgängig machen?**
Ja: Wähle unter **Einstellungen** > **Verlauf** die vorherige Version und klicke auf **Wieder online stellen**.

**Was passiert, wenn mein Abonnement endet?**
Deine Besucher sehen bis zur Verlängerung eine Warteseite. Deine Website wird nicht gelöscht.