Das gesamte Handbuch auf einer Seite, praktisch zum Ausdrucken oder um es einem KI-Assistenten zu geben.

Willkommen

Mit SmartStudio bearbeitest du deine Website selbst: in einfacher Sprache, ohne Technik-Kenntnisse. Du beschreibst in eigenen Worten, was geändert werden soll, und die Seite wird angepasst.

Was du tun kannst

• Texte, Bilder und Layout ändern: einfach beschreiben, was anders sein soll.
• Aussehen und Verhalten anpassen: von „mach den Button grün" bis „die Überschrift soll wechseln". Studio erkennt selbst, was gemeint ist, und schreibt bei Bedarf den nötigen Code, du musst nichts umschalten.
• Neue Seiten anlegen, umbenennen und sortieren.
• Titel, Beschreibung und Teilen-Vorschau pflegen (für Google & Social Media).
• Vorschau ansehen und veröffentlichen: Studio räumt vorher auf und prüft Suchmaschinen-Tauglichkeit und Barrierefreiheit. Alles lässt sich jederzeit rückgängig machen.

So ist das Handbuch aufgebaut

Links findest du die Kapitel. Für den Anfang empfohlen:

1. Anmelden & Studio öffnen
2. Inhalte ändern (per Texteingabe)
3. Vorschau & Veröffentlichen

Tipp: Du kannst dieses Handbuch auch einem KI-Assistenten geben und ihm Fragen zur Bedienung stellen.

Anmelden & Studio öffnen

So kommst du in den Bearbeitungs-Modus deiner Website.

Anmelden

Rufe deine Website auf und melde dich mit deinen Zugangsdaten an (Login-Seite oder der Link, den du erhalten hast). Nach dem Login bist du als Redakteur eingeloggt, für Besucher ändert sich nichts.

Studio öffnen

Es gibt zwei Wege:

• Direkt auf der Seite: Wenn du eingeloggt bist, erscheint unten ein Button „✎ Bearbeiten". Ein Klick öffnet die aktuelle Seite im Studio.
• Über das Studio: Öffne das Studio und wähle die Seite, die du bearbeiten möchtest.

Überblick im Studio

• Links/Mitte: deine Seite als Vorschau.
• Eingabefeld: hier beschreibst du Änderungen.
• Bild / Daten / Funktion / Ansehen: Werkzeuge zum Einfügen.
• Veröffentlichen: macht deine Änderungen für Besucher live.

Solange du nichts veröffentlichst, sieht niemand deine Änderungen, du kannst also in Ruhe ausprobieren.

Funktionsumfang im Überblick

Diese Seite fasst zusammen, was SmartStudio kann, als schneller Überblick (auch für Agenturen und Partner). Details stehen in den jeweils verlinkten Kapiteln.

Bearbeiten in natürlicher Sprache

• Ein Eingabefeld für alles (Inhalte ändern): Text, Aussehen, Struktur und Verhalten. SmartStudio erkennt selbst, worum es geht, und schreibt bei Bedarf echten Code (HTML, CSS, JavaScript), kein Umschalten zwischen „Inhalt" und „Technik".
• Verstehen vor dem Ändern: klärt erst, was gemeint ist und wo es steht, prüft nach dem Anwenden selbst und bessert bei Bedarf nach.
• Markieren für punktgenaue Anweisungen, Verlauf wie ein Gespräch, jederzeit rückgängig.
• Mediathek für Bilder inkl. automatischer Verkleinerung.

Seiten & Struktur

• Seiten anlegen, umbenennen, sortieren, mit Ordner-URLs.
• Titel, Beschreibung & Teilen-Vorschau pro Seite (Google + Social Media).
• Module: strukturierte Inhaltstypen (Neuigkeiten, Team, Leistungen) mit automatischer Übersicht und eigenen, SEO-fähigen Detailseiten.
• Zentrale Navigationen und Bereiche: Menüs und Kopf/Fuß einmal pflegen, überall identisch.

Funktionen & Daten

• Plugins: fertige Funktionen zum Einschalten, z. B. Kontaktformular und Terminanfrage mit Spam-Schutz, Öffnungszeiten mit Live-Status, Hinweisleiste und Urlaubs-Hinweis, FAQ, Stellenangebote, Bildergalerie, Karten-Freigabe ohne Cookie-Banner, WhatsApp-Knopf und strukturierte Daten für Suchmaschinen.
• Funktionsbausteine (z. B. Kontaktformulare): laufen weiter und werden beim Bearbeiten geschützt.
• Listen & Tabellen für wiederkehrende Inhalte auf einer Seite (Preise, Leistungen, Termine).
• Datenquellen: externe APIs serverseitig anbinden (geholt, gecacht, Keys versteckt).

Reichweite & Technik

• Suchmaschinen & KI: robots.txt, Sitemap und eine llms.txt, damit auch KI-Assistenten die Website sauber erfassen.
• Code-Snippets: Analytics, Schriften oder Verifizierungs-Tags seitenweit einbinden.
• Fehlende Seiten & Weiterleitungen: bot-gefiltertes 404-Protokoll + 301/302-Weiterleitungen für Relaunches. Die KI wertet die 404er aus und ordnet sie ein (technische Anfrage, alte Seite, Tippfehler, Müll) und schlägt passende Weiterleitungsziele aus den real vorhandenen Seiten vor.
• Website übernehmen: eine bestehende Seite nach SmartStudio holen.

Qualität beim Veröffentlichen

Beim Veröffentlichen räumt SmartStudio auf (Gestaltungs-/Skript-Reste an ihren Platz, mit optischem Sicherheitsnetz) und prüft Suchmaschinen-Tauglichkeit und Barrierefreiheit. Für die volle Barrierefreiheits-Prüfung inklusive Farbkontrast gibt es zusätzlich eine tiefe Prüfung auf Klick (axe-core im Browser).

Rollen

• Redakteur: bearbeitet Inhalte und Bilder.
• Mit Code-Rechten: zusätzlich Struktur, Module, Navigationen, Bereiche, SEO, Snippets und die technischen Bereiche.

Inhalte ändern (per Texteingabe)

Das Herzstück: Du öffnest eine Seite und beschreibst in eigenen Worten, was geändert werden soll, zum Beispiel „Ändere die Überschrift in Willkommen bei Müller" oder „Mach den Button grün und etwas größer".

