Odoo Website Builder Vollständiger Leitfaden: Entwerfen, Veröffentlichen und Optimieren

Der Website Builder von Odoo verwandelt Ihr ERP in eine vollständige Webplattform. Im Gegensatz zu eigenständigen Website-Buildern, die separate Integrationen für E-Commerce, CRM-Formulare und Event-Registrierungen erfordern, arbeitet der Builder von Odoo direkt mit Ihren Geschäftsdaten. Produktseiten werden aus Ihrem Inventar entnommen. Kontaktformulare versorgen Ihr CRM. Veranstaltungsseiten stellen eine Verbindung zu Ihrem Veranstaltungsverwaltungsmodul her. Dieser Leitfaden behandelt alle Aspekte der Erstellung, Verwaltung und Optimierung von Websites mit Odoo.

Wichtige Erkenntnisse

• Odoo Website Builder verwendet einen blockbasierten Drag-and-Drop-Editor mit über 150 vorgefertigten Inhaltsblöcken
• Themen bieten eine grundlegende Designgrundlage, die auf jeder Ebene angepasst werden kann, einschließlich Farben, Schriftarten, Abstände und Layout
• Im Seiteneditor sind SEO-Tools mit Echtzeit-Meta-Tag-Verwaltung, URL-Strukturkontrolle und Sitemap-Generierung integriert
• Die E-Commerce-Integration erfolgt nativ und ruft Produktdaten, Preise und Inventar direkt aus Ihrer Odoo-Datenbank ab
• Die Blog-Engine unterstützt die Veröffentlichung durch mehrere Autoren mit Kategorien, Tags und SEO-freundlichen URL-Strukturen

Erste Schritte mit der Odoo-Website

Aktivieren des Website-Moduls

Installieren Sie das Website-Modul über Apps > Website. Bei der ersten Installation präsentiert Odoo einen Setup-Assistenten:

1. Wählen Sie ein Thema: Wählen Sie aus kostenlosen und Premium-Themen aus, die die gesamte Designsprache bestimmen
2. Firmeninformationen konfigurieren: Firmenname, Logo und Kontaktdaten werden automatisch in Kopf- und Fußzeile eingetragen
3. Funktionen auswählen: Blog-, E-Commerce-, Forum-, Veranstaltungs- und andere Website-Funktionen aktivieren oder deaktivieren
4. Domäne festlegen: Konfigurieren Sie Ihren benutzerdefinierten Domänennamen für die Produktionsverwendung

Navigieren Sie nach der Einrichtung zu Website > Dashboard, um auf den Website-Management-Hub zuzugreifen, der Seiten, Verkehrsanalysen und E-Commerce-Metriken anzeigt.

Der Seiteneditor

Der Drag-and-Drop-Editor wird aktiviert, wenn Sie auf einer beliebigen Seite auf Bearbeiten klicken. Die Editoroberfläche besteht aus:

Blockfeld (linke Seitenleiste): Durchsuchen Sie Inhaltsblöcke und ziehen Sie sie auf die Seite. Blöcke sind nach Kategorien organisiert: Kopfzeilen, Funktionen, Text, Bilder, Erfahrungsberichte, Preise, Handlungsaufforderungen und Fußzeilen.

Eigenschaftenfenster (rechte Seitenleiste): Konfigurieren Sie die Eigenschaften des ausgewählten Elements, einschließlich Abstand, Farben, Animationen, Sichtbarkeitsbedingungen und Reaktionsverhalten.

Inline-Bearbeitung: Klicken Sie auf einen beliebigen Text, um ihn direkt auf der Seite zu bearbeiten. Textformatierungswerkzeuge werden in einer schwebenden Symbolleiste angezeigt.

Layout-Tools: Raster- und Spaltensteuerelemente für eine präzise Layoutverwaltung. Jeder Abschnitt unterstützt konfigurierbare Spaltenanzahlen (1–6) mit benutzerdefinierten Breitenverhältnissen.

Seitendesign und Inhalt

Inhaltsblöcke

Odoo 19 umfasst über 150 Inhaltsblöcke, die in die folgenden Kategorien unterteilt sind:

Dynamischer Inhalt

Dynamische Inhaltsblöcke beziehen Daten aus Ihrer Odoo-Datenbank:

