Hinweis: Dieser Artikel wird aus Kulanz zur Verfügung gestellt. Er wurde automatisch mit einer Software übersetzt und unter Umständen nicht korrekturgelesen. Die englischsprachige Fassung gilt als offizielle Version und Sie können dort die aktuellsten Informationen finden. Hier können Sie darauf zugreifen.
Landing Pages

Seiteninhalte in einem Drag-&-Drop-Bereich bearbeiten

Zuletzt aktualisiert am: Mai 28, 2020

Produkte/Lizenzen

Marketing Hub  Starter, Professional, Enterprise
CMS Hub  Professional, Enterprise

Mit Drag-&-Drop-Bearbeitung können Sie Ihr Layout problemlos neu anordnen und benutzerdefinierte Hintergrundstile auf verschiedene Abschnitte Ihrer Seite anwenden. Die Bearbeitung per Drag-&-Drop ist auf Seiten verfügbar, die mit einer Starter-Vorlage, einer Standard-Designvorlage von HubSpot oder einer Code-Vorlage mit einem Drag-&-Drop-Bereich erstellt wurden.

Dieser Artikel erläutert die Bearbeitung der Inhalte und des Layouts Ihrer Seite mithilfe von Drag-&-Drop-Bearbeitungsfunktionen. Erfahren Sie, wie Sie Ihre Seiteneinstellungen bearbeiten und eine Seite auf Ihrer Website veröffentlichen.

So funktioniert die Drag-&-Drop-Bearbeitung

Drag-&-Drop-Bereiche bestehen aus Blöcken an Website-Inhalt, Module genannt. Diese Module können in horizontalen Zeilen oder in vertikalen Spalten angeordnet werden. Zeilen und Spalten können in Elementbereiche gruppiert werden.

Indem Sie diese Elemente zusammen gruppieren, können Sie Hintergrundstile auf einen ganzen Bereich Ihrer Seite anwenden. Sie können auch ganze Zeilen, Spalten oder Abschnitte per Drag-&-Drop verschieben, um das Layout Ihrer Landing-Page neu zu gestalten.

  1. Modul: ein einzelner Block an Website-Inhalt. Sie können den Text und die Bilder Ihrer Seite innerhalb eines einzelnen Moduls bearbeiten.
  2. Spalte: ein vertikaler Stapel aus mehreren Modulen oder Zeilen. Sie können Spalten auf Ihrer Seite verschieben oder neu anordnen und eine Hintergrundfarbe oder einen Hintergrundstil auf eine gesamte Spalte anwenden.
  3. Zeile: eine horizontale Zeile von Modulen oder Spalten. Sie können Zeilen auf Ihrer Seite verschieben oder neu anordnen und eine Hintergrundfarbe oder einen Hintergrundstil auf eine gesamte Zeile anwenden.
  4. Abschnitt: eine Gruppe mehrerer Zeilen oder Spalten. Sie können einen gesamten Abschnitt verschieben oder eine Hintergrundfarbe oder einen Hintergrundstil auf einen gesamten Abschnitt anwenden.

overview-of-drag-and-drop

Modulinhalte bearbeiten

Um Inhalte in einem Modul anzupassen, bewegen Sie den Mauszeiger über das Modul und klicken Sie auf das Symbol für die gewünschte Aktion:

  • edit Bearbeiten: Bearbeiten Sie die Inhalte Ihres Moduls inline direkt auf der Seite oder im linken Bereich. Für ein immersivere Bearbeitungserfahrung können Sie
  • styles Stil: Verwalten Sie die in diesem Modul verfügbaren Stile im Bereich „Stil“ auf der linken Seite. Die meisten Modulstile können auf der Registerkarte „Stil“ verwaltet werden, einige für Ihr Design spezifische Stiloptionen sind jedoch in der Registerkarte „Optionen“ verfügbar.
  • clonduplicate Kopieren: Erstellen Sie eine Kopie dieses Moduls auf Ihrer Seite.
  • delete Löschen: Entfernen dieses Moduls von Ihrer Seite.

edit-module

Zeilen, Spalten oder Abschnitte bearbeiten

Sie können die Stile einer gesamten Zeile, einer gesamten Spalte oder eines gesamten Abschnitts an Elementen bearbeiten. Sie können beispielsweise Ihre Inhalte zentrieren, ein paar Hintergrundbild anwenden oder den Abstand um die Elemente auf Ihrer Seite bearbeiten.