So geht's

1. Seite öffnen und auf Bearbeiten gehen.
2. Im Studio-Feld beschreiben, was geändert werden soll.
3. Absenden, die Änderung wird angewendet und du siehst sie sofort.

Es gibt ein einziges Eingabefeld. Du musst nirgends umschalten und nicht vorher entscheiden, ob deine Anweisung „Inhalt" oder „Technik" ist.

Studio versteht erst, dann arbeitet es

Bevor etwas geändert wird, klärt Studio zuerst, worum es geht und wo auf deiner Seite das gemeinte Element steckt. Erst danach setzt es die Änderung gezielt um. Du siehst diesen Schritt kurz im Fenster („Analysiert die Anweisung …", „Verstanden …").

Deshalb kannst du alles im selben Feld sagen:

Für Aussehen und Verhalten schreibt Studio bei Bedarf echten Code (CSS, JavaScript). Du musst davon nichts verstehen und nichts umstellen.

Genauer zielen: markieren

Markiere auf der Seite den Text oder das Element, um das es geht. Dann ist klar, worauf sich deine Anweisung bezieht, praktisch, wenn ein Wort mehrfach vorkommt.

Wie ein Gespräch

Du kannst nacheinander mehrere Anweisungen geben; jede baut auf der vorigen auf. Mit „Neuer Chat" beginnst du eine frische Bearbeitung.

Wenn es nicht auf Anhieb sitzt

Studio prüft nach dem Anwenden selbst, ob die Änderung wirklich gegriffen hat, und bessert von sich aus nach, wenn nicht. Bei einer Design-Änderung sieht es sich das Ergebnis dafür auch optisch an. Während es arbeitet, siehst du live, woran es gerade ist.

Das gilt genauso für größere, mehrteilige Aufgaben, etwa „Überarbeite die Startseite: neue Überschrift, freundlicherer Einstiegstext und ein Kontakt-Button am Ende." Du musst dafür nichts umstellen.

Zwei Arten von Inhalten

Die meisten Inhalte (Überschriften, Texte, Bilder, Buttons) stehen direkt auf der Seite und änderst du genau wie oben per Texteingabe.

Manche Inhalte kommen dagegen aus einer Tabelle: alles, was sich Zeile für Zeile wiederholt, etwa eine Preisliste oder eine Team-Übersicht. Öffnungszeiten und Urlaube kommen aus den Plugins Öffnungszeiten bzw. Ankündigungen. Solche Einträge werden zentral an einer Stelle gepflegt, nicht auf der Seite selbst.

• Erkennen: Geht es um eine sich wiederholende Liste (Termine, Preise) und der Assistent weist dich darauf hin, dass diese Inhalte aus einer Tabelle stammen, dann werden sie nicht hier auf der Seite geändert.
• Ändern: Wechsle dafür in den Bereich Tabellen (in der Verwaltung). Dort fügst du Zeilen hinzu, änderst Werte oder löschst Einträge; die Seite zeigt die Tabelle danach automatisch aktuell an. Ausführlich unter Listen & Tabellen.

Vorteil: Eine Preis- oder Terminänderung pflegst du an einer Stelle, und sie erscheint überall gleich.

Ergebnis prüfen lassen

Aktivierst du „Ergebnis danach ansehen & prüfen" (Augen-Button), sieht sich der Assistent die Seite nach deiner Änderung an und gibt eine kurze Einschätzung, ob sie sichtbar umgesetzt wurde und optisch stimmig wirkt.

Gut zu wissen

• Änderungen sind zunächst ein Entwurf: erst Veröffentlichen macht sie für Besucher sichtbar.
• Hat etwas nicht geklappt, lässt es sich jederzeit rückgängig machen.
• Je konkreter deine Anweisung, desto besser das Ergebnis, siehe Tipps für gute Anweisungen.

Bilder einfügen

Bilder verwaltest du zentral in der Mediathek und setzt sie dann auf deinen Seiten ein.

Bilder hochladen

In der Verwaltung unter Bilder: Dateien per Drag & Drop ablegen oder anklicken zum Auswählen. Die Bilder werden automatisch fürs Web optimiert (Größe/Qualität), du musst nichts vorbereiten.

Bild auf einer Seite einfügen

Im Studio:

1. Auf „Bild aus Mediathek" klicken.
2. Bild auswählen.
3. Optional vorher die Stelle markieren, an die das Bild soll.

