weboffice.digital - Dokumentation
Branche Beauty Branche Gastro Branche Handel
PDF

Vorlagen bearbeiten

Vorlagen bearbeiten

Ansicht dieser Seite

Hier passt du das Erscheinungsbild einer Website-Vorlage an: Farben, Schriftarten, Logos, Suchmaschinen-Einstellungen und Custom Code. Die Änderungen gelten für alle neuen Seiten, die aus dieser Vorlage erstellt werden.

Voraussetzungen

Du brauchst Zugriff auf die Website und das Recht, Vorlagen zu bearbeiten. Die Vorlage muss bereits existieren.

Aufbau der Bearbeitungsseite

Die Bearbeitungsseite hat drei Registerkarten. Die erste Registerkarte Seiteneinstellungen enthält die Seitenadresse und SEO-Metadaten. Darunter siehst du eine Vorschau, wie die Seite in Google-Suchergebnissen aussieht (wenn deine Website eine Domain hat). Die zweite Registerkarte Globale Einstellungen umfasst Menü-Layout, Website-Logo, Navigations-Logo, Favicon, Google Analytics und globale HTML-Codes. Die dritte Registerkarte Design enthält Farben, Schriftarten, Custom CSS und einen KI-Design-Assistenten.

So gehst du vor

  1. Öffne die Vorlage, die du bearbeiten möchtest.

  2. Wechsle zur Registerkarte Seiteneinstellungen.

  3. Stelle unter Seiteneinstellungen die Adresse ein (falls diese nicht / ist). Du kannst diesen Wert nachträglich noch ändern.

  4. Konfiguriere unter SEO - Suchmaschinen Optimierungen die Metadaten:

    • Meta Title: Der Titel, der in Google-Suchergebnissen angezeigt wird (wird auch als Browser-Registerkarten-Titel verwendet)
    • Meta Description: Die Vorschau-Beschreibung unter dem Titel in den Suchergebnissen

    Beide Felder sind optional.

  5. Wechsle zur Registerkarte Globale Einstellungen.

  6. Unter Layout wählst du die Menü Variante aus. Diese Auswahl bestimmt, wie das Navigationsmenü auf der Website aufgebaut ist.

  7. Unter Website Logo, Navigation Logo und Favicon lädst du deine Bilder hoch:

    • Das Website Logo wird im Header angezeigt
    • Das Navigation Logo wird in der Navigation verwendet
    • Das Favicon ist das kleine Symbol im Browser-Registerkarten

  8. Unter Website Einstellungen trägst du optional ein:

    • Globaler HTML Code: Code, der auf jeder Seite am Ende des <body>-Tags ausgeführt wird (z.B. für Tracking-Pixel)
    • Google Analytics ID: Deine Google Analytics ID, um Besucherzahlen zu tracken

  9. Unter Suchmaschinen trägst du den Markenname der Website ein. Wenn du dieses Feld leer lässt, nutzt Google stattdessen deinen Firmenwortlaut.

  10. Wechsle zur Registerkarte Design.

  11. Im Bereich KI-Design-Assistent (optional): Beschreibe deine Marke oder deinen gewünschten Stil im Textfeld und klicke Theme generieren. Die KI erstellt darauf ein passendes Farbschema und wendet es an.

  12. Im Bereich Einstellungen schaltest du über die Schalter einzelne Design-Features ein oder aus. Jede Einstellung lässt sich mit dem Zurück-Symbol auf ihren Standard-Wert zurücksetzen.

  13. Unter Schriftarten wählst du die Schriftfamilie aus und passt einzelne Schrift-Einstellungen an (z.B. Schriftstärke für Überschriften). Mit dem Zurück-Symbol stellst du jeden Wert auf den Standard zurück.

  14. Unter Farben kannst du jede Farbe der Website individuell einstellen. Klicke auf die Farbfelder, um einen Farbwähler zu öffnen, oder stelle die Farbe direkt über ihren Hex-Wert ein. Mit dem Zurück-Symbol setzt du jede Farbe auf ihren Standard zurück.

  15. Unter Eigenes CSS trägst du Custom CSS ein, um das Design noch feiner anzupassen (z.B. individuelle Abstände oder spezielle Styling-Regeln). Deine Änderungen werden sofort in der Vorschau sichtbar.

  16. Speichere deine Änderungen mit der grünen Schaltfläche Speichern am unteren Rand. Mit der roten Schaltfläche Diese Seite löschen kannst du die Vorlage und alle darin enthaltenen Seiten löschen – das lässt sich nicht rückgängig machen.

Was danach passiert

Deine Einstellungen werden gespeichert. Alle neuen Seiten, die aus dieser Vorlage erstellt werden, verwenden sofort die neuen Farben, Schriftarten, Logos und Suchmaschinen-Einstellungen. Bestehende Seiten werden nicht automatisch angepasst.

Individuelle Änderungen auf einzelnen Seiten überschreiben diese globalen Einstellungen. Du findest deine Vorlagen in der Vorlagen-Verwaltung.

Tipps und Hinweise

  • Wenn du Custom CSS einträgst, achte auf die richtige Syntax. Fehlerhafte CSS-Regeln können das Design beschädigen.
  • Die KI-generierte Farb-Palette wird nur angewendet, wenn du sie bestätigst – es ist nicht destruktiv.
  • Logos sollten nicht zu groß sein: Das Website Logo maximal 1024 px, das Navigation Logo maximal 512 px, das Favicon maximal 256 px.
  • Google Analytics wird erst aktiv, wenn du die Website veröffentlichst.