• Produktpräsentation: Zeigt Produkte aus Ihrem Katalog mit Preisen und Verfügbarkeit in Echtzeit an
• Blogbeiträge: Zeigt aktuelle oder vorgestellte Blogeinträge mit Auszügen und Bildern an
• Veranstaltungen: Listet bevorstehende Veranstaltungen mit Registrierungsschaltflächen auf
• Stellenausschreibungen: Zeigt offene Stellen aus dem Rekrutierungsmodul an
• Kundenreferenzen: Wird aus einer verwalteten Testimonials-Datenbank abgerufen

Dynamische Blöcke werden automatisch aktualisiert, wenn sich die zugrunde liegenden Daten ändern. Das Hinzufügen eines neuen Blog-Beitrags wirkt sich sofort auf Seiten aus, die den Blog-Block verwenden.

Benutzerdefiniertes HTML/CSS

Für erweiterte Anpassungen über den visuellen Editor hinaus bietet Odoo:

• HTML-Block: Fügen Sie benutzerdefiniertes HTML an einer beliebigen Stelle auf einer Seite ein
• Benutzerdefiniertes CSS: Fügen Sie seitenspezifisches oder websiteweites CSS unter Website > Konfiguration > Einstellungen > Benutzerdefiniertes CSS hinzu
• Benutzerdefiniertes JavaScript: Fügen Sie Tracking-Skripte, Widgets oder interaktive Elemente hinzu

Greifen Sie auf den Code-Editor zu, indem Sie einen Block auswählen und auf den Schalter „Codeansicht“ klicken. Benutzerdefinierter Code bleibt bei allen Theme-Änderungen bestehen, obwohl Theme-Updates möglicherweise CSS-Anpassungen erfordern.

Theme-Anpassung

Theme-Einstellungen

Passen Sie das aktive Theme unter Website > Konfiguration > Theme an:

Farben: Definieren Sie Primär-, Sekundär-, Akzent- und Hintergrundfarben. Das Design wendet diese Farben konsistent auf alle Blöcke und UI-Elemente an. Odoo generiert aus Ihrer Auswahl eine vollständige Farbpalette, einschließlich Hover-Status, Textfarben und Rahmenfarben.

Typografie: Wählen Sie Schriftfamilien für Überschriften und Fließtext aus Google Fonts oder laden Sie benutzerdefinierte Schriftarten hoch. Legen Sie Grundgrößen, Zeilenhöhen und Buchstabenabstände fest.

Layout: Konfigurieren Sie Inhaltsbreite, Abschnittsabstand, Rahmenradius und Schattenstile, die global gelten.

Schaltflächen: Gestalten Sie primäre und sekundäre Schaltflächen mit benutzerdefinierten Farben, Rahmenradius, Polsterung und Hover-Effekten.

Responsives Design

Jeder Block in Odoo reagiert standardmäßig. Der Editor bietet drei Vorschaumodi:

• Desktop: Ansicht in voller Breite für Bildschirme über 1200 Pixel
• Tablet: Mittlere Ansicht für Bildschirme mit 768–1199 Pixeln
• Mobil: Schmale Ansicht für Bildschirme unter 768 Pixel

Mit dem Sichtbarkeitsschalter im Eigenschaftenfenster können Elemente an bestimmten Haltepunkten ausgeblendet werden. Spaltenlayouts werden auf Mobilgeräten automatisch vertikal gestapelt, sofern sie nicht überschrieben werden.

SEO-Konfiguration

SEO auf Seitenebene

Jede Seite verfügt über SEO-Steuerelemente, auf die über die Registerkarte Bewerben im Seiteneditor zugegriffen werden kann:

• Meta-Titel: Das in den Suchergebnissen angezeigte Titel-Tag (empfohlen 50–60 Zeichen)
• Meta-Beschreibung: Die in den Suchergebnissen angezeigte Beschreibung (empfohlen 150–160 Zeichen)
• URL-Slug: Der URL-Pfad der Seite (automatisch aus dem Titel generiert, editierbar)
• Kanonische URL: Geben Sie die kanonische Version für Seiten mit mehreren URLs an
• Indexierung: Schalten Sie um, ob die Seite in Suchmaschinenindizes erscheinen soll

Technisches SEO

Odoo erfüllt mehrere technische SEO-Anforderungen automatisch:

• Sitemap.xml: Wird automatisch bei /sitemap.xml mit allen indizierten Seiten generiert
• Robots.txt: Standardmäßig erlaubt robots.txt alle Crawler; Anpassen unter Website > Konfiguration > SEO
• Strukturierte Daten: Produktseiten enthalten automatisch JSON-LD-Schema-Markup
• Saubere URLs: SEO-freundliche URL-Struktur mit konfigurierbaren Slugs
• 301-Weiterleitungen: Konfigurieren Sie Weiterleitungen unter Website > Konfiguration > Weiterleitungen
• Hreflang-Tags: Wird automatisch für mehrsprachige Websites generiert