Alternativ kannst du in deiner Anweisung beschreiben, wo das Bild hin soll („Füge unter der Überschrift das Team-Foto ein").

Bild-Adresse kopieren

Jedes Bild in der Mediathek hat „URL kopieren": praktisch, wenn du z. B. ein Vorschau-Bild fürs Teilen (siehe Titel, Beschreibung & Teilen-Vorschau) setzen willst.

Tipp: Sprechende Dateinamen (z. B. team-mueller.jpg) helfen dir, Bilder später wiederzufinden.

Tipps für gute Anweisungen

Je klarer du beschreibst, was du willst, desto besser das Ergebnis. Ein paar Faustregeln:

Konkret sein

• Gut: „Ändere die Überschrift im Kopfbereich in Willkommen bei Müller."
• Weniger gut: „Mach die Überschrift schöner."

Eine Sache pro Schritt

Mehrere kleine, klare Anweisungen nacheinander sind besser als eine lange. Du kannst dich wie in einem Gespräch vorarbeiten.

Sagen, wo es ist

Markiere das Element auf der Seite oder nenne den Ort („im Footer", „beim Kontakt-Block"). Wenn ein Wort mehrfach vorkommt, ist das Markieren am sichersten.

Das Ziel beschreiben, nicht die Technik

Sag, was anders sein soll („dezenter", „mehr Abstand darunter", „in Markenblau", „soll sich abwechseln"), nicht wie es technisch umgesetzt wird. Studio erkennt selbst, ob dafür Text, Gestaltung, ein neuer Abschnitt oder ein kleines Skript nötig ist.

Beispiele

• Text: „Schreibe den Einleitungstext freundlicher und kürzer."
• Aussehen: „Mach den Kontakt-Button etwas größer und in Blau."
• Bild: „Ersetze das erste Absatz-Bild durch das neue Logo aus der Mediathek."
• Struktur: „Füge vor dem Fußbereich einen Abschnitt mit einem kurzen Fazit ein."
• Verhalten: „Die Überschrift soll alle 3 Sekunden zwischen drei Varianten wechseln."

Hat das Ergebnis nicht gepasst? Einfach nachschärfen („etwas dunkler") oder rückgängig machen und neu formulieren.

Seiten verwalten

In der Verwaltung unter Seiten organisierst du die Struktur deiner Website.

Was du tun kannst

• Neue Seite anlegen.
• Duplizieren: eine bestehende Seite als Vorlage kopieren.
• Bearbeiten: Titel, Adresse (URL), Meta-Daten (siehe Titel, Beschreibung & Teilen-Vorschau).
• Umbenennen / Adresse ändern: die internen Verlinkungen werden automatisch mitgezogen.
• Als Startseite festlegen.
• Reihenfolge anpassen.
• Löschen.

Unterordner

Eine Adresse darf einen Ordner enthalten, z. B. de/kontakt, praktisch für mehrsprachige oder gegliederte Websites.

Die Startseite ist die Seite, die Besucher unter deiner Hauptadresse (/) sehen.

Titel, Beschreibung & Teilen-Vorschau

Hier legst du fest, wie eine Seite bei Google und beim Teilen (WhatsApp, Facebook, LinkedIn) erscheint. Zu finden pro Seite über Seiten → Bearbeiten.

Adresse

• Titel: erscheint im Browser-Tab und als Überschrift im Google-Treffer.
• Adresse (URL): z. B. leistungen oder mit Ordner de/kontakt. Wenn du sie änderst, werden die internen Verlinkungen automatisch mitgezogen.
• Als Startseite: legt fest, welche Seite ganz vorne (unter /) erscheint.
• Reihenfolge im Menü: bestimmt die Sortierung.

Suchmaschinen

• Beschreibung: der kurze Text unter dem Titel im Suchergebnis (rund 150 bis 160 Zeichen sind ideal).
• Von Suchmaschinen ausschließen: falls eine Seite nicht bei Google auftauchen soll.

Erweitert: Canonical & Teilen-Vorschau

Die selteneren Einstellungen sind unter Erweitert eingeklappt, damit die Maske übersichtlich bleibt. Dort findest du:

• Canonical-URL: nur nötig, wenn derselbe Inhalt unter mehreren Adressen erreichbar ist.
• Teilen-Vorschau (Social Media): Wenn jemand deine Seite teilt, erscheint eine Vorschau mit Bild + Text.
• Vorschau-Titel / Vorschau-Text: übernehmen Titel und Beschreibung, wenn du sie leer lässt.
• Vorschau-Bild: das Bild, das beim Teilen gezeigt wird. Die Bild-Adresse kopierst du aus der Mediathek.

Automatische Prüfung beim Veröffentlichen

Du musst nicht daran denken, alles korrekt auszufüllen: Beim Veröffentlichen prüft Studio deine Seiten automatisch und meldet, was fehlt oder auffällt, etwa ein fehlender Titel, eine fehlende Beschreibung, ein doppelter Titel auf mehreren Seiten oder ein Bild ohne Alt-Text. Der Bericht ist ein Hinweis und blockiert das Veröffentlichen nicht. Details unter Vorschau & Veröffentlichen.

Tipp: Ein gutes Vorschau-Bild und eine knackige Beschreibung sorgen dafür, dass geteilte Links mehr angeklickt werden.

Module (Neuigkeiten, Leistungen, Team …)

Ein Modul ist ein wiederkehrender Inhaltstyp deiner Website, zum Beispiel Neuigkeiten, Blog, Leistungen, Referenzen oder Team. Jedes Modul hat zwei Teile:

• eine Übersicht (meist Karten), die automatisch alle Einträge zeigt, und
• pro Eintrag eine eigene Detailseite.

Wichtig: Jeder Eintrag ist eine echte, vollwertige Seite mit eigener Adresse, eigenem Titel und eigener Meta-Beschreibung, also voll suchmaschinen­tauglich. Du bearbeitest einen Eintrag genau wie jede andere Seite im Studio.

Zu finden im Bereich Module (eigenes Symbol in der oberen Leiste) unter Module.

Ein Modul anlegen

1. Im Bereich Module auf Module gehen.
2. Unter Neues Modul anlegen einen Namen vergeben, z. B. Neuigkeiten.
3. Anlegen. Das Modul bekommt automatisch eine eigene Adresse (z. B. /neuigkeiten).

Einträge (Beiträge) pflegen

Öffne ein Modul, dann siehst du die Liste seiner Einträge. Pro Eintrag kannst du:

• + Neuer Beitrag: legt einen neuen Eintrag als echte Seite an und öffnet ihn direkt im Studio, wo du Text, Bilder und Layout wie gewohnt per Anweisung bearbeitest.
• Seite bearbeiten: den Beitrag im Studio öffnen.
• Daten bearbeiten: Titel, Datum und die Attribute des Beitrags (siehe unten) setzen.
• Veröffentlichen / Zurückziehen: jeder Beitrag hat einen eigenen Status (Entwurf oder veröffentlicht), unabhängig von den anderen. Ein Entwurf taucht nicht in der Übersicht auf.

Löschst du ein ganzes Modul, bleiben die Eintragsseiten als normale Seiten erhalten, nur die Gruppierung geht weg.

Attribute (strukturierte Felder)

Über den Reiter Admin (im geöffneten Modul) kannst du einem Modul Attribute geben, also feste Felder, die jeder Eintrag hat, z. B. bei „Team" ein Feld Position und E-Mail, oder bei „Neuigkeiten" ein Datum. Attribute lassen sich zu Gruppen zusammenfassen. So bleiben gleichartige Einträge einheitlich, und die Werte lassen sich auf der Seite gezielt anzeigen.

Wie es auf der Website erscheint

Die Übersicht wird dort eingesetzt, wo im Seiten-HTML ein Sammlungs-Platzhalter steht, sie füllt sich automatisch mit den (veröffentlichten) Einträgen. Neue Beiträge erscheinen also von selbst in der Liste, du musst die Übersicht nie von Hand pflegen.

Wann Modul, wann Tabelle?

• Modul: wenn jeder Eintrag eine eigene Seite braucht (Artikel, Referenz, Team-Profil), die man einzeln aufrufen, verlinken und bei Google finden kann.
• Tabelle: wenn sich Inhalte nur auf einer Seite wiederholen und keine eigene Detailseite brauchen (Preisliste, Leistungen, Termine). Öffnungszeiten pflegst du im Plugin Öffnungszeiten, Urlaube unter Ankündigungen.

Zentrale Navigationen (Menüs)

Eine Navigation ist ein zentrales Menü (Kopf, Fuß, …), das du einmal pflegst und auf beliebig vielen Seiten einsetzt. Der Vorteil: Das Menü ist überall identisch, und wenn du einen Punkt hinzufügst oder umbenennst, ändert es sich auf allen Seiten gleichzeitig, kein Nachziehen von Hand, kein Auseinanderdriften.

Zu finden im Bereich Module (eigenes Symbol in der oberen Leiste) unter Navigationen.

So funktioniert es

Eine Navigation wird über einen leeren Platzhalter in die Seite eingebunden, z. B. <nav data-nav="haupt"></nav>. Beim Ausliefern füllt SmartStudio ihn serverseitig mit den Menüpunkten. Dabei wird der aktuelle Menüpunkt automatisch markiert (aktiver Zustand), das musst du nicht selbst pflegen.

Menüpunkte

Im geöffneten Menü legst du die Punkte an: Beschriftung, Ziel (eine deiner Seiten oder ein externer Link) und die Reihenfolge. Weil die Navigation zentral ist, genügt eine Änderung hier, damit sie überall wirkt.

Optional bekommt ein Punkt ein rel-Attribut, z. B. nofollow für einen Link auf einen Bereich, den Suchmaschinen nicht aufnehmen sollen (etwa einen Pressebereich mit „noindex“). Erlaubt sind die üblichen Werte wie nofollow, noopener, sponsored.

Gut zu wissen

• Die Reihenfolge deiner Seiten (per Ziehen in der Seitenliste) wirkt ebenfalls auf automatische Navigationen.
• Menüs im Kopf und Fuß können zwei verschiedene Navigationen sein, du bindest sie über unterschiedliche Platzhalter (data-nav) ein.
• Verwandt: Die Bereiche machen dasselbe für ganze HTML-Bausteine (z. B. den kompletten Kopf- oder Fußbereich).

Zentrale Bereiche (Kopf, Fuß …)

Ein Bereich ist ein wiederverwendbarer HTML-Baustein, den mehrere Seiten teilen, typisch der Kopfbereich (Header) und der Fußbereich (Footer), aber auch eine Seitenleiste oder ein Kontaktblock. Du pflegst ihn zentral an einer Stelle, und er ist auf allen Seiten identisch.

Zu finden im Bereich Module (eigenes Symbol in der oberen Leiste) unter Bereiche.

So funktioniert es

Ein Bereich wird über einen leeren Platzhalter eingebunden, z. B. <footer data-partial="fuss"></footer>. Beim Ausliefern füllt SmartStudio ihn serverseitig mit dem zentralen Inhalt. Änderst du den Bereich, ändert sich die „Hülle" auf allen Seiten gleichzeitig.

Bereich vs. Navigation

• Bereich: ein ganzer HTML-Baustein (der komplette Kopf mit Logo, Menü, Buttons …).
• Navigation: nur die Menü-Punkte, die oft innerhalb eines Bereichs sitzen.

Ein typischer Aufbau: ein zentraler Kopf-Bereich, in dem wiederum eine zentrale Navigation steckt.

Gut zu wissen

• Gesperrte Bausteine (Bereiche, Navigationen, Datenbindungen) sind im Editor mit einem gestrichelten Rahmen als Funktionsbaustein markiert. Sie werden nicht direkt auf der Seite bearbeitet, sondern zentral hier bzw. unter Navigationen.
• Weil ein Bereich zentral ist, brauchst du Kopf und Fuß nur einmal anzupassen, nicht auf jeder Seite neu.

Plugins (Erweiterungen)

Plugins sind fertige Funktionen, die du für deine Website einschaltest: ein Kontaktformular, Öffnungszeiten mit „Jetzt geöffnet“, eine Hinweisleiste, eine Bildergalerie und mehr. Sie laufen direkt in SmartStudio, ohne fremde Dienste und ohne Cookies.

Zu finden in der Verwaltung unter Plugins.

Ein- und ausschalten

In der Liste siehst du alle verfügbaren Plugins mit Version. Mit Aktivieren bzw. Deaktivieren schaltest du ein Plugin für deine Website ein oder aus. Hat ein Plugin Einstellungen, öffnest du sie über Einstellungen in derselben Zeile; nach dem Speichern wirken sie sofort.

Core-Plugins (Module, Bereiche, Navigation, Snippets, Live-Daten, aktuelle Jahreszahl) sind Grundfunktionen und standardmäßig an. Du kannst sie abschalten, wenn deine Website sie nicht nutzt.

Wo ein Plugin erscheint

Die meisten Plugins erscheinen an einer bestimmten Stelle einer Seite. Diese Stelle ist ein Platzhalter, z. B. <div data-plugin="opening-hours"></div> für die Öffnungszeiten. Beim Ausliefern setzt SmartStudio dort den fertigen Inhalt ein, für Besucher und Suchmaschinen gleichermaßen sichtbar.

• Den Platzhalter richtet deine Betreuung einmal ein, oder du bittest im Studio darum, z. B. „Füge unter dem Text den Platzhalter für die Öffnungszeiten ein“.
• Steht der Platzhalter in einem Bereich (etwa im Fußbereich), erscheint das Plugin auf allen Seiten.
• Manche Plugins brauchen keinen Platzhalter, weil sie auf jeder Seite wirken (Hinweisleiste, Strukturierte Daten, Karten-Freigabe, schwebender WhatsApp-Knopf).

Die Plugins im Einzelnen

Kontaktformular

Formular mit Name, E-Mail und Nachricht, das als E-Mail bei dir ankommt. Platzhalter contact-form. - Einstellungen: Empfänger-E-Mail (Pflicht), Betreff-Präfix, Danke-Text nach dem Absenden. - Eigenes Formular übernehmen: Ein bereits gestaltetes Formular deiner Website kann das Plugin übernehmen (<form data-plugin="contact-form">). Aussehen und Felder bleiben, alle Felder kommen mit ihrer Beschriftung in der Mail an. - Spam-Schutz ist eingebaut: ein unsichtbares Feld für Bots, eine Mindest-Ausfüllzeit, eine Begrenzung pro Stunde und ein Filter für Nachrichten mit mehreren Links. Ein Captcha oder Cookie ist nicht nötig. - Werbe-Filter: Anfragen, die eindeutig Werbung sind (z. B. englische SEO-Angebote mit Preis pro Monat), werden verworfen; Grenzfälle kommen mit „[Verdacht auf Werbung]“ im Betreff an. In den Einstellungen kannst du eigene Sperrwörter eintragen (ein Treffer genügt zum Verwerfen) oder den Filter abschalten. Das gilt auch für die Terminanfrage. - Der Absender bekommt keine automatische Kopie; so lässt sich das Formular nicht missbrauchen, um über deine Website Mails an fremde Adressen zu schicken.

Terminanfrage

Anfrage mit Wunschdatum, Wunschzeit und Leistung; du bestätigst den Termin selbst. Platzhalter booking-request. - Einstellungen: Empfänger-E-Mail, Leistungen zur Auswahl, frühester Termin (in Tagen), Danke-Text. - Kann wie das Kontaktformular ein vorhandenes Formular übernehmen.

Öffnungszeiten

Tabelle der Öffnungszeiten mit Live-Hinweis „Jetzt geöffnet / geschlossen“; Suchmaschinen bekommen die Zeiten maschinenlesbar. Platzhalter opening-hours. - Einstellungen: Wochenzeiten (je Tag ein oder mehrere Zeiträume), Ausnahmen (Datum geschlossen oder mit anderen Zeiten), Zeitzone, Status anzeigen, Suchmaschinen-Daten einbetten. - Die Öffnungszeiten pflegst du hier, nicht in einer Tabelle.

Ankündigungen: Hinweisleiste, Schließ-Hinweis, Abwesenheiten

Für Urlaub, Betriebsferien oder Aktionen gibt es drei Plugins, die zusammenarbeiten. Die Zeiträume pflegst du einmal unter Module → Ankündigungen. - Hinweisleiste: schmale Leiste oben oder unten auf allen Seiten, für Besucher schließbar. Text und Zeitraum kommen aus der aktuellen Ankündigung; in den Einstellungen legst du Position, Farben und einen optionalen Link fest. Steht keine Ankündigung an, kann die Leiste einen eigenen Text aus den Einstellungen zeigen (mit „anzeigen ab / bis“). - Schließ-Hinweis (Popup): zeigt während einer aktiven Ankündigung einmal ein Fenster mit Zeitraum, „ab wann wieder geöffnet“ (aus den Öffnungszeiten) und einem eigenen Hinweis, z. B. zur Vertretung. Texte frei einstellbar. - Abwesenheiten (Tabelle): listet geplante Abwesenheiten als Tabelle auf einer Seite. Platzhalter vacation-table.

FAQ

Aufklappbare Fragen und Antworten, gepflegt unter Module → FAQ. Platzhalter faq-accordion. - Einstellungen: erste Frage geöffnet anzeigen, FAQ für Suchmaschinen kennzeichnen.

Stellenangebote

Offene Stellen als Liste, gepflegt unter Module → Stellen; Google Jobs erkennt sie automatisch. Platzhalter job-postings. - Einstellungen: Einleitung, Arbeitgeber, Standard-Arbeitsort, Bewerbungs-E-Mail, optional WhatsApp-Nummer für Bewerbungen, Text bei „keine offenen Stellen“, immer aufgeklappt. - Nur bei offenen Stellen zeigen: Bekommt der umgebende Abschnitt (z. B. der Stellen-Hinweis auf der Startseite) das Attribut data-jobs-section, fällt er ohne offene Stelle ganz weg, samt Überschrift und Link.

Bildergalerie

Bilder-Raster mit Vergrößerung per Klick, aus einem Ordner deiner Bilder. Platzhalter image-gallery. - Einstellungen: Ordner, Spalten, Abstand, Vergrößerung an/aus, Bilder erst beim Scrollen laden.

Karten-Freigabe (Datenschutz)

Google-Maps-Karten werden erst nach einem Klick geladen. Bis dahin sieht der Besucher einen Hinweis und einen Knopf; so brauchst du für die Karte keinen Cookie-Banner. Wirkt automatisch auf alle eingebetteten Google-Maps-Karten. - Einstellungen: Hinweistext, Knopf-Text, Zustimmung für spätere Besuche merken.

Social-Links

Leiste mit Symbolen zu deinen Profilen (Instagram, Facebook, LinkedIn, YouTube …), ohne Tracking. Platzhalter social-links. - Einstellungen: Profil-Adressen, Darstellung, Symbolgröße.

WhatsApp-Kontakt

Knopf, der einen WhatsApp-Chat mit deiner Nummer öffnet: an einer Stelle der Seite (Platzhalter whatsapp) und/oder schwebend unten rechts auf allen Seiten. - Einstellungen: Nummer (international, ohne + und Leerzeichen), Knopf-Text, vorausgefüllte Nachricht, schwebender Knopf an/aus.

Strukturierte Daten

Gibt Suchmaschinen und KI-Assistenten deine Firmendaten maschinenlesbar mit (Name, Adresse, Telefon, Logo, Profile), dazu den Seitenpfad („Brotkrümel“). Wirkt auf allen Seiten, kein Platzhalter nötig. - Einstellungen: Art (Unternehmen vor Ort oder Organisation), Name, Adresse, Telefon, E-Mail, Koordinaten, Logo, Profil-Adressen.

Aktuelle Jahreszahl (Core)

Hält die Jahreszahl aktuell, z. B. im Copyright des Fußbereichs: <span data-current-year></span> ergibt immer das aktuelle Jahr, <span data-current-year="2006"></span> einen Zeitraum wie „2006–2026“.

Module, Bereiche, Navigation, Snippets, Live-Daten (Core)

Diese Grundfunktionen haben eigene Kapitel: Module, Bereiche, Navigationen, Code-Snippets und Listen & Tabellen bzw. Datenquellen (Live-Daten).

Gut zu wissen

• Ein abgeschaltetes Plugin verschwindet von der Website; der Platzhalter bleibt unsichtbar stehen. Schaltest du es wieder ein, ist alles wie vorher, auch die Einstellungen.
• Neue Plugins kommen mit Updates dazu. Brauchst du eine Funktion, die es noch nicht gibt, sag deiner Betreuung Bescheid.

Formulare & Funktionsbausteine

Manche Bereiche einer Website sind nicht nur Text, sondern funktionieren: z. B. ein Kontaktformular. Solche Bereiche sind in SmartStudio Funktionsbausteine.

Was das bedeutet

• Funktionsbausteine bleiben geschützt: Beim Bearbeiten von Inhalten werden sie nicht versehentlich kaputt gemacht.
• Sie laufen weiter wie gewohnt (z. B. ein Formular versendet weiterhin E-Mails).

Einfügen

Im Studio über „Funktion" wählst du einen vorhandenen Funktionsbaustein und platzierst ihn auf der Seite.

Rundherum bearbeiten

Texte, Bilder und Layout um einen Funktionsbaustein herum kannst du ganz normal anpassen, nur der Baustein selbst bleibt unangetastet.

Kontaktformular und Terminanfrage

Für die häufigsten Formulare gibt es fertige Plugins: das Kontaktformular und die Terminanfrage. Du schaltest sie unter Plugins ein und stellst dort Empfänger-Adresse und Danke-Text selbst ein. Spam-Schutz ist eingebaut, ein Captcha brauchst du nicht.

Wenn du ein anderes Formular oder eine Spezialfunktion brauchst, sag deiner Betreuung Bescheid, solche Bausteine werden einmal eingerichtet und stehen dir dann zur Verfügung.

Listen & Tabellen

Für wiederkehrende Inhalte (Team-Mitglieder, Leistungen, Preise) gibt es Listen/Tabellen. Du pflegst die Inhalte an einer Stelle, und sie erscheinen überall dort, wo sie eingebunden sind.

Vorteil

• Eine Änderung (z. B. neuer Preis) genügt, sie wirkt überall.
• Konsistente Darstellung, kein Copy-&-Paste über viele Seiten.

So geht's grob

1. Im Bereich Module unter Tabellen eine Liste anlegen und Einträge pflegen.
2. Die Liste auf einer Seite einbinden (über „Daten" im Studio).

Ideal für alles, was sich öfter ändert oder mehrfach auftaucht. Einmalige Texte schreibst du einfach direkt auf der Seite.

Datenquellen (externe APIs)

Über Datenquellen bindest du eine externe JSON-API als benannte Quelle an, zum Beispiel einen Wetterdienst, Wechselkurse oder einen Veranstaltungs-Feed. Die Daten werden serverseitig geholt und zwischengespeichert (gecacht).

Zu finden in der Verwaltung unter API.

Vorteile

• API-Schlüssel bleiben versteckt: der Aufruf passiert am Server, nicht im Browser des Besuchers.
• Umgeht CORS: auch APIs, die sich sonst nicht direkt aus einer Website aufrufen lassen, funktionieren.
• Gecacht: die Quelle wird nicht bei jedem Seitenaufruf neu abgefragt, das schont die API und beschleunigt die Seite. Die Cache-Dauer legst du je Quelle fest.

Anlegen

Du gibst der Quelle einen Namen, die URL der API, optional Header (z. B. für einen API-Schlüssel) und die Cache-Dauer. Danach steht sie zum Einbinden bereit.

Abgrenzung

• Datenquelle: Daten aus einem fremden System (live über eine API).
• Tabelle: Daten, die du selbst in SmartStudio pflegst.

Suchmaschinen & KI (robots.txt, Sitemap, llms.txt)

Während du Titel und Beschreibung pro Seite unter Titel, Beschreibung & Teilen-Vorschau pflegst, findest du hier die seitenweiten Einstellungen für Suchmaschinen und KI-Assistenten.

Zu finden in der Verwaltung unter SEO & LLM.

robots.txt

Wird unter /robots.txt ausgeliefert und sagt Suchmaschinen, was sie crawlen dürfen. Du kannst den Inhalt direkt bearbeiten und speichern. Feld leeren und speichern setzt auf den sinnvollen Standard zurück.

Sitemap

SmartStudio stellt automatisch eine Sitemap bereit (eine Liste aller öffentlichen Seiten), damit Suchmaschinen die Website vollständig erfassen. Seiten mit noindex bleiben außen vor.

llms.txt (für KI-Assistenten)

Ergänzend zur robots.txt gibt es eine llms.txt, eine strukturierte Kurzfassung deiner Website speziell für KI-Assistenten (wie ChatGPT-Websuche). So können KI-Systeme deine Inhalte sauberer erfassen und korrekt wiedergeben, ein wachsender Kanal neben der klassischen Google-Suche.

Strukturierte Daten

Mit dem Plugin Strukturierte Daten bekommen Suchmaschinen und KI-Assistenten deine Firmendaten maschinenlesbar mit: Name, Adresse, Telefon, Logo und deine Profile, dazu den Seitenpfad. Einige andere Plugins liefern das für ihren Bereich automatisch mit (Öffnungszeiten, FAQ, Stellenangebote).

Seiten von der Indexierung ausschließen

Eine Übersicht listet alle Seiten mit ihrem noindex-Status. Hier siehst du auf einen Blick, welche Seiten nicht bei Google erscheinen sollen (z. B. Danke-Seiten, interne Seiten), und kannst es zentral steuern.

Beim Veröffentlichen prüft SmartStudio ohnehin automatisch, ob Titel und Beschreibungen fehlen oder doppelt sind.

Code-Snippets (Analytics & Co.)

Code-Snippets sind kleine Code-Bausteine, die auf jeder veröffentlichten Seite automatisch mit ausgeliefert werden, ohne dass du sie in die einzelnen Seiten einbauen musst. Typische Fälle:

• Statistik / Analytics (z. B. Matomo, Plausible),
• Schriften (Webfonts),
• ein Verifizierungs-Tag (z. B. für Google Search Console).

Zu finden in der Verwaltung unter Snippets.

Head oder Body

• Head-Code landet vor </head> (z. B. Schriften, Meta-/Verifizierungs-Tags).
• Body-Code landet vor </body> (z. B. Analytics-Skripte).

Gut zu wissen

• Im Editor wird dieser Code nicht angezeigt, nur auf der Live-Seite, damit das Bearbeiten übersichtlich bleibt.
• Weil es seitenweit gilt, pflegst du z. B. den Analytics-Code einmal und er wirkt auf der ganzen Website.
• Analytics-Skripte bleiben beim Aufräumen vor dem Veröffentlichen unangetastet.

Fehlende Seiten & Weiterleitungen (404 / 301)

Hier siehst du aufgerufene Adressen, die es auf deiner Website nicht (mehr) gibt (404-Fehler), lässt sie dir von der KI einordnen und richtest dafür bei Bedarf Weiterleitungen ein. Besonders wertvoll beim Relaunch: alte URLs laufen sonst ins Leere, samt ihres Google-Rankings.

Der Ablauf hat drei Stufen: Bot-Rauschen wird automatisch herausgefiltert, was übrig bleibt ordnet die KI auf Nachfrage ein, und entscheiden tust du (weiterleiten oder ignorieren).

Zu finden in der Verwaltung unter Fehlende Seiten.

Bot-Rauschen wird ausgefiltert

Offensichtliche Bot- und Scanner-Zugriffe (Suche nach WordPress, .php-Abfragen, Versuche auf .env, .git, phpmyadmin usw.) werden automatisch herausgefiltert. In der Liste stehen also die echten Fehltreffer, nicht das ständige Hintergrundrauschen des Internets, damit du dich auf die relevanten URLs konzentrieren kannst.

Weiterleitung direkt aus der Liste

Neben jeder fehlenden Seite trägst du einfach ein Ziel ein und legst mit einem Klick eine 301-Weiterleitung an. Beim nächsten Aufruf dieser alten Adresse wird der Besucher (und Google) dauerhaft auf das neue Ziel geleitet.

Einträge dauerhaft ignorieren

Nicht jeder Eintrag ist ein Problem. Adressen wie /favicon.ico fragt jeder Browser von sich aus ab, ganz ohne dass jemand darauf verlinkt hat. Willst du so einen Eintrag nicht mehr sehen, klick auf den Papierkorb in der Zeile: der Pfad verschwindet dauerhaft aus der Liste und taucht auch bei neuen Aufrufen nicht wieder auf. Verklickt? Unter der Liste erscheint dann „N ignoriert · wieder anzeigen", damit kommt alles zurück.

404-Einträge von der KI auswerten und einordnen

Eine Liste von URLs sagt dir noch nicht, was zu tun ist. Genau das übernimmt der KI-Assistent: rechts unten das runde Sprechblasen-Symbol (wie im Studio-Editor), das ein Chatfenster öffnet.

Er kennt den Zusammenhang, nicht nur die einzelne Adresse: die protokollierten Einträge samt Aufrufzahlen, die Seiten, die es auf deiner Website wirklich gibt, und die bereits eingerichteten Weiterleitungen.

Einordnen heißt: Er sortiert einen Eintrag in eine von vier Kategorien und leitet daraus die Empfehlung ab.

Fragen kannst du frei, z. B. „Was bedeutet /favicon.ico?", „Was soll ich weiterleiten?" oder „Was kann ich gefahrlos ignorieren?". Am schnellsten geht es über das Fragezeichen in einer Zeile: das öffnet den Assistenten und fragt sofort zu genau diesem Pfad.

Zwei Dinge, auf die du dich verlassen kannst:

• Als Ziel schlägt er nur Seiten vor, die es bei dir wirklich gibt. Er erfindet keine Seiten, und wenn kein passendes Ziel existiert, sagt er das.
• Er empfiehlt nur, er ändert nichts. Weiterleiten und Ignorieren bleiben dein Klick. Ein hoher Aufrufzähler heißt übrigens nicht „wichtig", das sind oft Bots.

Weiterleitungen verwalten

Im Bereich Weiterleitungen siehst du alle Regeln, wie oft sie schon gegriffen haben (Treffer-Zähler), und kannst sie löschen. Weiterleitungen kannst du auch vorausschauend anlegen, bevor überhaupt ein 404 aufgetreten ist, etwa direkt beim Relaunch, wenn du die alten Adressen ohnehin kennst:

• Von: der alte Pfad, z. B. /alte-seite.
• Nach: ein interner Pfad (/neue-seite) oder eine vollständige Adresse (https://…).
• Code: 301 (dauerhaft) für einen echten Umzug (empfohlen, Google überträgt das Ranking) oder 302 (temporär).

Die Weiterleitung wird beim Aufruf vor der 404-Meldung angewandt.

Gut zu wissen

• Aus Sicherheitsgründen sind als Ziel nur interne Pfade und http(s)-Adressen erlaubt, kein javascript: o. Ä.
• Eine Weiterleitung auf sich selbst (Schleife) wird abgelehnt.
• Steht bei den fehlenden Seiten „Noch keine protokolliert", ist das ein gutes Zeichen.

Website übernehmen (Import)

Damit du eine bestehende Website in SmartStudio bearbeiten kannst, muss sie einmal übernommen werden. Danach läuft sie ganz normal weiter, nur eben editierbar.

Zu finden in der Verwaltung unter Import.

Zwei Wege

• Zentrale Übernahme (üblich): In der Regel richtet deine Betreuung die Übernahme zentral ein, sie spiegelt die bestehende Seite vom Server, importiert sie und installiert SmartStudio. Für dich ist danach einfach alles da.
• ZIP hochladen: Alternativ kannst du im Import-Bereich ein ZIP deiner statischen Website (HTML/CSS/JS, Bilder) per Ziehen ablegen oder auswählen. SmartStudio übernimmt die Seiten daraus.

Was bei der Übernahme passiert

• Die vorhandenen Seiten werden zu editierbaren SmartStudio-Seiten.
• Wiederkehrende Hüllen wie Kopf und Fuß lassen sich anschließend als zentrale Bereiche auslagern, Menüs als zentrale Navigationen.
• Bestehende Funktionen (z. B. ein Kontaktformular) bleiben als Funktionsbausteine erhalten.

Eigene Zusatzdateien (z. B. ein spezielles Skript im Web-Verzeichnis) werden zentral verwaltet, damit sie eine Übernahme oder ein Update überstehen. Sprich das bei Bedarf mit deiner Betreuung ab.

Diagnose (technische Prüfung)

Die Diagnose ist ein technischer Bereich, der zeigt, was der Assistent zuletzt wirklich getan hat, vor allem bei Code-Änderungen. Sie ist nützlich, wenn eine Änderung einmal nicht wie erwartet gegriffen hat, und richtet sich eher an technisch Interessierte oder die Betreuung.

Zu finden in der Verwaltung unter Diagnose.

Was du hier siehst

• Echte Änderung vs. „nur Text": ob der Assistent tatsächlich eine Datei geändert hat (Tool-Aufruf) oder nur geantwortet hat (das würde nichts verändern).
• Welche Ersetzung er vornehmen wollte und ob die Stelle gefunden wurde (Geändert vs. nicht gefunden).

Wann das hilft

• Wenn du sagst „das hat sich nicht geändert" und verstehen willst, woran es lag.
• Als Beleg für die Betreuung, um ein Problem schnell einzugrenzen.

Für den Alltag brauchst du die Diagnose nicht, sie ist ein Werkzeug für den Ausnahmefall.

Vorschau & Veröffentlichen

Deine Änderungen sind zunächst ein Entwurf: nur du siehst sie. Erst beim Veröffentlichen werden sie für Besucher live.

Der Ablauf

1. Bearbeiten: Änderungen vornehmen (Entwurf).
2. Prüfen: die Vorschau zeigt dir, wie es aussieht.
3. Veröffentlichen: Studio räumt auf, prüft die Seiten und du gibst frei.

Aufräumen & Veröffentlichen

Wenn du auf Veröffentlichen klickst, öffnet sich ein Fenster und Studio geht deine Seiten einmal durch. Das dauert einen Moment, du siehst am laufenden Ring, dass es arbeitet.

1. Aufräumen. Studio schiebt Gestaltungs- und Skript-Reste, die im Lauf der Zeit direkt in den Seiten gelandet sind, an ihren richtigen Platz (in die Stil- bzw. Skript-Datei). Analyse-Skripte wie Matomo bleiben unangetastet.

Sicherheitsnetz: Studio vergleicht die Seite vorher/nachher optisch. Würde das Aufräumen das Aussehen verändern, lässt es die Seite lieber unverändert.

2. Prüfen (SEO & Barrierefreiheit). Danach schaut sich Studio jede Seite an und meldet, was auffällt:

• Suchmaschinen: fehlender Titel oder fehlende Beschreibung, doppelte Titel auf mehreren Seiten, keine oder mehrere H1-Überschriften, Sprünge in den Überschriften-Ebenen, interne Links, die ins Leere zeigen, vergessener Platzhaltertext.
• Barrierefreiheit: Bilder ohne Alt-Text, Formularfelder ohne Beschriftung, Buttons oder Links ohne erkennbaren Namen (typisch bei reinen Icon-Links), nichtssagende Linktexte („hier klicken"), Tabellen ohne Kopfzeile.

Du bekommst einen kurzen Bericht, sortiert nach Fehler und Warnung.

3. Veröffentlichen. Der Bericht ist ein Hinweis, keine Sperre: der Knopf „Jetzt veröffentlichen" bleibt aktiv. Du entscheidest, ob du zuerst nachbesserst oder direkt live gehst.

Nur diese Seite oder alles

Gibt es auch auf anderen Seiten noch unveröffentlichte Änderungen, fragt Studio beim Veröffentlichen nach: Nur diese Seite oder Alle veröffentlichen. Die anderen Seiten werden dabei mit Namen genannt, damit nichts Halbfertiges versehentlich live geht. Geänderte Stylesheets und Skripte gelten für die ganze Website und gehen in beiden Fällen mit.

Gut zu wissen

• Du kannst mehrere Änderungen sammeln und dann gemeinsam veröffentlichen.
• Nichts ist endgültig: Veröffentlichtes lässt sich erneut ändern oder rückgängig machen.
• Die gemeldeten Punkte lassen sich meist direkt im Studio beheben, z. B. „Gib dem Bild im Kopfbereich einen Alt-Text" oder „Ergänze eine Beschreibung für diese Seite".

Trau dich auszuprobieren, solange du nicht veröffentlichst, ist die Live-Seite unverändert.

Änderungen rückgängig machen

Kein Grund zur Sorge, fast alles lässt sich zurücknehmen.

Während des Bearbeitens

Im Studio gibt es Rückgängig (und Wiederherstellen), um Schritte vor- und zurückzugehen, wie in einem Textprogramm.

Nach dem Veröffentlichen

Auch veröffentlichte Stände kannst du wieder ändern. Über den Verlauf einer Seite kommst du zu früheren Versionen zurück.

Wenn etwas „weg" scheint

• Prüfe, ob du auf der richtigen Seite bist.
• Hast du veröffentlicht? Entwürfe sieht nur du.
• Im Zweifel: Rückgängig oder die Betreuung fragen.

Weil Entwurf und Live getrennt sind, kann beim Ausprobieren nichts „live" kaputtgehen.

Häufige Fragen

Ich habe aus Versehen etwas verändert, wie mache ich es rückgängig? Nutze Rückgängig im Studio, oder gehe über den Verlauf der Seite zu einer früheren Version zurück. Siehe Änderungen rückgängig machen.

Meine Änderung ist auf der Website nicht zu sehen. Wahrscheinlich ist sie noch ein Entwurf: klicke Veröffentlichen. Lade die Seite danach neu.

Muss ich Bilder vorher verkleinern? Nein. Lade sie einfach in die Mediathek: sie werden automatisch optimiert.

Wie ändere ich, welche Seite die Startseite ist? Unter Seiten die gewünschte Seite bearbeiten und „Als Startseite" setzen.

Wie erscheint meine Seite bei Google / beim Teilen? Über Seiten → Bearbeiten: Titel, Beschreibung und Vorschau-Bild. Siehe Titel, Beschreibung & Teilen-Vorschau.

Kann ich beim Ausprobieren etwas kaputt machen? Die Live-Seite ändert sich erst beim Veröffentlichen: vorher kannst du gefahrlos testen. Geschützte Bereiche (Formulare) bleiben ohnehin unangetastet.

Die KI hat nicht das gemacht, was ich wollte. Formuliere konkreter oder markiere die Stelle (siehe Tipps für gute Anweisungen), oder mach es rückgängig und versuch es neu.