So bearbeiten Sie Stile für eine Zeile, eine Spalte oder einen Abschnitt:

  • Bewegen Sie den Mauszeiger im Seiten-Editor über die Zeile, die Spalte oder den Abschnitt und klicken Sie dann auf den Dropdown-Pfeil. Wählen Sie dann styles „[Zeile/Spalte/Abschnitt] formatieren“ aus.
  • Klicken Sie im linken Bereich auf „Ausrichtung und Abstand“, um die Auffüllung und den Rand um die Zeile, die Spalte oder den Abschnitt anzupassen.
  • Klicken Sie auf „Hintergrund“, um die Stiloptionen für den Hintergrund dieses Abschnitts zu erweitern:
    • Keine: Wählen Sie diese Option aus, um alle Hintergrundfarben oder -bilder zu entfernen.
    • Farbe: Wählen Sie diese Option aus, um eine einzelne Farbe als Hintergrund festzulegen. Geben Sie einen Wert für die Hintergrundfarbe sowie einen Prozentsatz für die Transparenz ein.
    • Bild: Wählen Sie diese Option aus, um ein Bild als Hintergrund festzulegen. Wenn in der Vorlage ein Bild als Standard festgelegt ist, klicken Sie auf „Ersetzen“, um das Bild zu ändern. Um eine neues Bild hochzuladen, klicken Sie auf „Hochladen“, um ein Bild von Ihrem Computer hinzuzufügen, oder klicken Sie auf „Bilder durchsuchen“, um aus Ihren Dateien ein Bild auszuwählen.
    • Farbverlauf: Wählen Sie einen Farbverlauf aus, um den Übergang von einer Farbe in eine andere als Hintergrund festzulegen. Wählen Sie zuerst die Richtung des Verlaufs aus. Geben Sie dann einen Hexadezimal-Wert ein und legen Sie die Transparenz für die einzelnen Farben fest.
  • Um eine Kopie eines vorhandenen Elements zu erstellen, bewegen Sie den Mauszeiger über das Element und klicken Sie auf das Pfeil-Symbol. Wählen Sie dann duplicate „[Zeile/Spalte/Abschnitt] kopieren“ aus.
  • Um ein Element von Ihrer Seite zu löschen, bewegen Sie den Mauszeiger über das Element und klicken Sie auf das Pfeil-Symbol. Wählen Sie dann delete „[Zeile/Spalte/Abschnitt] löschen“ aus.

remove-a-column

Beim Bearbeiten Ihrer Seite werden Ihre Änderungen automatisch gespeichert. Um zuvor gespeicherte Entwürfe Ihrer nicht veröffentlichten Seite aufzurufen, bewegen Sie den Mauszeiger über „“ und klicken Sie auf „Revisionen“.

Module zu Ihrer Seite hinzufügen

Sie können ein neues Modul per Drag-&-Drop an die gewünschte Stelle verschieben, um ein weiteres Element zu Ihrer Seite hinzuzufügen. Dies erleichtert Ihnen die Anpassung des Designs einer Seite an Ihre Inhalte.

add%20a%20common%20module%20to%20a%20page

Layout Ihrer Seite anpassen

Wenn Sie Module zu Ihrem Layout hinzufügen und bearbeiten, können Sie die Breite der Elemente auf Ihrer Seite anpassen, indem Sie auf den vertikalen Trenner zwischen Spalten klicken und ihn die gewünschte Stelle ziehen.

edit%20column%20width%20in%20page

Seitenstile bearbeiten

Um die Farben, Schriftarten oder Abstände auf Ihrer Seite zu bearbeiten, klicken Sie auf die Registerkarte „Design“.
  • Wenn Sie eine Starter-Vorlage verwenden, können Sie die Schriftarten, Stile und Farben, die auf Ihren Text, Ihre Formulare und Ihre Schaltflächen angewendet werden, auf der Registerkarte „Design“ im linken Bereich ändern.
  • Wenn Sie eine von einem Entwickler erstellte Code-Vorlage mit einem Drag-&-Drop-Bereich verwenden, sehen Sie die Stiloptionen, die von Ihrem Entwickler in Ihrer Vorlage berücksichtigt wurden.
  • Wenn Sie eine Designvorlage verwenden (nur CMS Hub), können Sie Ihre Designeinstellungen aufrufen und bearbeiten.

design-tab-options

/de/cms-general/create-and-edit-pages-with-the-drag-and-drop-editor