Bildoptimierung

Odoo 19 optimiert Bilder automatisch:

• WebP-Konvertierung: Hochgeladene Bilder werden unterstützten Browsern als WebP bereitgestellt
• Responsive Bilder: Das Attribut srcset liefert Bilder in angemessener Größe pro Gerät
• Verzögertes Laden: Bilder, die unterhalb des Falzes angezeigt werden, werden beim Scrollen geladen
• Alt-Text: Das Bildeigenschaftenfenster enthält Alt-Textfelder für Barrierefreiheit und SEO

E-Commerce-Integration

Produktseiten

Produktseiten auf der Odoo-Website beziehen Daten direkt aus Ihrem Produktkatalog. Hauptmerkmale:

• Produktvarianten: Farb-, Größen- und andere Variantenauswahl mit variantenspezifischen Bildern und Preisen
• Bestandsanzeige: Echtzeit-Bestandsstatus (auf Lager, geringer Lagerbestand, nicht vorrätig)
• Dynamische Preisgestaltung: Preisaktualisierung basierend auf Preislisten, Werbeaktionen und Kundengruppen
• Produktvergleich: Direkter Vergleich von bis zu vier Produkten
• Rezensionen und Bewertungen: Kundenbewertungssystem mit Moderation

Warenkorb und Kasse

Der Checkout-Ablauf lässt sich in die Vertriebs-, Buchhaltungs- und Versandmodule von Odoo integrieren:

1. Warenkorb: Ajax-basiertes Add-to-Cart mit Mini-Cart-Dropdown
2. Versand: Berechnung der Versandkosten in Echtzeit von konfigurierten Spediteuren
3. Zahlung: Mehrere Zahlungsanbieter (Stripe, PayPal, Authorize.net, Banküberweisung)
4. Auftragsbestätigung: Automatische Auftragserstellung im Vertriebsmodul
5. Rechnung: Automatische Rechnungserstellung im Buchhaltungsmodul

Katalogverwaltung

Verwalten Sie Ihren Online-Katalog unter Website > E-Commerce > Produkte:

• Veröffentlicht/unveröffentlicht: Steuern Sie, welche Produkte auf der Website erscheinen
• Kategorien: Organisieren Sie Produkte zur Navigation in hierarchische Kategorien
• Attribute und Filter: Facettenfilterung nach Produktattributen aktivieren
• Sortieroptionen: Standardsortierung konfigurieren (Preis, Name, Neueste, Bestseller)
• Produktvorlagen: Steuern Sie das Layout und die Informationsanzeige pro Produktkategorie

Blog-Management

Blogbeiträge erstellen

Die Blog-Engine unter Website > Blog unterstützt die Veröffentlichung durch mehrere Autoren:

1. Erstellen Sie einen neuen Beitrag über die Blog-Indexseite oder das Backend
2. Schreiben Sie Inhalte mit demselben Drag-and-Drop-Editor wie bei normalen Seiten
3. Legen Sie Metadaten fest: Autor, Kategorie, Tags, Veröffentlichungsdatum
4. Vorschau und Veröffentlichung

Blog-SEO

Blogbeiträge enthalten zusätzliche SEO-Kontrollen:

• Autoren-Markup: Schema.org-Personen-Markup für Autorenseiten
• Artikelschema: BlogPosting strukturierter Daten mit datePublished, dateModified und Autor
• Open Graph-Tags: Social-Sharing-Metadaten für Facebook, Twitter und LinkedIn
• Auszugskontrolle: Definieren Sie den Auszug, der in Suchergebnissen und Social Shares angezeigt wird

Content-Strategie

Odoos Blog unterstützt Content-Marketing-Workflows:

• Entwurfs-/Veröffentlichungsstatus: Schreiben und überprüfen Sie Beiträge vor der Veröffentlichung
• Geplante Veröffentlichung: Legen Sie zukünftige Veröffentlichungstermine fest
• Kategorien und Tags: Organisieren Sie Inhalte für Navigation und SEO
• Ähnliche Beiträge: Schlagen Sie automatisch verwandte Inhalte basierend auf Tags und Kategorien vor

Mehrsprachige Websites

Sprachkonfiguration

Konfigurieren Sie Website-Sprachen unter Website > Konfiguration > Sprachen:

1. Installieren Sie die gewünschten Sprachen aus der Sprachliste
2. Aktivieren Sie Sprachen für das Website-Frontend
3. Legen Sie die Standardsprache fest
4. URL-Strategie konfigurieren (Unterverzeichnis /fr/ oder Subdomain fr.example.com)

Übersetzungsworkflow

Übersetzen Sie Website-Inhalte mit dem Frontend-Editor:

1. Wechseln Sie mit der Sprachauswahl zur Zielsprache
2. Klicken Sie auf Übersetzen, um in den Übersetzungsmodus zu wechseln
3. Übersetzbare Textblöcke werden gelb hervorgehoben
4. Klicken Sie auf jeden Block und geben Sie die Übersetzung ein
5. Übersetzungen pro Seite speichern

Das Backend bietet eine Funktion zum Exportieren/Importieren von Übersetzungen für Massenübersetzungsworkflows unter Einstellungen > Übersetzungen.

Leistungsoptimierung

Integrierte Optimierungen

Odoo 19 enthält mehrere Leistungsfunktionen:

• CDN-Unterstützung: Konfigurieren Sie ein CDN unter Website > Konfiguration > Einstellungen für die Bereitstellung statischer Assets
• Asset-Minimierung: CSS und JavaScript werden in der Produktion automatisch minimiert
• Seiten-Caching: Ganzseitiges Caching für anonyme Besucher
• Optimierung von Datenbankabfragen: Website-Seiten generieren optimierte Abfragen über das ORM

Best Practices für die Leistung

• Bilder vor dem Hochladen optimieren (unter 200 KB für die meisten Inhaltsbilder)
• Beschränken Sie benutzerdefiniertes JavaScript auf die wesentlichen Funktionen
• Verwenden Sie nach Möglichkeit die integrierten Blöcke von Odoo anstelle von benutzerdefiniertem HTML
• Aktivieren Sie CDN für Websites mit internationalem Datenverkehr
• Überwachen Sie die Seitenladezeiten über Website > Berichterstellung > Analysen

ECOSIRE Website-Dienste

Der Aufbau einer effektiven Website innerhalb von Odoo erfordert sowohl Design-Expertise als auch ERP-Kenntnisse. Zu den Odoo-Anpassungsdiensten von ECOSIRE gehören die Entwicklung benutzerdefinierter Themes, die Blockerstellung und die E-Commerce-Optimierung. Unser Implementierungsteam kümmert sich um die komplette Website-Einrichtung vom Design bis zur Einführung und stellt sicher, dass sich Ihre Website nahtlos in Ihre Geschäftsabläufe integriert.

Verwandte Lektüre

• Odoo-Website- und E-Commerce-SEO-Leitfaden
• Odoo eCommerce für Mode und Bekleidung
• Multi-Channel-Verkauf mit Odoo
• Odoo Retourenmanagement für E-Commerce
• Odoo Shopify-Integrationsleitfaden

Kann ich eine benutzerdefinierte Domain mit dem Website-Builder von Odoo verwenden?

Ja. Konfigurieren Sie Ihre benutzerdefinierte Domain unter Website > Konfiguration > Einstellungen. Verweisen Sie die DNS-Einträge Ihrer Domain auf Ihren Odoo-Server (Ein Eintrag für selbst gehostet, CNAME für Odoo.sh). SSL-Zertifikate werden automatisch auf Odoo.sh verarbeitet oder können für selbst gehostete Bereitstellungen manuell konfiguriert werden.

Unterstützt der Odoo-Website-Builder die Mitgliedschaft oder geschützte Inhalte?

Odoo unterstützt Gated Content über das Portal-Zugriffssystem. Seiten können auf angemeldete Benutzer beschränkt werden und bestimmte Inhaltsblöcke können basierend auf Benutzergruppen bedingt angezeigt werden. Für die vollständige Funktionalität der Mitgliedschaftsseite (kostenpflichtiger Zugriff, abgestufte Inhalte) erweitern benutzerdefinierte Entwicklungs- oder Community-Module die Basisfunktionalität.

Wie ist die Leistung der Odoo-Website im Vergleich zu eigenständigen Buildern wie WordPress?

Odoo-Websites laden vergleichbar mit WordPress-Websites mit ähnlicher Inhaltskomplexität. Der Vorteil besteht darin, dass Odoo dynamische Geschäftsdaten (Produkte, Lagerbestände, Preise) ohne externe API-Aufrufe bereitstellt, da sich alles in derselben Datenbank befindet. Bei inhaltsintensiven Websites sind CDN-Konfiguration und Bildoptimierung für wettbewerbsfähige Ladezeiten unerlässlich.