Wissensdatenbank

Erhalten Sie professionelles Website-Hosting

Entscheiden Sie sich für Website-Zuverlässigkeit und Kompetenz mit SiteGround!

Start / E-Commerce / Wie fügt man Inhalte zu einer Seite hinzu

Wie fügt man Inhalte zu einer Seite hinzu

Fassen Sie diesen Artikel zusammen mit:
Zuletzt aktualisiert: Jun 25, 2026 2 Minuten Lesezeit

Um Inhalte zu einer Seite hinzuzufügen, haben Sie zwei Möglichkeiten:

  • Sie können einen vorgefertigten Abschnitt hinzufügen, in dem Sie neue Komponenten einfügen oder die vorhandenen bearbeiten, um Platzhaltertexte und -bilder zu ersetzen
  • Sie können einen leeren Abschnitt hinzufügen und diesen anschließend mit neuen Komponenten füllen

So fügen Sie einen Abschnitt zu einer Seite hinzu

Um einen Abschnitt zu einer Seite hinzuzufügen, gehen Sie wie folgt vor:

  1. Klicken Sie auf „Website bearbeiten“ im Site Admin, um den Website Builder zu öffnen.
    Edit Website button in Site Admin for accessing the Website Builder editor
  2. Öffnen Sie den Tab „Seiten“ in der linken Menüleiste und wählen Sie eine bestehende Seite aus oder erstellen Sie eine neue mit der Schaltfläche „Neu hinzufügen“.
    Pages tab in Website Builder displaying a highlighted Add New button for creating a new page and a selected existing page
  3. Navigieren Sie im visuellen Editor rechts zu dem Bereich der Seite, in dem Sie einen Abschnitt hinzufügen möchten, und klicken Sie auf „Abschnitt hinzufügen“. Wenn Sie eine neue leere Seite erstellt haben, werden Sie aufgefordert, Ihren ersten Abschnitt hinzuzufügen.
    Add Section button for adding a new section to a page in Website Builder
  4. Wählen Sie im Pop-up-Fenster eines der verfügbaren vorgefertigten Layouts aus den Kategorien aus. Bewegen Sie den Mauszeiger über das gewünschte Layout und klicken Sie auf die Schaltfläche „Abschnitt hinzufügen“.
    Alternativ können Sie einen leeren Abschnitt hinzufügen, indem Sie auf die Schaltfläche „Leeren Abschnitt hinzufügen“ klicken.

    A pop-up window for adding a section highlighting a selected category and the Add Section button for choosing a section layout
  5. Nach dem Hinzufügen des Abschnitts bewegen Sie den Mauszeiger darüber und klicken auf das Symbol „Abschnitt bearbeiten“ in der oberen rechten Toolbar, um die allgemeinen Darstellungseinstellungen zu ändern.
    Selected section of a page in Website Builder displaying the Edit Section button from the section's toolbar
  6. Um die Position der Komponenten innerhalb des Abschnitts zu ändern, ziehen Sie diese einfach per Drag & Drop an die gewünschte Stelle im Raster.
    Grid area of a section on a page in Website Builder where you can drag and drop components into a preferred position
  7. Wenn Sie auf das Symbol „Abschnitt bearbeiten“ klicken, öffnet sich rechts ein Pop-up-Fenster, in dem Sie die Abschnittseinstellungen verwalten können. Im Tab „Allgemein“ können Sie Einstellungen wie Innenabstand, Abstände zwischen Komponenten usw. ändern. Im Tab „Design“ können Sie Farbpalette, Hintergrundfarbe und weitere Gestaltungseinstellungen anpassen.
    A section's settings window where you can change the appearance and design
  8. Um einen Text zu bearbeiten und zu formatieren, klicken Sie direkt darauf. Daraufhin erscheint oben ein Menü mit Formatierungsoptionen. Dort können Sie die Textgröße ändern, Links hinzufügen oder sogar KI-Text generieren.
    A section of a page in Website Builder with a highlighted text displaying a toolbar with editing options
  9. Klicken Sie auf ein Platzhalterbild, das Sie bearbeiten möchten, um die Einstellungen zum Bearbeiten des Bildes zu öffnen. Sie können das Bild ersetzen, indem Sie in der Bildvorschau auf die Schaltfläche „Aktualisieren“ klicken, einen Link oder einen Alternativtext hinzufügen, die Hintergrundfarbe oder die Bildform ändern usw.
    A selected image from a page section in Website Builder displaying a settings screen with the option Update that allows you to replace the image
  10. Wenn Sie weitere Bilder, Textfelder oder andere Komponenten zum selben Abschnitt hinzufügen möchten, verwenden Sie die Schaltfläche „Hinzufügen“ links.
    An Add button in a page section in Website Builder that allows you to add components to the section
  11. Um einen neuen Abschnitt oberhalb oder unterhalb des aktuellen Abschnitts hinzuzufügen, klicken Sie auf eine der Schaltflächen „Abschnitt hinzufügen“.
    An Add Section button on a page in Website Builder for adding a new section

So fügen Sie eine Komponente hinzu

Mit Komponenten können Sie das Seitendesign individueller gestalten. Jede Komponente ist ein einzelnes Inhaltselement, das Sie zu einem vorgefertigten oder leeren Abschnitt hinzufügen können.

So fügen Sie eine Komponente hinzu:

  1. Bewegen Sie den Mauszeiger über den gewünschten Abschnitt und klicken Sie auf die Schaltfläche „Hinzufügen“ oben links.
    A selected page section in Website Builder with a highlighted Add button in the top-left corner for adding a component
  2. Wählen Sie im Pop-up-Fenster „Komponente hinzufügen“ den gewünschten Komponententyp aus.
    Add Component window with a selected component type
  3. Ziehen Sie die Komponente an die gewünschte Position im Rasterbereich des Abschnitts.
    A section's grid area where you can drag and drop a component into a new position
  4. Klicken Sie auf die Komponente, um deren Symbolleiste zu öffnen, und wählen Sie das Symbol „Bearbeiten“ (Bleistift) aus. Daraufhin werden die komponentenspezifischen allgemeinen Einstellungen angezeigt.
    A selected component displaying its settings window with component-specific settings
  5. Ändern Sie nun den Text. Markieren oder löschen Sie den Platzhaltertext. Über dem ausgewählten Bereich erscheint eine Symbolleiste mit textspezifischen Optionen. Sie können Ihren eigenen Text eingeben und verschiedene Stile und Schriftarten anwenden, Links hinzufügen, von KI generierten Text verwenden usw.
    A component with highlighted placeholder text that you can edit. Above the text is a toolbar with editing options
  6. Klicken Sie auf ein Bild innerhalb der Komponente, um es zu bearbeiten. Sie können das Platzhalterbild ersetzen, indem Sie mit der Maus über die Bildvorschau fahren und auf die Schaltfläche „Aktualisieren“ klicken, einen Link und einen Alternativtext hinzufügen, die Hintergrundfarbe ändern sowie weitere Einstellungen vornehmen.
    A selected image inside a component that displays a settings window where you can edit the image or replace it with the Update button
  7. Fügen Sie weitere Komponenten mit der Schaltfläche „Hinzufügen“ hinzu, bis Sie das gewünschte Design erreicht haben.
    A page section in Website Builder with a highlighted Add button for adding more components to the section

Diesen Artikel teilen